@angular/cdk-experimental 14.0.0-next.9 → 14.0.0-rc.2

package/fesm2020/menu.mjs

@@ -1,1954 +0,0 @@
-import * as i0 from '@angular/core';
-import { InjectionToken, Optional, SkipSelf, Inject, Injectable, Directive, EventEmitter, Injector, Self, Input, Output, ContentChildren, NgModule } from '@angular/core';
-import * as i1 from '@angular/cdk/overlay';
-import { OverlayConfig, STANDARD_DROPDOWN_BELOW_POSITIONS, STANDARD_DROPDOWN_ADJACENT_POSITIONS, OverlayModule } from '@angular/cdk/overlay';
-import { UP_ARROW, DOWN_ARROW, LEFT_ARROW, RIGHT_ARROW, ENTER, SPACE, TAB, ESCAPE, hasModifierKey } from '@angular/cdk/keycodes';
-import * as i1$1 from '@angular/cdk/bidi';
-import { filter, takeUntil, startWith, mergeMap, mapTo, mergeAll, switchMap, take, skip } from 'rxjs/operators';
-import * as i1$2 from '@angular/cdk/collections';
-import { UniqueSelectionDispatcher } from '@angular/cdk/collections';
-import { coerceBooleanProperty } from '@angular/cdk/coercion';
-import { Subject, fromEvent, merge, defer, partition } from 'rxjs';
-import { TemplatePortal } from '@angular/cdk/portal';
-import { FocusKeyManager } from '@angular/cdk/a11y';
-
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-/** Injection token used to return classes implementing the Menu interface */
-const CDK_MENU = new InjectionToken('cdk-menu');
-
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-/** Injection token used for an implementation of MenuStack. */
-const MENU_STACK = new InjectionToken('cdk-menu-stack');
-/** A provider that provides the parent menu stack, or a new menu stack if there is no parent one. */
-const PARENT_OR_NEW_MENU_STACK_PROVIDER = {
-    provide: MENU_STACK,
-    deps: [[new Optional(), new SkipSelf(), new Inject(MENU_STACK)]],
-    useFactory: (parentMenuStack) => parentMenuStack || new MenuStack(),
-};
-/** A provider that provides the parent menu stack, or a new menu stack if there is no parent one. */
-const PARENT_OR_NEW_INLINE_MENU_STACK_PROVIDER = {
-    provide: MENU_STACK,
-    deps: [[new Optional(), new SkipSelf(), new Inject(MENU_STACK)]],
-    useFactory: (parentMenuStack) => parentMenuStack || MenuStack.inline(),
-};
-/**
- * MenuStack allows subscribers to listen for close events (when a MenuStackItem is popped off
- * of the stack) in order to perform closing actions. Upon the MenuStack being empty it emits
- * from the `empty` observable specifying the next focus action which the listener should perform
- * as requested by the closer.
- */
-class MenuStack {
-    constructor() {
-        /** All MenuStackItems tracked by this MenuStack. */
-        this._elements = [];
-        /** Emits the element which was popped off of the stack when requested by a closer. */
-        this._close = new Subject();
-        /** Emits once the MenuStack has become empty after popping off elements. */
-        this._empty = new Subject();
-        /** Observable which emits the MenuStackItem which has been requested to close. */
-        this.closed = this._close;
-        /**
-         * Observable which emits when the MenuStack is empty after popping off the last element. It
-         * emits a FocusNext event which specifies the action the closer has requested the listener
-         * perform.
-         */
-        this.emptied = this._empty;
-        this._hasInlineMenu = false;
-    }
-    static inline() {
-        const stack = new MenuStack();
-        stack._hasInlineMenu = true;
-        return stack;
-    }
-    /** @param menu the MenuStackItem to put on the stack. */
-    push(menu) {
-        this._elements.push(menu);
-    }
-    /**
-     * Pop items off of the stack up to and including `lastItem` and emit each on the close
-     * observable. If the stack is empty or `lastItem` is not on the stack it does nothing.
-     * @param lastItem the last item to pop off the stack.
-     * @param focusNext the event to emit on the `empty` observable if the method call resulted in an
-     * empty stack. Does not emit if the stack was initially empty or if `lastItem` was not on the
-     * stack.
-     */
-    close(lastItem, focusNext) {
-        if (this._elements.indexOf(lastItem) >= 0) {
-            let poppedElement;
-            do {
-                poppedElement = this._elements.pop();
-                this._close.next(poppedElement);
-            } while (poppedElement !== lastItem);
-            if (this.isEmpty()) {
-                this._empty.next(focusNext);
-            }
-        }
-    }
-    /**
-     * Pop items off of the stack up to but excluding `lastItem` and emit each on the close
-     * observable. If the stack is empty or `lastItem` is not on the stack it does nothing.
-     * @param lastItem the element which should be left on the stack
-     * @return whether or not an item was removed from the stack
-     */
-    closeSubMenuOf(lastItem) {
-        let removed = false;
-        if (this._elements.indexOf(lastItem) >= 0) {
-            removed = this.peek() !== lastItem;
-            while (this.peek() !== lastItem) {
-                this._close.next(this._elements.pop());
-            }
-        }
-        return removed;
-    }
-    /**
-     * Pop off all MenuStackItems and emit each one on the `close` observable one by one.
-     * @param focusNext the event to emit on the `empty` observable once the stack is emptied. Does
-     * not emit if the stack was initially empty.
-     */
-    closeAll(focusNext) {
-        if (!this.isEmpty()) {
-            while (!this.isEmpty()) {
-                const menuStackItem = this._elements.pop();
-                if (menuStackItem) {
-                    this._close.next(menuStackItem);
-                }
-            }
-            this._empty.next(focusNext);
-        }
-    }
-    /** Return true if this stack is empty. */
-    isEmpty() {
-        return !this._elements.length;
-    }
-    /** Return the length of the stack. */
-    length() {
-        return this._elements.length;
-    }
-    /** Get the top most element on the stack. */
-    peek() {
-        return this._elements[this._elements.length - 1];
-    }
-    hasInlineMenu() {
-        return this._hasInlineMenu;
-    }
-}
-MenuStack.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0-next.9", ngImport: i0, type: MenuStack, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-MenuStack.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.0.0-next.9", ngImport: i0, type: MenuStack });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0-next.9", ngImport: i0, type: MenuStack, decorators: [{
-            type: Injectable
-        }] });
-
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-/**
- * Throws an exception when an instance of the PointerFocusTracker is not provided.
- * @docs-private
- */
-function throwMissingPointerFocusTracker() {
-    throw Error('expected an instance of PointerFocusTracker to be provided');
-}
-/**
- * Throws an exception when a reference to the parent menu is not provided.
- * @docs-private
- */
-function throwMissingMenuReference() {
-    throw Error('expected a reference to the parent menu');
-}
-
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-/** Injection token used for an implementation of MenuAim. */
-const MENU_AIM = new InjectionToken('cdk-menu-aim');
-/** Capture every nth mouse move event. */
-const MOUSE_MOVE_SAMPLE_FREQUENCY = 3;
-/** The number of mouse move events to track. */
-const NUM_POINTS = 5;
-/**
- * How long to wait before closing a sibling menu if a user stops short of the submenu they were
- * predicted to go into.
- */
-const CLOSE_DELAY = 300;
-/** Calculate the slope between point a and b. */
-function getSlope(a, b) {
-    return (b.y - a.y) / (b.x - a.x);
-}
-/** Calculate the y intercept for the given point and slope. */
-function getYIntercept(point, slope) {
-    return point.y - slope * point.x;
-}
-/**
- * Whether the given mouse trajectory line defined by the slope and y intercept falls within the
- * submenu as defined by `submenuPoints`
- * @param submenuPoints the submenu DOMRect points.
- * @param m the slope of the trajectory line.
- * @param b the y intercept of the trajectory line.
- *
- * @return true if any point on the line falls within the submenu.
- */
-function isWithinSubmenu(submenuPoints, m, b) {
-    const { left, right, top, bottom } = submenuPoints;
-    // Check for intersection with each edge of the submenu (left, right, top, bottom)
-    // by fixing one coordinate to that edge's coordinate (either x or y) and checking if the
-    // other coordinate is within bounds.
-    return ((m * left + b >= top && m * left + b <= bottom) ||
-        (m * right + b >= top && m * right + b <= bottom) ||
-        ((top - b) / m >= left && (top - b) / m <= right) ||
-        ((bottom - b) / m >= left && (bottom - b) / m <= right));
-}
-/**
- * TargetMenuAim predicts if a user is moving into a submenu. It calculates the
- * trajectory of the user's mouse movement in the current menu to determine if the
- * mouse is moving towards an open submenu.
- *
- * The determination is made by calculating the slope of the users last NUM_POINTS moves where each
- * pair of points determines if the trajectory line points into the submenu. It uses consensus
- * approach by checking if at least NUM_POINTS / 2 pairs determine that the user is moving towards
- * to submenu.
- */
-class TargetMenuAim {
-    constructor(_ngZone) {
-        this._ngZone = _ngZone;
-        /** The last NUM_POINTS mouse move events. */
-        this._points = [];
-        /** Emits when this service is destroyed. */
-        this._destroyed = new Subject();
-    }
-    /** Set the Menu and its PointerFocusTracker. */
-    initialize(menu, pointerTracker) {
-        this._menu = menu;
-        this._pointerTracker = pointerTracker;
-        this._subscribeToMouseMoves();
-    }
-    /**
-     * Calls the `doToggle` callback when it is deemed that the user is not moving towards
-     * the submenu.
-     * @param doToggle the function called when the user is not moving towards the submenu.
-     */
-    toggle(doToggle) {
-        // If the menu is horizontal the sub-menus open below and there is no risk of premature
-        // closing of any sub-menus therefore we automatically resolve the callback.
-        if (this._menu.orientation === 'horizontal') {
-            doToggle();
-        }
-        this._checkConfigured();
-        const siblingItemIsWaiting = !!this._timeoutId;
-        const hasPoints = this._points.length > 1;
-        if (hasPoints && !siblingItemIsWaiting) {
-            if (this._isMovingToSubmenu()) {
-                this._startTimeout(doToggle);
-            }
-            else {
-                doToggle();
-            }
-        }
-        else if (!siblingItemIsWaiting) {
-            doToggle();
-        }
-    }
-    /**
-     * Start the delayed toggle handler if one isn't running already.
-     *
-     * The delayed toggle handler executes the `doToggle` callback after some period of time iff the
-     * users mouse is on an item in the current menu.
-     */
-    _startTimeout(doToggle) {
-        // If the users mouse is moving towards a submenu we don't want to immediately resolve.
-        // Wait for some period of time before determining if the previous menu should close in
-        // cases where the user may have moved towards the submenu but stopped on a sibling menu
-        // item intentionally.
-        const timeoutId = setTimeout(() => {
-            // Resolve if the user is currently moused over some element in the root menu
-            if (this._pointerTracker.activeElement && timeoutId === this._timeoutId) {
-                doToggle();
-            }
-            this._timeoutId = null;
-        }, CLOSE_DELAY);
-        this._timeoutId = timeoutId;
-    }
-    /** Whether the user is heading towards the open submenu. */
-    _isMovingToSubmenu() {
-        const submenuPoints = this._getSubmenuBounds();
-        if (!submenuPoints) {
-            return false;
-        }
-        let numMoving = 0;
-        const currPoint = this._points[this._points.length - 1];
-        // start from the second last point and calculate the slope between each point and the last
-        // point.
-        for (let i = this._points.length - 2; i >= 0; i--) {
-            const previous = this._points[i];
-            const slope = getSlope(currPoint, previous);
-            if (isWithinSubmenu(submenuPoints, slope, getYIntercept(currPoint, slope))) {
-                numMoving++;
-            }
-        }
-        return numMoving >= Math.floor(NUM_POINTS / 2);
-    }
-    /** Get the bounding DOMRect for the open submenu. */
-    _getSubmenuBounds() {
-        return this._pointerTracker?.previousElement
-            ?.getMenu()
-            ?._elementRef.nativeElement.getBoundingClientRect();
-    }
-    /**
-     * Check if a reference to the PointerFocusTracker and menu element is provided.
-     * @throws an error if neither reference is provided.
-     */
-    _checkConfigured() {
-        if (typeof ngDevMode === 'undefined' || ngDevMode) {
-            if (!this._pointerTracker) {
-                throwMissingPointerFocusTracker();
-            }
-            if (!this._menu) {
-                throwMissingMenuReference();
-            }
-        }
-    }
-    /** Subscribe to the root menus mouse move events and update the tracked mouse points. */
-    _subscribeToMouseMoves() {
-        this._ngZone.runOutsideAngular(() => {
-            fromEvent(this._menu._elementRef.nativeElement, 'mousemove')
-                .pipe(filter((_, index) => index % MOUSE_MOVE_SAMPLE_FREQUENCY === 0), takeUntil(this._destroyed))
-                .subscribe((event) => {
-                this._points.push({ x: event.clientX, y: event.clientY });
-                if (this._points.length > NUM_POINTS) {
-                    this._points.shift();
-                }
-            });
-        });
-    }
-    ngOnDestroy() {
-        this._destroyed.next();
-        this._destroyed.complete();
-    }
-}
-TargetMenuAim.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0-next.9", ngImport: i0, type: TargetMenuAim, deps: [{ token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Injectable });
-TargetMenuAim.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.0.0-next.9", ngImport: i0, type: TargetMenuAim });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0-next.9", ngImport: i0, type: TargetMenuAim, decorators: [{
-            type: Injectable
-        }], ctorParameters: function () { return [{ type: i0.NgZone }]; } });
-/**
- * CdkTargetMenuAim is a provider for the TargetMenuAim service. It should be added to an
- * element with either the `cdkMenu` or `cdkMenuBar` directive and child menu items.
- */
-class CdkTargetMenuAim {
-}
-CdkTargetMenuAim.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0-next.9", ngImport: i0, type: CdkTargetMenuAim, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-CdkTargetMenuAim.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "14.0.0-next.9", type: CdkTargetMenuAim, selector: "[cdkTargetMenuAim]", providers: [{ provide: MENU_AIM, useClass: TargetMenuAim }], exportAs: ["cdkTargetMenuAim"], ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0-next.9", ngImport: i0, type: CdkTargetMenuAim, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[cdkTargetMenuAim]',
-                    exportAs: 'cdkTargetMenuAim',
-                    providers: [{ provide: MENU_AIM, useClass: TargetMenuAim }],
-                }]
-        }] });
-
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-/** Injection token used for an implementation of MenuStack. */
-const MENU_TRIGGER = new InjectionToken('cdk-menu-trigger');
-class MenuTrigger {
-    constructor(injector, menuStack) {
-        this.injector = injector;
-        this.menuStack = menuStack;
-        /** Emits when the attached menu is requested to open */
-        this.opened = new EventEmitter();
-        /** Emits when the attached menu is requested to close */
-        this.closed = new EventEmitter();
-        /** A reference to the overlay which manages the triggered menu */
-        this._overlayRef = null;
-        /** Emits when this trigger is destroyed. */
-        this._destroyed = new Subject();
-        /** Emits when the outside pointer events listener on the overlay should be stopped. */
-        this._stopOutsideClicksListener = merge(this.closed, this._destroyed);
-    }
-    ngOnDestroy() {
-        this._destroyOverlay();
-        this._destroyed.next();
-        this._destroyed.complete();
-    }
-    /** Whether the attached menu is open. */
-    isOpen() {
-        return !!this._overlayRef?.hasAttached();
-    }
-    registerChildMenu(child) {
-        this.childMenu = child;
-    }
-    getChildMenuInjector() {
-        this._childMenuInjector =
-            this._childMenuInjector ||
-                Injector.create({
-                    providers: [
-                        { provide: MENU_TRIGGER, useValue: this },
-                        { provide: MENU_STACK, useValue: this.menuStack },
-                    ],
-                    parent: this.injector,
-                });
-        return this._childMenuInjector;
-    }
-    /** Destroy and unset the overlay reference it if exists */
-    _destroyOverlay() {
-        if (this._overlayRef) {
-            this._overlayRef.dispose();
-            this._overlayRef = null;
-        }
-    }
-}
-MenuTrigger.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0-next.9", ngImport: i0, type: MenuTrigger, deps: [{ token: i0.Injector }, { token: MENU_STACK }], target: i0.ɵɵFactoryTarget.Directive });
-MenuTrigger.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "14.0.0-next.9", type: MenuTrigger, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0-next.9", ngImport: i0, type: MenuTrigger, decorators: [{
-            type: Directive
-        }], ctorParameters: function () { return [{ type: i0.Injector }, { type: MenuStack, decorators: [{
-                    type: Inject,
-                    args: [MENU_STACK]
-                }] }]; } });
-
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-/**
- * Whether the target element is a menu item to be ignored by the overlay background click handler.
- */
-function isClickInsideMenuOverlay(target) {
-    while (target?.parentElement) {
-        const isOpenTrigger = target.getAttribute('aria-expanded') === 'true' &&
-            target.classList.contains('cdk-menu-trigger');
-        const isOverlayMenu = target.classList.contains('cdk-menu') && !target.classList.contains('cdk-menu-inline');
-        if (isOpenTrigger || isOverlayMenu) {
-            return true;
-        }
-        target = target.parentElement;
-    }
-    return false;
-}
-/**
- * A directive to be combined with CdkMenuItem which opens the Menu it is bound to. If the
- * element is in a top level MenuBar it will open the menu on click, or if a sibling is already
- * opened it will open on hover. If it is inside of a Menu it will open the attached Submenu on
- * hover regardless of its sibling state.
- *
- * The directive must be placed along with the `cdkMenuItem` directive in order to enable full
- * functionality.
- */
-class CdkMenuItemTrigger extends MenuTrigger {
-    constructor(injector, _elementRef, _viewContainerRef, _overlay, _ngZone, menuStack, _parentMenu, _menuAim, _directionality) {
-        super(injector, menuStack);
-        this._elementRef = _elementRef;
-        this._viewContainerRef = _viewContainerRef;
-        this._overlay = _overlay;
-        this._ngZone = _ngZone;
-        this._parentMenu = _parentMenu;
-        this._menuAim = _menuAim;
-        this._directionality = _directionality;
-        this._registerCloseHandler();
-        this._subscribeToMouseEnter();
-    }
-    /** Open/close the attached menu if the trigger has been configured with one */
-    toggle() {
-        this.isOpen() ? this.close() : this.open();
-    }
-    /** Open the attached menu. */
-    open() {
-        if (!this.isOpen()) {
-            this.opened.next();
-            this._overlayRef = this._overlayRef || this._overlay.create(this._getOverlayConfig());
-            this._overlayRef.attach(this._getPortal());
-            this._subscribeToOutsideClicks();
-        }
-    }
-    /** Close the opened menu. */
-    close() {
-        if (this.isOpen()) {
-            this.closed.next();
-            this._overlayRef.detach();
-        }
-        this._closeSiblingTriggers();
-    }
-    /**
-     * Get a reference to the rendered Menu if the Menu is open and it is visible in the DOM.
-     * @return the menu if it is open, otherwise undefined.
-     */
-    getMenu() {
-        return this.childMenu;
-    }
-    /**
-     * Subscribe to the mouseenter events and close any sibling menu items if this element is moused
-     * into.
-     */
-    _subscribeToMouseEnter() {
-        // Closes any sibling menu items and opens the menu associated with this trigger.
-        const toggleMenus = () => this._ngZone.run(() => {
-            this._closeSiblingTriggers();
-            this.open();
-        });
-        this._ngZone.runOutsideAngular(() => {
-            fromEvent(this._elementRef.nativeElement, 'mouseenter')
-                .pipe(filter(() => !this.menuStack.isEmpty() && !this.isOpen()), takeUntil(this._destroyed))
-                .subscribe(() => {
-                if (this._menuAim) {
-                    this._menuAim.toggle(toggleMenus);
-                }
-                else {
-                    toggleMenus();
-                }
-            });
-        });
-    }
-    /**
-     * Handles keyboard events for the menu item, specifically opening/closing the attached menu and
-     * focusing the appropriate submenu item.
-     * @param event the keyboard event to handle
-     */
-    _toggleOnKeydown(event) {
-        const keyCode = event.keyCode;
-        switch (keyCode) {
-            case SPACE:
-            case ENTER:
-                event.preventDefault();
-                this.toggle();
-                this.childMenu?.focusFirstItem('keyboard');
-                break;
-            case RIGHT_ARROW:
-                if (this._parentMenu && this._isParentVertical() && this._directionality?.value !== 'rtl') {
-                    event.preventDefault();
-                    this.open();
-                    this.childMenu?.focusFirstItem('keyboard');
-                }
-                break;
-            case LEFT_ARROW:
-                if (this._parentMenu && this._isParentVertical() && this._directionality?.value === 'rtl') {
-                    event.preventDefault();
-                    this.open();
-                    this.childMenu?.focusFirstItem('keyboard');
-                }
-                break;
-            case DOWN_ARROW:
-            case UP_ARROW:
-                if (!this._isParentVertical()) {
-                    event.preventDefault();
-                    this.open();
-                    keyCode === DOWN_ARROW
-                        ? this.childMenu?.focusFirstItem('keyboard')
-                        : this.childMenu?.focusLastItem('keyboard');
-                }
-                break;
-        }
-    }
-    /** Close out any sibling menu trigger menus. */
-    _closeSiblingTriggers() {
-        if (this._parentMenu) {
-            // If nothing was removed from the stack and the last element is not the parent item
-            // that means that the parent menu is a menu bar since we don't put the menu bar on the
-            // stack
-            const isParentMenuBar = !this.menuStack.closeSubMenuOf(this._parentMenu) &&
-                this.menuStack.peek() !== this._parentMenu;
-            if (isParentMenuBar) {
-                this.menuStack.closeAll();
-            }
-        }
-        else {
-            this.menuStack.closeAll();
-        }
-    }
-    /** Get the configuration object used to create the overlay */
-    _getOverlayConfig() {
-        return new OverlayConfig({
-            positionStrategy: this._getOverlayPositionStrategy(),
-            scrollStrategy: this._overlay.scrollStrategies.block(),
-            direction: this._directionality,
-        });
-    }
-    /** Build the position strategy for the overlay which specifies where to place the menu */
-    _getOverlayPositionStrategy() {
-        return this._overlay
-            .position()
-            .flexibleConnectedTo(this._elementRef)
-            .withPositions(this._getOverlayPositions());
-    }
-    /** Determine and return where to position the opened menu relative to the menu item */
-    _getOverlayPositions() {
-        return (this.menuPosition ??
-            (!this._parentMenu || this._parentMenu.orientation === 'horizontal'
-                ? STANDARD_DROPDOWN_BELOW_POSITIONS
-                : STANDARD_DROPDOWN_ADJACENT_POSITIONS));
-    }
-    /**
-     * Get the portal to be attached to the overlay which contains the menu. Allows for the menu
-     * content to change dynamically and be reflected in the application.
-     */
-    _getPortal() {
-        const hasMenuContentChanged = this._menuTemplateRef !== this._menuPortal?.templateRef;
-        if (this._menuTemplateRef && (!this._menuPortal || hasMenuContentChanged)) {
-            this._menuPortal = new TemplatePortal(this._menuTemplateRef, this._viewContainerRef, undefined, this.getChildMenuInjector());
-        }
-        return this._menuPortal;
-    }
-    /**
-     * @return true if if the enclosing parent menu is configured in a vertical orientation.
-     */
-    _isParentVertical() {
-        return this._parentMenu?.orientation === 'vertical';
-    }
-    /**
-     * Subscribe to the MenuStack close events if this is a standalone trigger and close out the menu
-     * this triggers when requested.
-     */
-    _registerCloseHandler() {
-        if (!this._parentMenu) {
-            this.menuStack.closed.pipe(takeUntil(this._destroyed)).subscribe(item => {
-                if (item === this.childMenu) {
-                    this.close();
-                }
-            });
-        }
-    }
-    /**
-     * Subscribe to the overlays outside pointer events stream and handle closing out the stack if a
-     * click occurs outside the menus.
-     */
-    _subscribeToOutsideClicks() {
-        if (this._overlayRef) {
-            this._overlayRef
-                .outsidePointerEvents()
-                .pipe(takeUntil(this._stopOutsideClicksListener))
-                .subscribe(event => {
-                if (!isClickInsideMenuOverlay(event.target)) {
-                    this.menuStack.closeAll();
-                }
-            });
-        }
-    }
-}
-CdkMenuItemTrigger.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0-next.9", ngImport: i0, type: CdkMenuItemTrigger, deps: [{ token: i0.Injector }, { token: i0.ElementRef }, { token: i0.ViewContainerRef }, { token: i1.Overlay }, { token: i0.NgZone }, { token: MENU_STACK }, { token: CDK_MENU, optional: true }, { token: MENU_AIM, optional: true }, { token: i1$1.Directionality, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
-CdkMenuItemTrigger.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "14.0.0-next.9", type: CdkMenuItemTrigger, selector: "[cdkMenuTriggerFor]", inputs: { _menuTemplateRef: ["cdkMenuTriggerFor", "_menuTemplateRef"], menuPosition: ["cdkMenuPosition", "menuPosition"] }, outputs: { opened: "cdkMenuOpened", closed: "cdkMenuClosed" }, host: { attributes: { "aria-haspopup": "menu" }, listeners: { "keydown": "_toggleOnKeydown($event)", "click": "toggle()" }, properties: { "attr.aria-expanded": "isOpen()" }, classAttribute: "cdk-menu-trigger" }, providers: [
-        { provide: MENU_TRIGGER, useExisting: CdkMenuItemTrigger },
-        PARENT_OR_NEW_MENU_STACK_PROVIDER,
-    ], exportAs: ["cdkMenuTriggerFor"], usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0-next.9", ngImport: i0, type: CdkMenuItemTrigger, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[cdkMenuTriggerFor]',
-                    exportAs: 'cdkMenuTriggerFor',
-                    host: {
-                        'class': 'cdk-menu-trigger',
-                        'aria-haspopup': 'menu',
-                        '(keydown)': '_toggleOnKeydown($event)',
-                        '(click)': 'toggle()',
-                        '[attr.aria-expanded]': 'isOpen()',
-                    },
-                    inputs: ['_menuTemplateRef: cdkMenuTriggerFor', 'menuPosition: cdkMenuPosition'],
-                    outputs: ['opened: cdkMenuOpened', 'closed: cdkMenuClosed'],
-                    providers: [
-                        { provide: MENU_TRIGGER, useExisting: CdkMenuItemTrigger },
-                        PARENT_OR_NEW_MENU_STACK_PROVIDER,
-                    ],
-                }]
-        }], ctorParameters: function () { return [{ type: i0.Injector }, { type: i0.ElementRef }, { type: i0.ViewContainerRef }, { type: i1.Overlay }, { type: i0.NgZone }, { type: MenuStack, decorators: [{
-                    type: Inject,
-                    args: [MENU_STACK]
-                }] }, { type: undefined, decorators: [{
-                    type: Optional
-                }, {
-                    type: Inject,
-                    args: [CDK_MENU]
-                }] }, { type: undefined, decorators: [{
-                    type: Optional
-                }, {
-                    type: Inject,
-                    args: [MENU_AIM]
-                }] }, { type: i1$1.Directionality, decorators: [{
-                    type: Optional
-                }] }]; } });
-
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-/**
- * Directive which provides the ability for an element to be focused and navigated to using the
- * keyboard when residing in a CdkMenu, CdkMenuBar, or CdkMenuGroup. It performs user defined
- * behavior when clicked.
- */
-class CdkMenuItem {
-    constructor(_elementRef, _ngZone, _menuStack, _parentMenu, _menuAim, _dir, 
-    /** Reference to the CdkMenuItemTrigger directive if one is added to the same element */
-    // `CdkMenuItem` is commonly used in combination with a `CdkMenuItemTrigger`.
-    // tslint:disable-next-line: lightweight-tokens
-    _menuTrigger) {
-        this._elementRef = _elementRef;
-        this._ngZone = _ngZone;
-        this._menuStack = _menuStack;
-        this._parentMenu = _parentMenu;
-        this._menuAim = _menuAim;
-        this._dir = _dir;
-        this._menuTrigger = _menuTrigger;
-        this._disabled = false;
-        /**
-         * If this MenuItem is a regular MenuItem, outputs when it is triggered by a keyboard or mouse
-         * event.
-         */
-        this.triggered = new EventEmitter();
-        /**
-         * The tabindex for this menu item managed internally and used for implementing roving a
-         * tab index.
-         */
-        this._tabindex = -1;
-        /** Emits when the menu item is destroyed. */
-        this._destroyed = new Subject();
-        this._setupMouseEnter();
-        if (this._isStandaloneItem()) {
-            this._tabindex = 0;
-        }
-    }
-    /**  Whether the CdkMenuItem is disabled - defaults to false */
-    get disabled() {
-        return this._disabled;
-    }
-    set disabled(value) {
-        this._disabled = coerceBooleanProperty(value);
-    }
-    /** Place focus on the element. */
-    focus() {
-        this._elementRef.nativeElement.focus();
-    }
-    /** Reset the _tabindex to -1. */
-    _resetTabIndex() {
-        if (!this._isStandaloneItem()) {
-            this._tabindex = -1;
-        }
-    }
-    /**
-     * Set the tab index to 0 if not disabled and it's a focus event, or a mouse enter if this element
-     * is not in a menu bar.
-     */
-    _setTabIndex(event) {
-        if (this.disabled) {
-            return;
-        }
-        // don't set the tabindex if there are no open sibling or parent menus
-        if (!event || !this._menuStack.isEmpty()) {
-            this._tabindex = 0;
-        }
-    }
-    /** Whether this menu item is standalone or within a menu or menu bar. */
-    _isStandaloneItem() {
-        return !this._parentMenu;
-    }
-    /**
-     * If the menu item is not disabled and the element does not have a menu trigger attached, emit
-     * on the cdkMenuItemTriggered emitter and close all open menus.
-     */
-    trigger() {
-        if (!this.disabled && !this.hasMenu()) {
-            this.triggered.next();
-            this._menuStack.closeAll();
-        }
-    }
-    /** Whether the menu item opens a menu. */
-    hasMenu() {
-        return !!this._menuTrigger;
-    }
-    /** Return true if this MenuItem has an attached menu and it is open. */
-    isMenuOpen() {
-        return !!this._menuTrigger?.isOpen();
-    }
-    /**
-     * Get a reference to the rendered Menu if the Menu is open and it is visible in the DOM.
-     * @return the menu if it is open, otherwise undefined.
-     */
-    getMenu() {
-        return this._menuTrigger?.getMenu();
-    }
-    /** Get the MenuItemTrigger associated with this element. */
-    getMenuTrigger() {
-        return this._menuTrigger;
-    }
-    /** Get the label for this element which is required by the FocusableOption interface. */
-    getLabel() {
-        return this.typeahead || this._elementRef.nativeElement.textContent?.trim() || '';
-    }
-    /**
-     * Handles keyboard events for the menu item, specifically either triggering the user defined
-     * callback or opening/closing the current menu based on whether the left or right arrow key was
-     * pressed.
-     * @param event the keyboard event to handle
-     */
-    _onKeydown(event) {
-        switch (event.keyCode) {
-            case SPACE:
-            case ENTER:
-                event.preventDefault();
-                this.trigger();
-                break;
-            case RIGHT_ARROW:
-                if (this._parentMenu && this._isParentVertical()) {
-                    if (this._dir?.value === 'rtl') {
-                        if (this._menuStack.hasInlineMenu() || this._menuStack.length() > 1) {
-                            event.preventDefault();
-                            this._menuStack.close(this._parentMenu, 1 /* previousItem */);
-                        }
-                    }
-                    else if (!this.hasMenu()) {
-                        if (this._menuStack.hasInlineMenu()) {
-                            event.preventDefault();
-                            this._menuStack.closeAll(0 /* nextItem */);
-                        }
-                    }
-                }
-                break;
-            case LEFT_ARROW:
-                if (this._parentMenu && this._isParentVertical()) {
-                    if (this._dir?.value !== 'rtl') {
-                        if (this._menuStack.hasInlineMenu() || this._menuStack.length() > 1) {
-                            event.preventDefault();
-                            this._menuStack.close(this._parentMenu, 1 /* previousItem */);
-                        }
-                    }
-                    else if (!this.hasMenu()) {
-                        if (this._menuStack.hasInlineMenu()) {
-                            event.preventDefault();
-                            this._menuStack.closeAll(0 /* nextItem */);
-                        }
-                    }
-                }
-                break;
-        }
-    }
-    /**
-     * Subscribe to the mouseenter events and close any sibling menu items if this element is moused
-     * into.
-     */
-    _setupMouseEnter() {
-        if (!this._isStandaloneItem()) {
-            const closeOpenSiblings = () => this._ngZone.run(() => this._menuStack.closeSubMenuOf(this._parentMenu));
-            this._ngZone.runOutsideAngular(() => fromEvent(this._elementRef.nativeElement, 'mouseenter')
-                .pipe(filter(() => !this._menuStack.isEmpty() && !this.hasMenu()), takeUntil(this._destroyed))
-                .subscribe(() => {
-                if (this._menuAim) {
-                    this._menuAim.toggle(closeOpenSiblings);
-                }
-                else {
-                    closeOpenSiblings();
-                }
-            }));
-        }
-    }
-    /**
-     * Return true if the enclosing parent menu is configured in a horizontal orientation, false
-     * otherwise or if no parent.
-     */
-    _isParentVertical() {
-        return this._parentMenu?.orientation === 'vertical';
-    }
-    ngOnDestroy() {
-        this._destroyed.next();
-    }
-}
-CdkMenuItem.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0-next.9", ngImport: i0, type: CdkMenuItem, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }, { token: MENU_STACK }, { token: CDK_MENU, optional: true }, { token: MENU_AIM, optional: true }, { token: i1$1.Directionality, optional: true }, { token: CdkMenuItemTrigger, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Directive });
-CdkMenuItem.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "14.0.0-next.9", type: CdkMenuItem, selector: "[cdkMenuItem]", inputs: { disabled: "disabled", typeahead: "typeahead" }, outputs: { triggered: "cdkMenuItemTriggered" }, host: { attributes: { "type": "button", "role": "menuitem" }, listeners: { "blur": "_resetTabIndex()", "mouseout": "_resetTabIndex()", "focus": "_setTabIndex()", "mouseenter": "_setTabIndex($event)", "click": "trigger()", "keydown": "_onKeydown($event)" }, properties: { "tabindex": "_tabindex", "attr.aria-disabled": "disabled || null" }, classAttribute: "cdk-menu-item" }, exportAs: ["cdkMenuItem"], ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0-next.9", ngImport: i0, type: CdkMenuItem, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[cdkMenuItem]',
-                    exportAs: 'cdkMenuItem',
-                    host: {
-                        '[tabindex]': '_tabindex',
-                        'type': 'button',
-                        'role': 'menuitem',
-                        'class': 'cdk-menu-item',
-                        '[attr.aria-disabled]': 'disabled || null',
-                        '(blur)': '_resetTabIndex()',
-                        '(mouseout)': '_resetTabIndex()',
-                        '(focus)': '_setTabIndex()',
-                        '(mouseenter)': '_setTabIndex($event)',
-                        '(click)': 'trigger()',
-                        '(keydown)': '_onKeydown($event)',
-                    },
-                }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.NgZone }, { type: MenuStack, decorators: [{
-                    type: Inject,
-                    args: [MENU_STACK]
-                }] }, { type: undefined, decorators: [{
-                    type: Optional
-                }, {
-                    type: Inject,
-                    args: [CDK_MENU]
-                }] }, { type: undefined, decorators: [{
-                    type: Optional
-                }, {
-                    type: Inject,
-                    args: [MENU_AIM]
-                }] }, { type: i1$1.Directionality, decorators: [{
-                    type: Optional
-                }] }, { type: CdkMenuItemTrigger, decorators: [{
-                    type: Self
-                }, {
-                    type: Optional
-                }] }]; }, propDecorators: { disabled: [{
-                type: Input
-            }], typeahead: [{
-                type: Input
-            }], triggered: [{
-                type: Output,
-                args: ['cdkMenuItemTriggered']
-            }] } });
-
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-/** Counter used to set a unique id and name for a selectable item */
-let nextId = 0;
-/**
- * Base class providing checked state for MenuItems along with outputting a clicked event when the
- * element is triggered. It provides functionality for selectable elements.
- */
-class CdkMenuItemSelectable extends CdkMenuItem {
-    constructor() {
-        super(...arguments);
-        /** Event emitted when the selectable item is clicked */
-        this.toggled = new EventEmitter();
-        this._checked = false;
-        /** The name of the selectable element with a default value */
-        this.name = `cdk-selectable-item-${nextId++}`;
-        /** The id of the selectable element with a default value */
-        this.id = `cdk-selectable-item-${nextId++}`;
-    }
-    /** Whether the element is checked */
-    get checked() {
-        return this._checked;
-    }
-    set checked(value) {
-        this._checked = coerceBooleanProperty(value);
-    }
-    /** If the element is not disabled emit the click event */
-    trigger() {
-        if (!this.disabled) {
-            this.toggled.next(this);
-        }
-    }
-}
-CdkMenuItemSelectable.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0-next.9", ngImport: i0, type: CdkMenuItemSelectable, deps: null, target: i0.ɵɵFactoryTarget.Directive });
-CdkMenuItemSelectable.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "14.0.0-next.9", type: CdkMenuItemSelectable, inputs: { checked: "checked", name: "name", id: "id" }, outputs: { toggled: "cdkMenuItemToggled" }, usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0-next.9", ngImport: i0, type: CdkMenuItemSelectable, decorators: [{
-            type: Directive
-        }], propDecorators: { toggled: [{
-                type: Output,
-                args: ['cdkMenuItemToggled']
-            }], checked: [{
-                type: Input
-            }], name: [{
-                type: Input
-            }], id: [{
-                type: Input
-            }] } });
-
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-/**
- * Directive which acts as a grouping container for `CdkMenuItem` instances with
- * `role="menuitemradio"`, similar to a `role="radiogroup"` element.
- */
-class CdkMenuGroup {
-    constructor() {
-        /** Emits the element when checkbox or radiobutton state changed  */
-        this.change = new EventEmitter();
-        /** Emits when the _selectableItems QueryList triggers a change */
-        this._selectableChanges = new EventEmitter();
-    }
-    ngAfterContentInit() {
-        this._registerMenuSelectionListeners();
-    }
-    ngOnDestroy() {
-        this._selectableChanges.next();
-        this._selectableChanges.complete();
-    }
-    /**
-     * Register the child selectable elements with the change emitter and ensure any new child
-     * elements do so as well.
-     */
-    _registerMenuSelectionListeners() {
-        this._selectableItems.forEach(selectable => this._registerClickListener(selectable));
-        this._selectableItems.changes.subscribe((selectableItems) => {
-            this._selectableChanges.next();
-            selectableItems.forEach(selectable => this._registerClickListener(selectable));
-        });
-    }
-    /** Register each selectable to emit on the change Emitter when clicked */
-    _registerClickListener(selectable) {
-        selectable.toggled
-            .pipe(takeUntil(this._selectableChanges))
-            .subscribe(() => this.change.next(selectable));
-    }
-}
-CdkMenuGroup.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0-next.9", ngImport: i0, type: CdkMenuGroup, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-CdkMenuGroup.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "14.0.0-next.9", type: CdkMenuGroup, selector: "[cdkMenuGroup]", outputs: { change: "change" }, host: { attributes: { "role": "group" }, classAttribute: "cdk-menu-group" }, providers: [{ provide: UniqueSelectionDispatcher, useClass: UniqueSelectionDispatcher }], queries: [{ propertyName: "_selectableItems", predicate: CdkMenuItemSelectable, descendants: true }], exportAs: ["cdkMenuGroup"], ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0-next.9", ngImport: i0, type: CdkMenuGroup, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[cdkMenuGroup]',
-                    exportAs: 'cdkMenuGroup',
-                    host: {
-                        'role': 'group',
-                        'class': 'cdk-menu-group',
-                    },
-                    providers: [{ provide: UniqueSelectionDispatcher, useClass: UniqueSelectionDispatcher }],
-                }]
-        }], propDecorators: { change: [{
-                type: Output
-            }], _selectableItems: [{
-                type: ContentChildren,
-                args: [CdkMenuItemSelectable, { descendants: true }]
-            }] } });
-
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-/**
- * PointerFocusTracker keeps track of the currently active item under mouse focus. It also has
- * observables which emit when the users mouse enters and leaves a tracked element.
- */
-class PointerFocusTracker {
-    constructor(_items) {
-        this._items = _items;
-        /** Emits when an element is moused into. */
-        this.entered = this._getItemPointerEntries();
-        /** Emits when an element is moused out. */
-        this.exited = this._getItemPointerExits();
-        /** Emits when this is destroyed. */
-        this._destroyed = new Subject();
-        this.entered.subscribe(element => (this.activeElement = element));
-        this.exited.subscribe(() => {
-            this.previousElement = this.activeElement;
-            this.activeElement = undefined;
-        });
-    }
-    /**
-     * Gets a stream of pointer (mouse) entries into the given items.
-     * This should typically run outside the Angular zone.
-     */
-    _getItemPointerEntries() {
-        return defer(() => this._items.changes.pipe(startWith(this._items), mergeMap((list) => list.map(element => fromEvent(element._elementRef.nativeElement, 'mouseenter').pipe(mapTo(element), takeUntil(this._items.changes)))), mergeAll()));
-    }
-    /**
-     * Gets a stream of pointer (mouse) exits out of the given items.
-     * This should typically run outside the Angular zone.
-     */
-    _getItemPointerExits() {
-        return defer(() => this._items.changes.pipe(startWith(this._items), mergeMap((list) => list.map(element => fromEvent(element._elementRef.nativeElement, 'mouseout').pipe(mapTo(element), takeUntil(this._items.changes)))), mergeAll()));
-    }
-    /** Stop the managers listeners. */
-    destroy() {
-        this._destroyed.next();
-        this._destroyed.complete();
-    }
-}
-
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-class CdkMenuBase extends CdkMenuGroup {
-    constructor(_elementRef, menuStack, dir) {
-        super();
-        this._elementRef = _elementRef;
-        this.menuStack = menuStack;
-        this.dir = dir;
-        /**
-         * Sets the aria-orientation attribute and determines where menus will be opened.
-         * Does not affect styling/layout.
-         */
-        this.orientation = 'vertical';
-        /** Emits when the MenuBar is destroyed. */
-        this.destroyed = new Subject();
-    }
-    ngAfterContentInit() {
-        super.ngAfterContentInit();
-        this._setKeyManager();
-        this._subscribeToMenuOpen();
-        this._subscribeToMenuStackClosed();
-    }
-    ngOnDestroy() {
-        super.ngOnDestroy();
-        this.destroyed.next();
-        this.destroyed.complete();
-    }
-    /** Place focus on the first MenuItem in the menu and set the focus origin. */
-    focusFirstItem(focusOrigin = 'program') {
-        this.keyManager.setFocusOrigin(focusOrigin);
-        this.keyManager.setFirstItemActive();
-    }
-    /** Place focus on the last MenuItem in the menu and set the focus origin. */
-    focusLastItem(focusOrigin = 'program') {
-        this.keyManager.setFocusOrigin(focusOrigin);
-        this.keyManager.setLastItemActive();
-    }
-    /** Return true if this menu has been configured in a horizontal orientation. */
-    isHorizontal() {
-        return this.orientation === 'horizontal';
-    }
-    /** Return true if the MenuBar has an open submenu. */
-    hasOpenSubmenu() {
-        return !!this.openItem;
-    }
-    /**
-     * Close the open menu if the current active item opened the requested MenuStackItem.
-     * @param item the MenuStackItem requested to be closed.
-     */
-    closeOpenMenu(menu) {
-        const keyManager = this.keyManager;
-        const trigger = this.openItem;
-        if (menu === trigger?.getMenuTrigger()?.getMenu()) {
-            trigger?.getMenuTrigger()?.close();
-            // If the user has moused over a sibling item we want to focus the element under mouse focus
-            // not the trigger which previously opened the now closed menu.
-            if (trigger) {
-                keyManager.setActiveItem(this.pointerTracker?.activeElement || trigger);
-            }
-        }
-    }
-    /** Setup the FocusKeyManager with the correct orientation for the menu. */
-    _setKeyManager() {
-        this.keyManager = new FocusKeyManager(this.items).withWrap().withTypeAhead().withHomeAndEnd();
-        if (this.isHorizontal()) {
-            this.keyManager.withHorizontalOrientation(this.dir?.value || 'ltr');
-        }
-        else {
-            this.keyManager.withVerticalOrientation();
-        }
-    }
-    /**
-     * Subscribe to the menu trigger's open events in order to track the trigger which opened the menu
-     * and stop tracking it when the menu is closed.
-     */
-    _subscribeToMenuOpen() {
-        const exitCondition = merge(this.items.changes, this.destroyed);
-        this.items.changes
-            .pipe(startWith(this.items), mergeMap((list) => list
-            .filter(item => item.hasMenu())
-            .map(item => item.getMenuTrigger().opened.pipe(mapTo(item), takeUntil(exitCondition)))), mergeAll(), switchMap((item) => {
-            this.openItem = item;
-            return item.getMenuTrigger().closed;
-        }), takeUntil(this.destroyed))
-            .subscribe(() => (this.openItem = undefined));
-    }
-    /** Subscribe to the MenuStack close and empty observables. */
-    _subscribeToMenuStackClosed() {
-        this.menuStack.closed
-            .pipe(takeUntil(this.destroyed))
-            .subscribe(item => this.closeOpenMenu(item));
-    }
-}
-CdkMenuBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0-next.9", ngImport: i0, type: CdkMenuBase, deps: [{ token: i0.ElementRef }, { token: MENU_STACK }, { token: i1$1.Directionality, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
-CdkMenuBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "14.0.0-next.9", type: CdkMenuBase, host: { listeners: { "focus": "focusFirstItem()" }, properties: { "attr.aria-orientation": "orientation" } }, queries: [{ propertyName: "items", predicate: CdkMenuItem, descendants: true }], usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0-next.9", ngImport: i0, type: CdkMenuBase, decorators: [{
-            type: Directive,
-            args: [{
-                    host: {
-                        '[attr.aria-orientation]': 'orientation',
-                        '(focus)': 'focusFirstItem()',
-                    },
-                }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: MenuStack, decorators: [{
-                    type: Inject,
-                    args: [MENU_STACK]
-                }] }, { type: i1$1.Directionality, decorators: [{
-                    type: Optional
-                }] }]; }, propDecorators: { items: [{
-                type: ContentChildren,
-                args: [CdkMenuItem, { descendants: true }]
-            }] } });
-
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-/**
- * Directive which configures the element as a Menu which should contain child elements marked as
- * CdkMenuItem or CdkMenuGroup. Sets the appropriate role and aria-attributes for a menu and
- * contains accessible keyboard and mouse handling logic.
- *
- * It also acts as a RadioGroup for elements marked with role `menuitemradio`.
- */
-class CdkMenu extends CdkMenuBase {
-    constructor(_ngZone, elementRef, menuStack, _parentTrigger, _menuAim, dir) {
-        super(elementRef, menuStack, dir);
-        this._ngZone = _ngZone;
-        this._parentTrigger = _parentTrigger;
-        this._menuAim = _menuAim;
-        /** Event emitted when the menu is closed. */
-        this.closed = new EventEmitter();
-        this.destroyed.subscribe(this.closed);
-        if (!this._isInline()) {
-            this.menuStack.push(this);
-        }
-        this._parentTrigger?.registerChildMenu(this);
-    }
-    ngAfterContentInit() {
-        super.ngAfterContentInit();
-        this._completeChangeEmitter();
-        this._subscribeToMenuStackEmptied();
-        this._subscribeToMouseManager();
-        this._menuAim?.initialize(this, this.pointerTracker);
-    }
-    ngOnDestroy() {
-        super.ngOnDestroy();
-        this.closed.complete();
-        this.pointerTracker?.destroy();
-    }
-    /** Handle keyboard events for the Menu. */
-    _handleKeyEvent(event) {
-        const keyManager = this.keyManager;
-        switch (event.keyCode) {
-            case LEFT_ARROW:
-            case RIGHT_ARROW:
-                if (this.isHorizontal()) {
-                    event.preventDefault();
-                    keyManager.setFocusOrigin('keyboard');
-                    keyManager.onKeydown(event);
-                }
-                break;
-            case UP_ARROW:
-            case DOWN_ARROW:
-                if (!this.isHorizontal()) {
-                    event.preventDefault();
-                    keyManager.setFocusOrigin('keyboard');
-                    keyManager.onKeydown(event);
-                }
-                break;
-            case ESCAPE:
-                if (!hasModifierKey(event)) {
-                    event.preventDefault();
-                    this.menuStack.close(this, 2 /* currentItem */);
-                }
-                break;
-            case TAB:
-                this.menuStack.closeAll();
-                break;
-            default:
-                keyManager.onKeydown(event);
-        }
-    }
-    /**
-     * Complete the change emitter if there are any nested MenuGroups or register to complete the
-     * change emitter if a MenuGroup is rendered at some point
-     */
-    // TODO(mmalerba): This doesnt' quite work. It causes change events to stop
-    //  firing for radio items directly in the menu if a second group of options
-    //  is added in a menu-group.
-    _completeChangeEmitter() {
-        if (this._hasNestedGroups()) {
-            this.change.complete();
-        }
-        else {
-            this._nestedGroups.changes.pipe(take(1)).subscribe(() => this.change.complete());
-        }
-    }
-    /** Return true if there are nested CdkMenuGroup elements within the Menu */
-    _hasNestedGroups() {
-        // view engine has a bug where @ContentChildren will return the current element
-        // along with children if the selectors match - not just the children.
-        // Here, if there is at least one element, we check to see if the first element is a CdkMenu in
-        // order to ensure that we return true iff there are child CdkMenuGroup elements.
-        return this._nestedGroups.length > 0 && !(this._nestedGroups.first instanceof CdkMenu);
-    }
-    /**
-     * Set the PointerFocusTracker and ensure that when mouse focus changes the key manager is updated
-     * with the latest menu item under mouse focus.
-     */
-    _subscribeToMouseManager() {
-        this._ngZone.runOutsideAngular(() => {
-            this.pointerTracker = new PointerFocusTracker(this.items);
-            this.pointerTracker.entered
-                .pipe(takeUntil(this.closed))
-                .subscribe(item => this.keyManager.setActiveItem(item));
-        });
-    }
-    /** Set focus the either the current, previous or next item based on the FocusNext event. */
-    _toggleMenuFocus(event) {
-        const keyManager = this.keyManager;
-        switch (event) {
-            case 0 /* nextItem */:
-                keyManager.setFocusOrigin('keyboard');
-                keyManager.setNextItemActive();
-                break;
-            case 1 /* previousItem */:
-                keyManager.setFocusOrigin('keyboard');
-                keyManager.setPreviousItemActive();
-                break;
-            case 2 /* currentItem */:
-                if (keyManager.activeItem) {
-                    keyManager.setFocusOrigin('keyboard');
-                    keyManager.setActiveItem(keyManager.activeItem);
-                }
-                break;
-        }
-    }
-    /**
-     * Return true if this menu is an inline menu. That is, it does not exist in a pop-up and is
-     * always visible in the dom.
-     */
-    _isInline() {
-        return !this._parentTrigger;
-    }
-    _subscribeToMenuStackEmptied() {
-        this.menuStack.emptied
-            .pipe(takeUntil(this.destroyed))
-            .subscribe(event => this._toggleMenuFocus(event));
-    }
-}
-CdkMenu.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0-next.9", ngImport: i0, type: CdkMenu, deps: [{ token: i0.NgZone }, { token: i0.ElementRef }, { token: MENU_STACK }, { token: MENU_TRIGGER, optional: true }, { token: MENU_AIM, optional: true, self: true }, { token: i1$1.Directionality, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
-CdkMenu.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "14.0.0-next.9", type: CdkMenu, selector: "[cdkMenu]", outputs: { closed: "closed" }, host: { attributes: { "role": "menu" }, listeners: { "keydown": "_handleKeyEvent($event)" }, properties: { "tabindex": "_isInline() ? 0 : null", "class.cdk-menu-inline": "_isInline()" }, classAttribute: "cdk-menu" }, providers: [
-        { provide: CdkMenuGroup, useExisting: CdkMenu },
-        { provide: CDK_MENU, useExisting: CdkMenu },
-        PARENT_OR_NEW_INLINE_MENU_STACK_PROVIDER,
-    ], queries: [{ propertyName: "_nestedGroups", predicate: CdkMenuGroup, descendants: true }], exportAs: ["cdkMenu"], usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0-next.9", ngImport: i0, type: CdkMenu, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[cdkMenu]',
-                    exportAs: 'cdkMenu',
-                    host: {
-                        'role': 'menu',
-                        'class': 'cdk-menu',
-                        '[tabindex]': '_isInline() ? 0 : null',
-                        '[class.cdk-menu-inline]': '_isInline()',
-                        '(keydown)': '_handleKeyEvent($event)',
-                    },
-                    providers: [
-                        { provide: CdkMenuGroup, useExisting: CdkMenu },
-                        { provide: CDK_MENU, useExisting: CdkMenu },
-                        PARENT_OR_NEW_INLINE_MENU_STACK_PROVIDER,
-                    ],
-                }]
-        }], ctorParameters: function () { return [{ type: i0.NgZone }, { type: i0.ElementRef }, { type: MenuStack, decorators: [{
-                    type: Inject,
-                    args: [MENU_STACK]
-                }] }, { type: MenuTrigger, decorators: [{
-                    type: Optional
-                }, {
-                    type: Inject,
-                    args: [MENU_TRIGGER]
-                }] }, { type: undefined, decorators: [{
-                    type: Self
-                }, {
-                    type: Optional
-                }, {
-                    type: Inject,
-                    args: [MENU_AIM]
-                }] }, { type: i1$1.Directionality, decorators: [{
-                    type: Optional
-                }] }]; }, propDecorators: { closed: [{
-                type: Output
-            }], _nestedGroups: [{
-                type: ContentChildren,
-                args: [CdkMenuGroup, { descendants: true }]
-            }] } });
-
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-/**
- * Directive applied to an element which configures it as a MenuBar by setting the appropriate
- * role, aria attributes, and accessible keyboard and mouse handling logic. The component that
- * this directive is applied to should contain components marked with CdkMenuItem.
- *
- */
-class CdkMenuBar extends CdkMenuBase {
-    constructor(_ngZone, elementRef, menuStack, _menuAim, dir) {
-        super(elementRef, menuStack, dir);
-        this._ngZone = _ngZone;
-        this._menuAim = _menuAim;
-        this.orientation = 'horizontal';
-    }
-    ngAfterContentInit() {
-        super.ngAfterContentInit();
-        this._subscribeToMenuStackEmptied();
-        this._subscribeToMouseManager();
-        this._menuAim?.initialize(this, this.pointerTracker);
-    }
-    ngOnDestroy() {
-        super.ngOnDestroy();
-        this.pointerTracker?.destroy();
-    }
-    /**
-     * Handle keyboard events, specifically changing the focused element and/or toggling the active
-     * items menu.
-     * @param event the KeyboardEvent to handle.
-     */
-    _handleKeyEvent(event) {
-        const keyManager = this.keyManager;
-        switch (event.keyCode) {
-            case UP_ARROW:
-            case DOWN_ARROW:
-            case LEFT_ARROW:
-            case RIGHT_ARROW:
-                const horizontalArrows = event.keyCode === LEFT_ARROW || event.keyCode === RIGHT_ARROW;
-                // For a horizontal menu if the left/right keys were clicked, or a vertical menu if the
-                // up/down keys were clicked: if the current menu is open, close it then focus and open the
-                // next  menu.
-                if ((this.isHorizontal() && horizontalArrows) ||
-                    (!this.isHorizontal() && !horizontalArrows)) {
-                    event.preventDefault();
-                    const prevIsOpen = keyManager.activeItem?.isMenuOpen();
-                    keyManager.activeItem?.getMenuTrigger()?.close();
-                    keyManager.setFocusOrigin('keyboard');
-                    keyManager.onKeydown(event);
-                    if (prevIsOpen) {
-                        keyManager.activeItem?.getMenuTrigger()?.open();
-                    }
-                }
-                break;
-            case ESCAPE:
-                event.preventDefault();
-                keyManager.activeItem?.getMenuTrigger()?.close();
-                break;
-            case TAB:
-                keyManager.activeItem?.getMenuTrigger()?.close();
-                break;
-            default:
-                keyManager.onKeydown(event);
-        }
-    }
-    /**
-     * Set the PointerFocusTracker and ensure that when mouse focus changes the key manager is updated
-     * with the latest menu item under mouse focus.
-     */
-    _subscribeToMouseManager() {
-        this._ngZone.runOutsideAngular(() => {
-            this.pointerTracker = new PointerFocusTracker(this.items);
-            this.pointerTracker.entered.pipe(takeUntil(this.destroyed)).subscribe(item => {
-                if (this.hasOpenSubmenu()) {
-                    this.keyManager.setActiveItem(item);
-                }
-            });
-        });
-    }
-    /**
-     * Set focus to either the current, previous or next item based on the FocusNext event, then
-     * open the previous or next item.
-     */
-    _toggleOpenMenu(event) {
-        const keyManager = this.keyManager;
-        switch (event) {
-            case 0 /* nextItem */:
-                keyManager.setFocusOrigin('keyboard');
-                keyManager.setNextItemActive();
-                keyManager.activeItem?.getMenuTrigger()?.open();
-                break;
-            case 1 /* previousItem */:
-                keyManager.setFocusOrigin('keyboard');
-                keyManager.setPreviousItemActive();
-                keyManager.activeItem?.getMenuTrigger()?.open();
-                break;
-            case 2 /* currentItem */:
-                if (keyManager.activeItem) {
-                    keyManager.setFocusOrigin('keyboard');
-                    keyManager.setActiveItem(keyManager.activeItem);
-                }
-                break;
-        }
-    }
-    _subscribeToMenuStackEmptied() {
-        this.menuStack?.emptied
-            .pipe(takeUntil(this.destroyed))
-            .subscribe(event => this._toggleOpenMenu(event));
-    }
-}
-CdkMenuBar.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0-next.9", ngImport: i0, type: CdkMenuBar, deps: [{ token: i0.NgZone }, { token: i0.ElementRef }, { token: MENU_STACK }, { token: MENU_AIM, optional: true, self: true }, { token: i1$1.Directionality, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
-CdkMenuBar.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "14.0.0-next.9", type: CdkMenuBar, selector: "[cdkMenuBar]", host: { attributes: { "role": "menubar", "tabindex": "0" }, listeners: { "keydown": "_handleKeyEvent($event)" }, classAttribute: "cdk-menu-bar" }, providers: [
-        { provide: CdkMenuGroup, useExisting: CdkMenuBar },
-        { provide: CDK_MENU, useExisting: CdkMenuBar },
-        { provide: MENU_STACK, useFactory: () => MenuStack.inline() },
-    ], exportAs: ["cdkMenuBar"], usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0-next.9", ngImport: i0, type: CdkMenuBar, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[cdkMenuBar]',
-                    exportAs: 'cdkMenuBar',
-                    host: {
-                        'role': 'menubar',
-                        'class': 'cdk-menu-bar',
-                        'tabindex': '0',
-                        '(keydown)': '_handleKeyEvent($event)',
-                    },
-                    providers: [
-                        { provide: CdkMenuGroup, useExisting: CdkMenuBar },
-                        { provide: CDK_MENU, useExisting: CdkMenuBar },
-                        { provide: MENU_STACK, useFactory: () => MenuStack.inline() },
-                    ],
-                }]
-        }], ctorParameters: function () { return [{ type: i0.NgZone }, { type: i0.ElementRef }, { type: MenuStack, decorators: [{
-                    type: Inject,
-                    args: [MENU_STACK]
-                }] }, { type: undefined, decorators: [{
-                    type: Self
-                }, {
-                    type: Optional
-                }, {
-                    type: Inject,
-                    args: [MENU_AIM]
-                }] }, { type: i1$1.Directionality, decorators: [{
-                    type: Optional
-                }] }]; } });
-
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-/**
- * A directive providing behavior for the "menuitemradio" ARIA role, which behaves similarly to
- * a conventional radio-button. Any sibling `CdkMenuItemRadio` instances within the same `CdkMenu`
- * or `CdkMenuGroup` comprise a radio group with unique selection enforced.
- */
-class CdkMenuItemRadio extends CdkMenuItemSelectable {
-    constructor(_selectionDispatcher, element, ngZone, menuStack, parentMenu, menuAim, dir, 
-    /** Reference to the CdkMenuItemTrigger directive if one is added to the same element */
-    // `CdkMenuItemRadio` is commonly used in combination with a `CdkMenuItemTrigger`.
-    // tslint:disable-next-line: lightweight-tokens
-    menuTrigger) {
-        super(element, ngZone, menuStack, parentMenu, menuAim, dir, menuTrigger);
-        this._selectionDispatcher = _selectionDispatcher;
-        this._registerDispatcherListener();
-    }
-    /** Configure the unique selection dispatcher listener in order to toggle the checked state  */
-    _registerDispatcherListener() {
-        this._removeDispatcherListener = this._selectionDispatcher.listen((id, name) => (this.checked = this.id === id && this.name === name));
-    }
-    /** Toggles the checked state of the radio-button. */
-    trigger() {
-        super.trigger();
-        if (!this.disabled) {
-            this._selectionDispatcher.notify(this.id, this.name);
-        }
-    }
-    ngOnDestroy() {
-        super.ngOnDestroy();
-        this._removeDispatcherListener();
-    }
-}
-CdkMenuItemRadio.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0-next.9", ngImport: i0, type: CdkMenuItemRadio, deps: [{ token: i1$2.UniqueSelectionDispatcher }, { token: i0.ElementRef }, { token: i0.NgZone }, { token: MENU_STACK }, { token: CDK_MENU, optional: true }, { token: MENU_AIM, optional: true }, { token: i1$1.Directionality, optional: true }, { token: CdkMenuItemTrigger, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Directive });
-CdkMenuItemRadio.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "14.0.0-next.9", type: CdkMenuItemRadio, selector: "[cdkMenuItemRadio]", host: { attributes: { "type": "button", "role": "menuitemradio" }, properties: { "tabindex": "_tabindex", "attr.aria-checked": "checked || null", "attr.aria-disabled": "disabled || null" } }, providers: [
-        { provide: CdkMenuItemSelectable, useExisting: CdkMenuItemRadio },
-        { provide: CdkMenuItem, useExisting: CdkMenuItemSelectable },
-    ], exportAs: ["cdkMenuItemRadio"], usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0-next.9", ngImport: i0, type: CdkMenuItemRadio, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[cdkMenuItemRadio]',
-                    exportAs: 'cdkMenuItemRadio',
-                    host: {
-                        '[tabindex]': '_tabindex',
-                        'type': 'button',
-                        'role': 'menuitemradio',
-                        '[attr.aria-checked]': 'checked || null',
-                        '[attr.aria-disabled]': 'disabled || null',
-                    },
-                    providers: [
-                        { provide: CdkMenuItemSelectable, useExisting: CdkMenuItemRadio },
-                        { provide: CdkMenuItem, useExisting: CdkMenuItemSelectable },
-                    ],
-                }]
-        }], ctorParameters: function () { return [{ type: i1$2.UniqueSelectionDispatcher }, { type: i0.ElementRef }, { type: i0.NgZone }, { type: MenuStack, decorators: [{
-                    type: Inject,
-                    args: [MENU_STACK]
-                }] }, { type: undefined, decorators: [{
-                    type: Optional
-                }, {
-                    type: Inject,
-                    args: [CDK_MENU]
-                }] }, { type: undefined, decorators: [{
-                    type: Optional
-                }, {
-                    type: Inject,
-                    args: [MENU_AIM]
-                }] }, { type: i1$1.Directionality, decorators: [{
-                    type: Optional
-                }] }, { type: CdkMenuItemTrigger, decorators: [{
-                    type: Self
-                }, {
-                    type: Optional
-                }] }]; } });
-
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-/**
- * A directive providing behavior for the "menuitemcheckbox" ARIA role, which behaves similarly to a
- * conventional checkbox.
- */
-class CdkMenuItemCheckbox extends CdkMenuItemSelectable {
-    /** Toggle the checked state of the checkbox. */
-    trigger() {
-        super.trigger();
-        if (!this.disabled) {
-            this.checked = !this.checked;
-        }
-    }
-}
-CdkMenuItemCheckbox.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0-next.9", ngImport: i0, type: CdkMenuItemCheckbox, deps: null, target: i0.ɵɵFactoryTarget.Directive });
-CdkMenuItemCheckbox.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "14.0.0-next.9", type: CdkMenuItemCheckbox, selector: "[cdkMenuItemCheckbox]", host: { attributes: { "type": "button", "role": "menuitemcheckbox" }, properties: { "tabindex": "_tabindex", "attr.aria-checked": "checked || null", "attr.aria-disabled": "disabled || null" } }, providers: [
-        { provide: CdkMenuItemSelectable, useExisting: CdkMenuItemCheckbox },
-        { provide: CdkMenuItem, useExisting: CdkMenuItemSelectable },
-    ], exportAs: ["cdkMenuItemCheckbox"], usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0-next.9", ngImport: i0, type: CdkMenuItemCheckbox, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[cdkMenuItemCheckbox]',
-                    exportAs: 'cdkMenuItemCheckbox',
-                    host: {
-                        '[tabindex]': '_tabindex',
-                        'type': 'button',
-                        'role': 'menuitemcheckbox',
-                        '[attr.aria-checked]': 'checked || null',
-                        '[attr.aria-disabled]': 'disabled || null',
-                    },
-                    providers: [
-                        { provide: CdkMenuItemSelectable, useExisting: CdkMenuItemCheckbox },
-                        { provide: CdkMenuItem, useExisting: CdkMenuItemSelectable },
-                    ],
-                }]
-        }] });
-
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-// In cases where the first menu item in the context menu is a trigger the submenu opens on a
-// hover event. We offset the context menu 2px by default to prevent this from occurring.
-const CONTEXT_MENU_POSITIONS = STANDARD_DROPDOWN_BELOW_POSITIONS.map(position => {
-    const offsetX = position.overlayX === 'start' ? 2 : -2;
-    const offsetY = position.overlayY === 'top' ? 2 : -2;
-    return { ...position, offsetX, offsetY };
-});
-/** Tracks the last open context menu trigger across the entire application. */
-class ContextMenuTracker {
-    /**
-     * Close the previous open context menu and set the given one as being open.
-     * @param trigger the trigger for the currently open Context Menu.
-     */
-    update(trigger) {
-        if (ContextMenuTracker._openContextMenuTrigger !== trigger) {
-            ContextMenuTracker._openContextMenuTrigger?.close();
-            ContextMenuTracker._openContextMenuTrigger = trigger;
-        }
-    }
-}
-ContextMenuTracker.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0-next.9", ngImport: i0, type: ContextMenuTracker, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-ContextMenuTracker.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.0.0-next.9", ngImport: i0, type: ContextMenuTracker, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0-next.9", ngImport: i0, type: ContextMenuTracker, decorators: [{
-            type: Injectable,
-            args: [{ providedIn: 'root' }]
-        }] });
-/**
- * A directive which when placed on some element opens a the Menu it is bound to when a user
- * right-clicks within that element. It is aware of nested Context Menus and the lowest level
- * non-disabled context menu will trigger.
- */
-class CdkContextMenuTrigger extends MenuTrigger {
-    constructor(injector, _viewContainerRef, _overlay, _contextMenuTracker, menuStack, _directionality) {
-        super(injector, menuStack);
-        this._viewContainerRef = _viewContainerRef;
-        this._overlay = _overlay;
-        this._contextMenuTracker = _contextMenuTracker;
-        this._directionality = _directionality;
-        this._disabled = false;
-        this._setMenuStackListener();
-    }
-    /** Whether the context menu should be disabled. */
-    get disabled() {
-        return this._disabled;
-    }
-    set disabled(value) {
-        this._disabled = coerceBooleanProperty(value);
-    }
-    /**
-     * Open the attached menu at the specified location.
-     * @param coordinates where to open the context menu
-     */
-    open(coordinates) {
-        this._open(coordinates, false);
-    }
-    _open(coordinates, ignoreFirstOutsideAuxClick) {
-        if (this.disabled) {
-            return;
-        }
-        else if (this.isOpen()) {
-            // since we're moving this menu we need to close any submenus first otherwise they end up
-            // disconnected from this one.
-            this.menuStack.closeSubMenuOf(this.childMenu);
-            this._overlayRef.getConfig().positionStrategy.setOrigin(coordinates);
-            this._overlayRef.updatePosition();
-        }
-        else {
-            this.opened.next();
-            if (this._overlayRef) {
-                this._overlayRef.getConfig().positionStrategy.setOrigin(coordinates);
-                this._overlayRef.updatePosition();
-            }
-            else {
-                this._overlayRef = this._overlay.create(this._getOverlayConfig(coordinates));
-            }
-            this._overlayRef.attach(this._getMenuContent());
-            this._subscribeToOutsideClicks(ignoreFirstOutsideAuxClick);
-        }
-    }
-    /** Close the opened menu. */
-    close() {
-        this.menuStack.closeAll();
-    }
-    /**
-     * Open the context menu and close any previously open menus.
-     * @param event the mouse event which opens the context menu.
-     */
-    _openOnContextMenu(event) {
-        if (!this.disabled) {
-            // Prevent the native context menu from opening because we're opening a custom one.
-            event.preventDefault();
-            // Stop event propagation to ensure that only the closest enabled context menu opens.
-            // Otherwise, any context menus attached to containing elements would *also* open,
-            // resulting in multiple stacked context menus being displayed.
-            event.stopPropagation();
-            this._contextMenuTracker.update(this);
-            this._open({ x: event.clientX, y: event.clientY }, true);
-            // A context menu can be triggered via a mouse right click or a keyboard shortcut.
-            if (event.button === 2) {
-                this.childMenu?.focusFirstItem('mouse');
-            }
-            else if (event.button === 0) {
-                this.childMenu?.focusFirstItem('keyboard');
-            }
-            else {
-                this.childMenu?.focusFirstItem('program');
-            }
-        }
-    }
-    /**
-     * Get the configuration object used to create the overlay.
-     * @param coordinates the location to place the opened menu
-     */
-    _getOverlayConfig(coordinates) {
-        return new OverlayConfig({
-            positionStrategy: this._getOverlayPositionStrategy(coordinates),
-            scrollStrategy: this._overlay.scrollStrategies.block(),
-            direction: this._directionality,
-        });
-    }
-    /**
-     * Build the position strategy for the overlay which specifies where to place the menu.
-     * @param coordinates the location to place the opened menu
-     */
-    _getOverlayPositionStrategy(coordinates) {
-        return this._overlay
-            .position()
-            .flexibleConnectedTo(coordinates)
-            .withPositions(this.menuPosition ?? CONTEXT_MENU_POSITIONS);
-    }
-    /**
-     * Get the portal to be attached to the overlay which contains the menu. Allows for the menu
-     * content to change dynamically and be reflected in the application.
-     */
-    _getMenuContent() {
-        const hasMenuContentChanged = this._menuTemplateRef !== this._menuPortal?.templateRef;
-        if (this._menuTemplateRef && (!this._menuPortal || hasMenuContentChanged)) {
-            this._menuPortal = new TemplatePortal(this._menuTemplateRef, this._viewContainerRef, undefined, this.getChildMenuInjector());
-        }
-        return this._menuPortal;
-    }
-    /** Subscribe to the menu stack close events and close this menu when requested. */
-    _setMenuStackListener() {
-        this.menuStack.closed.pipe(takeUntil(this._destroyed)).subscribe(item => {
-            if (item === this.childMenu && this.isOpen()) {
-                this.closed.next();
-                this._overlayRef.detach();
-            }
-        });
-    }
-    /**
-     * Subscribe to the overlays outside pointer events stream and handle closing out the stack if a
-     * click occurs outside the menus.
-     */
-    _subscribeToOutsideClicks(ignoreFirstAuxClick) {
-        if (this._overlayRef) {
-            let outsideClicks = this._overlayRef.outsidePointerEvents();
-            // If the menu was triggered by the `contextmenu` event, skip the first `auxclick` event
-            // because it fires when the mouse is released on the same click that opened the menu.
-            if (ignoreFirstAuxClick) {
-                const [auxClicks, nonAuxClicks] = partition(outsideClicks, ({ type }) => type === 'auxclick');
-                outsideClicks = merge(nonAuxClicks, auxClicks.pipe(skip(1)));
-            }
-            outsideClicks.pipe(takeUntil(this._stopOutsideClicksListener)).subscribe(event => {
-                if (!isClickInsideMenuOverlay(event.target)) {
-                    this.menuStack.closeAll();
-                }
-            });
-        }
-    }
-}
-CdkContextMenuTrigger.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0-next.9", ngImport: i0, type: CdkContextMenuTrigger, deps: [{ token: i0.Injector }, { token: i0.ViewContainerRef }, { token: i1.Overlay }, { token: ContextMenuTracker }, { token: MENU_STACK }, { token: i1$1.Directionality, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
-CdkContextMenuTrigger.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "14.0.0-next.9", type: CdkContextMenuTrigger, selector: "[cdkContextMenuTriggerFor]", inputs: { _menuTemplateRef: ["cdkContextMenuTriggerFor", "_menuTemplateRef"], menuPosition: ["cdkContextMenuPosition", "menuPosition"], disabled: ["cdkContextMenuDisabled", "disabled"] }, outputs: { opened: "cdkContextMenuOpened", closed: "cdkContextMenuClosed" }, host: { listeners: { "contextmenu": "_openOnContextMenu($event)" } }, providers: [
-        { provide: MENU_TRIGGER, useExisting: CdkContextMenuTrigger },
-        { provide: MENU_STACK, useClass: MenuStack },
-    ], exportAs: ["cdkContextMenuTriggerFor"], usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0-next.9", ngImport: i0, type: CdkContextMenuTrigger, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[cdkContextMenuTriggerFor]',
-                    exportAs: 'cdkContextMenuTriggerFor',
-                    host: {
-                        '(contextmenu)': '_openOnContextMenu($event)',
-                    },
-                    inputs: ['_menuTemplateRef: cdkContextMenuTriggerFor', 'menuPosition: cdkContextMenuPosition'],
-                    outputs: ['opened: cdkContextMenuOpened', 'closed: cdkContextMenuClosed'],
-                    providers: [
-                        { provide: MENU_TRIGGER, useExisting: CdkContextMenuTrigger },
-                        { provide: MENU_STACK, useClass: MenuStack },
-                    ],
-                }]
-        }], ctorParameters: function () { return [{ type: i0.Injector }, { type: i0.ViewContainerRef }, { type: i1.Overlay }, { type: ContextMenuTracker }, { type: MenuStack, decorators: [{
-                    type: Inject,
-                    args: [MENU_STACK]
-                }] }, { type: i1$1.Directionality, decorators: [{
-                    type: Optional
-                }] }]; }, propDecorators: { disabled: [{
-                type: Input,
-                args: ['cdkContextMenuDisabled']
-            }] } });
-
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-const EXPORTED_DECLARATIONS = [
-    CdkMenuBar,
-    CdkMenu,
-    CdkMenuItem,
-    CdkMenuItemRadio,
-    CdkMenuItemCheckbox,
-    CdkMenuItemTrigger,
-    CdkMenuGroup,
-    CdkContextMenuTrigger,
-    CdkTargetMenuAim,
-];
-class CdkMenuModule {
-}
-CdkMenuModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0-next.9", ngImport: i0, type: CdkMenuModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-CdkMenuModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "14.0.0-next.9", ngImport: i0, type: CdkMenuModule, declarations: [CdkMenuBar,
-        CdkMenu,
-        CdkMenuItem,
-        CdkMenuItemRadio,
-        CdkMenuItemCheckbox,
-        CdkMenuItemTrigger,
-        CdkMenuGroup,
-        CdkContextMenuTrigger,
-        CdkTargetMenuAim], imports: [OverlayModule], exports: [CdkMenuBar,
-        CdkMenu,
-        CdkMenuItem,
-        CdkMenuItemRadio,
-        CdkMenuItemCheckbox,
-        CdkMenuItemTrigger,
-        CdkMenuGroup,
-        CdkContextMenuTrigger,
-        CdkTargetMenuAim] });
-CdkMenuModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.0.0-next.9", ngImport: i0, type: CdkMenuModule, imports: [[OverlayModule]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0-next.9", ngImport: i0, type: CdkMenuModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    imports: [OverlayModule],
-                    exports: EXPORTED_DECLARATIONS,
-                    declarations: EXPORTED_DECLARATIONS,
-                }]
-        }] });
-
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-/**
- * Generated bundle index. Do not edit.
- */
-
-export { CDK_MENU, CdkContextMenuTrigger, CdkMenu, CdkMenuBar, CdkMenuGroup, CdkMenuItem, CdkMenuItemCheckbox, CdkMenuItemRadio, CdkMenuItemTrigger, CdkMenuModule, CdkTargetMenuAim, ContextMenuTracker, MENU_AIM, MENU_STACK, MENU_TRIGGER, MenuStack, MenuTrigger, TargetMenuAim, isClickInsideMenuOverlay };
-//# sourceMappingURL=menu.mjs.map