@theseam/ui-common 0.4.30 → 1.0.0-beta.0

package/fesm2020/theseam-ui-common-menu.mjs

@@ -1,1288 +0,0 @@
-import { ContentContainerComponentHarness, HarnessPredicate, TestKey } from '@angular/cdk/testing';
-import { waitOnConditionAsync } from '@theseam/ui-common/utils';
-import { coerceBooleanProperty, coerceNumberProperty } from '@angular/cdk/coercion';
-import { animation, style, group, animate, query, useAnimation, trigger, transition } from '@angular/animations';
-import * as i0 from '@angular/core';
-import { Component, ChangeDetectionStrategy, InjectionToken, Inject, Optional, Input, HostListener, forwardRef, EventEmitter, TemplateRef, ViewChild, Output, inject, ChangeDetectorRef, Directive, Self, HostBinding, NgModule } from '@angular/core';
-import * as i2 from '@angular/common';
-import { DOCUMENT, CommonModule } from '@angular/common';
-import { Subject, BehaviorSubject, Subscription, fromEvent, of, merge, filter, delay, asapScheduler, take, takeUntil as takeUntil$1 } from 'rxjs';
-import { faCaretRight } from '@fortawesome/free-solid-svg-icons';
-import { mixinDisabled, InputNumber } from '@theseam/ui-common/core';
-import * as i1 from '@angular/cdk/a11y';
-import { FocusKeyManager, isFakeMousedownFromScreenReader } from '@angular/cdk/a11y';
-import * as i3 from '@theseam/ui-common/icon';
-import { TheSeamIconModule } from '@theseam/ui-common/icon';
-import { __decorate } from 'tslib';
-import { UP_ARROW, DOWN_ARROW, END, hasModifierKey, HOME, RIGHT_ARROW, LEFT_ARROW, ESCAPE, ENTER, SPACE } from '@angular/cdk/keycodes';
-import { normalizePassiveListenerOptions } from '@angular/cdk/platform';
-import { TemplatePortal } from '@angular/cdk/portal';
-import { map, switchMap, startWith, distinctUntilChanged, takeUntil } from 'rxjs/operators';
-import * as i1$1 from '@angular/cdk/overlay';
-import { OverlayModule } from '@angular/cdk/overlay';
-import * as i4 from '@angular/cdk/bidi';
-
-/**
- * Workaround to wait on the animation to finish in browser, until a generic
- * broswer-based solution is added, for Storybook interactions.
- */
-async function animatingWait() {
-    const selectAnimating = () => document.querySelectorAll('.seam-menu-container .ng-animating');
-    if (selectAnimating().length === 0) {
-        return;
-    }
-    await waitOnConditionAsync(() => selectAnimating().length === 0, 1000);
-}
-
-class TheSeamMenuFooterHarness extends ContentContainerComponentHarness {
-    /**
-     * Gets a `HarnessPredicate` that can be used to search for a menu item with specific attributes.
-     * @param options Options for filtering which menu item instances are considered a match.
-     * @return a `HarnessPredicate` configured with the given options.
-     */
-    static with(options = {}) {
-        return new HarnessPredicate(this, options)
-            .addOption('text', options.text, (harness, text) => HarnessPredicate.stringMatches(harness.getText(), text));
-    }
-    /** Gets the text of the menu item. */
-    async getText() {
-        return (await this.host()).text();
-    }
-    /** Clicks the menu item. */
-    async click() {
-        return (await this.host()).click().then(() => animatingWait());
-    }
-    /** Hovers the menu item. */
-    async hover() {
-        return (await this.host()).hover().then(() => animatingWait());
-    }
-}
-/** The selector for the host element of a `MenuFooterComponent` instance. */
-TheSeamMenuFooterHarness.hostSelector = 'seam-menu-footer';
-
-class TheSeamMenuHeaderHarness extends ContentContainerComponentHarness {
-    /**
-     * Gets a `HarnessPredicate` that can be used to search for a menu item with specific attributes.
-     * @param options Options for filtering which menu item instances are considered a match.
-     * @return a `HarnessPredicate` configured with the given options.
-     */
-    static with(options = {}) {
-        return new HarnessPredicate(this, options);
-    }
-    /** Clicks the menu item. */
-    async click() {
-        return (await this.host()).click().then(() => animatingWait());
-    }
-    /** Hovers the menu item. */
-    async hover() {
-        return (await this.host()).hover().then(() => animatingWait());
-    }
-}
-/** The selector for the host element of a `MenuHeaderComponent` instance. */
-TheSeamMenuHeaderHarness.hostSelector = 'seam-menu-header';
-
-class TheSeamMenuHarness extends ContentContainerComponentHarness {
-    constructor() {
-        super(...arguments);
-        this._documentRootLocator = this.documentRootLocatorFactory();
-    }
-    /**
-     * Gets a `HarnessPredicate` that can be used to search for a menu with specific attributes.
-     * @param options Options for filtering which menu instances are considered a match.
-     * @return a `HarnessPredicate` configured with the given options.
-     */
-    static with(options = {}) {
-        return new HarnessPredicate(this, options).addOption('triggerText', options.triggerText, (harness, text) => HarnessPredicate.stringMatches(harness.getTriggerText(), text));
-    }
-    /** Whether the menu is disabled. */
-    async isDisabled() {
-        const disabled = (await this.host()).getAttribute('disabled');
-        return coerceBooleanProperty(await disabled);
-    }
-    /** Whether the menu is open. */
-    async isOpen() {
-        return !!(await this._getMenuPanel());
-    }
-    /** Gets the text of the menu's trigger element. */
-    async getTriggerText() {
-        return (await this.host()).text();
-    }
-    /** Focuses the menu. */
-    async focus() {
-        return (await this.host()).focus().then(() => animatingWait());
-    }
-    /** Blurs the menu. */
-    async blur() {
-        return (await this.host()).blur().then(() => animatingWait());
-    }
-    /** Whether the menu is focused. */
-    async isFocused() {
-        return (await this.host()).isFocused();
-    }
-    /** Opens the menu. */
-    async open() {
-        if (!(await this.isOpen())) {
-            return (await this.host()).click().then(() => animatingWait());
-        }
-    }
-    /** Closes the menu. */
-    async close() {
-        const panel = await this._getMenuPanel();
-        if (panel) {
-            return panel.sendKeys(TestKey.ESCAPE).then(() => animatingWait());
-        }
-    }
-    /**
-     * Gets a list of `TheSeamMenuItemHarness` representing the items in the menu.
-     * @param filters Optionally filters which menu items are included.
-     */
-    async getItems(filters) {
-        const panelId = await this._getPanelId();
-        if (panelId) {
-            return this._documentRootLocator.locatorForAll(TheSeamMenuItemHarness.with({
-                ...(filters || {}),
-                ancestor: `#${panelId}`,
-            }))();
-        }
-        return [];
-    }
-    /**
-     * Clicks an item in the menu, and optionally continues clicking items in subsequent sub-menus.
-     * @param itemFilter A filter used to represent which item in the menu should be clicked. The
-     *     first matching menu item will be clicked.
-     * @param subItemFilters A list of filters representing the items to click in any subsequent
-     *     sub-menus. The first item in the sub-menu matching the corresponding filter in
-     *     `subItemFilters` will be clicked.
-     */
-    async clickItem(itemFilter, ...subItemFilters) {
-        await this.open();
-        const items = await this.getItems(itemFilter);
-        if (!items.length) {
-            throw Error(`Could not find item matching ${JSON.stringify(itemFilter)}`);
-        }
-        if (!subItemFilters.length) {
-            return items[0].click();
-        }
-        const menu = await items[0].getSubmenu();
-        if (!menu) {
-            throw Error(`Item matching ${JSON.stringify(itemFilter)} does not have a submenu`);
-        }
-        return menu.clickItem(...subItemFilters);
-    }
-    /**
-     * Hovers an item in the menu, and optionally continues hovering items in subsequent sub-menus.
-     * @param itemFilter A filter used to represent which item in the menu should be hovered. The
-     *     first matching menu item will be hovered.
-     * @param subItemFilters A list of filters representing the items to hover in any subsequent
-     *     sub-menus. The first item in the sub-menu matching the corresponding filter in
-     *     `subItemFilters` will be hovered.
-     */
-    async hoverItem(itemFilter, ...subItemFilters) {
-        await this.open();
-        const items = await this.getItems(itemFilter);
-        if (!items.length) {
-            throw Error(`Could not find item matching ${JSON.stringify(itemFilter)}`);
-        }
-        if (!subItemFilters.length) {
-            return items[0].hover();
-        }
-        const menu = await items[0].getSubmenu();
-        if (!menu) {
-            throw Error(`Item matching ${JSON.stringify(itemFilter)} does not have a submenu`);
-        }
-        return menu.hoverItem(...subItemFilters);
-    }
-    /**
-     * Gets a `TheSeamMenuHeaderHarness` representing the header in the menu.
-     * @param filters Optionally filters which menu items are included.
-     */
-    async getHeader(filters) {
-        const panelId = await this._getPanelId();
-        if (panelId) {
-            return this._documentRootLocator.locatorForOptional(TheSeamMenuHeaderHarness.with({
-                ...(filters || {}),
-                ancestor: `#${panelId}`,
-            }))();
-        }
-        return null;
-    }
-    /**
-     * Gets a `TheSeamMenuFooterHarness` representing the footer in the menu.
-     * @param filters Optionally filters which menu items are included.
-     */
-    async getFooter(filters) {
-        const panelId = await this._getPanelId();
-        if (panelId) {
-            return this._documentRootLocator.locatorForOptional(TheSeamMenuFooterHarness.with({
-                ...(filters || {}),
-                ancestor: `#${panelId}`,
-            }))();
-        }
-        return null;
-    }
-    async getRootHarnessLoader() {
-        const panelId = await this._getPanelId();
-        return this.documentRootLocatorFactory().harnessLoaderFor(`#${panelId}`);
-    }
-    /** Gets the menu panel associated with this menu. */
-    async _getMenuPanel() {
-        const panelId = await this._getPanelId();
-        return panelId ? this._documentRootLocator.locatorForOptional(`#${panelId}`)() : null;
-    }
-    /** Gets the id of the menu panel associated with this menu. */
-    async _getPanelId() {
-        const panelId = await (await this.host()).getAttribute('aria-controls');
-        return panelId || null;
-    }
-}
-/** The selector for the host element of a `MenuComponent` instance. */
-TheSeamMenuHarness.hostSelector = '.seam-menu-toggle';
-
-class TheSeamMenuItemHarness extends ContentContainerComponentHarness {
-    /**
-     * Gets a `HarnessPredicate` that can be used to search for a menu item with specific attributes.
-     * @param options Options for filtering which menu item instances are considered a match.
-     * @return a `HarnessPredicate` configured with the given options.
-     */
-    static with(options = {}) {
-        return new HarnessPredicate(this, options)
-            .addOption('text', options.text, (harness, text) => HarnessPredicate.stringMatches(harness.getText(), text))
-            .addOption('hasSubmenu', options.hasSubmenu, async (harness, hasSubmenu) => (await harness.hasSubmenu()) === hasSubmenu);
-    }
-    /** Whether the menu is disabled. */
-    async isDisabled() {
-        const disabled = (await this.host()).getAttribute('disabled');
-        return coerceBooleanProperty(await disabled);
-    }
-    /** Gets the text of the menu item. */
-    async getText() {
-        return (await this.host()).text();
-    }
-    /** Focuses the menu item. */
-    async focus() {
-        return (await this.host()).focus().then(() => animatingWait());
-    }
-    /** Blurs the menu item. */
-    async blur() {
-        return (await this.host()).blur().then(() => animatingWait());
-    }
-    /** Whether the menu item is focused. */
-    async isFocused() {
-        return (await this.host()).isFocused();
-    }
-    /** Clicks the menu item. */
-    async click() {
-        return (await this.host()).click().then(() => animatingWait());
-    }
-    /** Hovers the menu item. */
-    async hover() {
-        return (await this.host()).hover().then(() => animatingWait());
-    }
-    /** Whether this item has a submenu. */
-    async hasSubmenu() {
-        return (await this.host()).matchesSelector(TheSeamMenuHarness.hostSelector);
-    }
-    /** Gets the submenu associated with this menu item, or null if none. */
-    async getSubmenu() {
-        if (await this.hasSubmenu()) {
-            return new TheSeamMenuHarness(this.locatorFactory);
-        }
-        return null;
-    }
-}
-/** The selector for the host element of a `MenuItemComponent` instance. */
-TheSeamMenuItemHarness.hostSelector = '.seam-menu-item';
-
-const menuDropdownPanelSlideIn = animation([
-    style({
-        opacity: 0,
-        transform: 'translateY(-70%)'
-    }),
-    group([
-        animate('170ms linear', style({ opacity: 1 })),
-        animate('220ms ease', style({ transform: 'translateY(0)' })),
-    ])
-]);
-const menuDropdownPanelSlideOut = animation([
-    style({
-        opacity: 1,
-        transform: 'translateY(0)'
-    }),
-    group([
-        animate('170ms linear', style({ opacity: 0 })),
-        animate('220ms ease', style({ transform: 'translateY(-70%)' })),
-    ])
-]);
-const menuDropdownPanelExpandIn = animation([
-    style({
-        opacity: 0,
-        transform: 'scale(0.8)'
-    }),
-    group([
-        animate('100ms linear', style({ opacity: 1 })),
-        animate('120ms ease', style({ transform: 'scale(1)' })),
-    ])
-]);
-const menuDropdownPanelExpandOut = animation([
-    style({
-        opacity: 1,
-        transform: 'scale(1)'
-    }),
-    group([
-        animate('100ms linear', style({ opacity: 0 })),
-        animate('120ms ease', style({ transform: 'scale(0.8)' })),
-    ])
-]);
-const menuDropdownPanelFadeIn = animation([
-    style({ transform: 'translateY(-30px)', opacity: '0' }),
-    animate('250ms', style({ transform: 'translateY(0)', opacity: '1' }))
-]);
-const menuDropdownPanelFadeOut = animation([
-    style({ transform: 'translateY(0)', opacity: '1' }),
-    animate('250ms', style({ transform: 'translateY(-30px)', opacity: '0' }))
-]);
-const menuDropdownPanelIn = animation([
-    query('.seam-menu-container.seam-menu-anim--slide .dropdown-menu', useAnimation(menuDropdownPanelSlideIn), { optional: true }),
-    query('.seam-menu-container.seam-menu-anim--fade .dropdown-menu', useAnimation(menuDropdownPanelFadeIn), { optional: true })
-]);
-const menuDropdownPanelOut = animation([
-    query('.seam-menu-container.seam-menu-anim--slide .dropdown-menu', useAnimation(menuDropdownPanelSlideOut), { optional: true }),
-    query('.seam-menu-container.seam-menu-anim--fade .dropdown-menu', useAnimation(menuDropdownPanelFadeOut), { optional: true })
-]);
-
-class MenuDividerComponent {
-}
-MenuDividerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MenuDividerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-MenuDividerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: MenuDividerComponent, selector: "seam-menu-divider", host: { classAttribute: "dropdown-divider d-block" }, ngImport: i0, template: ``, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MenuDividerComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'seam-menu-divider', template: ``, host: {
-                        'class': 'dropdown-divider d-block'
-                    }, changeDetection: ChangeDetectionStrategy.OnPush }]
-        }] });
-
-/**
- * Injection token used to provide the parent menu to menu-specific components.
- */
-const THESEAM_MENU_PANEL = new InjectionToken('THESEAM_MENU_PANEL');
-
-class TheSeamMenuItemBase {
-}
-const _seamMenuItemMixinBase = mixinDisabled(TheSeamMenuItemBase);
-class MenuItemComponent extends _seamMenuItemMixinBase {
-    constructor(_elementRef, _document, _focusMonitor, _changeDetectorRef, _parentMenu) {
-        super();
-        this._elementRef = _elementRef;
-        this._document = _document;
-        this._focusMonitor = _focusMonitor;
-        this._changeDetectorRef = _changeDetectorRef;
-        this._parentMenu = _parentMenu;
-        /** ARIA role for the menu item. */
-        this.role = 'menuitem';
-        this.sublevelIcon = faCaretRight;
-        this.badgeTheme = 'danger';
-        /** Stream that emits when the menu item is hovered. */
-        this._hovered = new Subject();
-        /** Stream that emits when the menu item is focused. */
-        this._focused = new Subject();
-        /** Whether the menu item is highlighted. */
-        this._highlighted = false;
-        /** Whether the menu item acts as a trigger for a sub-menu. */
-        this._triggersSubmenu = false;
-        // console.log(this._parentMenu)
-        if (_parentMenu && _parentMenu.addItem) {
-            _parentMenu.addItem(this);
-        }
-    }
-    ngOnDestroy() {
-        if (this._focusMonitor) {
-            this._focusMonitor.stopMonitoring(this._elementRef);
-        }
-        if (this._parentMenu && this._parentMenu.removeItem) {
-            this._parentMenu.removeItem(this);
-        }
-        this._hovered.complete();
-        this._focused.complete();
-    }
-    ngAfterViewInit() {
-        if (this._focusMonitor) {
-            // Start monitoring the element, so it gets the appropriate focused classes. We want
-            // to show the focus style for menu items only when the focus was not caused by a
-            // mouse or touch interaction.
-            this._focusMonitor.monitor(this._elementRef, false);
-        }
-    }
-    /** Focuses the menu item. */
-    focus(origin = 'program') {
-        if (this._focusMonitor) {
-            this._focusMonitor.focusVia(this._getHostElement(), origin);
-        }
-        else {
-            this._getHostElement().focus();
-        }
-        this._focused.next(this);
-    }
-    /** Used to set the `tabindex`. */
-    _getTabIndex() {
-        return this.disabled ? '-1' : '0';
-    }
-    /** Returns the host DOM element. */
-    _getHostElement() {
-        return this._elementRef.nativeElement;
-    }
-    /** Prevents the default element actions if it is disabled. */
-    _checkDisabled(event) {
-        if (this.disabled) {
-            event.preventDefault();
-            event.stopPropagation();
-        }
-    }
-    /** Emits to the hover stream. */
-    _handleMouseEnter() {
-        this._hovered.next(this);
-    }
-    /** Gets the label to be used when determining whether the option should be focused. */
-    getLabel() {
-        const element = this._elementRef.nativeElement;
-        const textNodeType = this._document ? this._document.TEXT_NODE : 3;
-        let output = '';
-        if (element.childNodes) {
-            const length = element.childNodes.length;
-            // Go through all the top-level text nodes and extract their text.
-            // We skip anything that's not a text node to prevent the text from
-            // being thrown off by something like an icon.
-            for (let i = 0; i < length; i++) {
-                if (element.childNodes[i].nodeType === textNodeType) {
-                    output += element.childNodes[i].textContent;
-                }
-            }
-        }
-        return output.trim();
-    }
-    _setHighlighted(isHighlighted) {
-        this._highlighted = isHighlighted;
-        this._changeDetectorRef?.markForCheck();
-    }
-    _setTriggersSubmenu(triggersSubmenu) {
-        this._triggersSubmenu = triggersSubmenu;
-        this._changeDetectorRef?.markForCheck();
-    }
-    _hasFocus() {
-        return this._document && this._document.activeElement === this._getHostElement();
-    }
-}
-MenuItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MenuItemComponent, deps: [{ token: i0.ElementRef }, { token: DOCUMENT }, { token: i1.FocusMonitor }, { token: i0.ChangeDetectorRef }, { token: THESEAM_MENU_PANEL, optional: true }], target: i0.ɵɵFactoryTarget.Component });
-MenuItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: MenuItemComponent, selector: "[seamMenuItem]", inputs: { disabled: "disabled", role: "role", icon: "icon", iconClass: "iconClass", sublevelIcon: "sublevelIcon", subLevelIconClass: "subLevelIconClass", badgeText: "badgeText", badgeTheme: "badgeTheme" }, host: { listeners: { "click": "_checkDisabled($event)", "mouseenter": "_handleMouseEnter()" }, properties: { "attr.role": "role", "class.seam-menu-item-highlighted": "_highlighted", "class.seam-menu-item-submenu-trigger": "_triggersSubmenu", "attr.tabindex": "_getTabIndex()", "attr.aria-disabled": "disabled.toString()", "attr.disabled": "disabled || null" }, classAttribute: "seam-menu-item dropdown-item" }, exportAs: ["seamMenuItem"], usesInheritance: true, ngImport: i0, template: "<div class=\"d-flex flex-row\">\n  <seam-icon *ngIf=\"icon\"\n    style=\"width: 30px; height: 20px; flex: 0 0 auto;\"\n    class=\"pr-2\"\n    [icon]=\"icon\"\n    [iconClass]=\"iconClass\"\n    iconType=\"image-fill\">\n  </seam-icon>\n\n  <div class=\"text-truncate\">\n    <ng-content></ng-content>\n  </div>\n\n  <div *ngIf=\"badgeText\" class=\"ml-2\">\n    <span class=\"badge badge-pill{{ badgeTheme ? ' badge-' + badgeTheme : '' }} position-relative\"\n      style=\"top: -2px\"\n      >{{ badgeText }}</span>\n  </div>\n\n  <div class=\"d-flex flex-grow-1 justify-content-end\">\n    <seam-icon *ngIf=\"_triggersSubmenu\"\n      style=\"width: 30px; height: 20px; flex: 0 0 auto;\"\n      class=\"pl-2\"\n      [icon]=\"sublevelIcon\"\n      [iconClass]=\"subLevelIconClass\"\n      iconType=\"image-fill\">\n    </seam-icon>\n  </div>\n</div>\n", styles: [":host.cdk-mouse-focused:not(:hover){background:transparent}:host[aria-expanded]{color:#16181b;text-decoration:none;background-color:#e9ecef}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.IconComponent, selector: "seam-icon", inputs: ["grayscaleOnDisable", "disabled", "iconClass", "icon", "size", "showDefaultOnError", "defaultIcon", "iconType"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MenuItemComponent, decorators: [{
-            type: Component,
-            args: [{ selector: '[seamMenuItem]', exportAs: 'seamMenuItem', inputs: ['disabled'], host: {
-                        '[attr.role]': 'role',
-                        'class': 'seam-menu-item dropdown-item',
-                        '[class.seam-menu-item-highlighted]': '_highlighted',
-                        '[class.seam-menu-item-submenu-trigger]': '_triggersSubmenu',
-                        '[attr.tabindex]': '_getTabIndex()',
-                        '[attr.aria-disabled]': 'disabled.toString()',
-                        '[attr.disabled]': 'disabled || null',
-                    }, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"d-flex flex-row\">\n  <seam-icon *ngIf=\"icon\"\n    style=\"width: 30px; height: 20px; flex: 0 0 auto;\"\n    class=\"pr-2\"\n    [icon]=\"icon\"\n    [iconClass]=\"iconClass\"\n    iconType=\"image-fill\">\n  </seam-icon>\n\n  <div class=\"text-truncate\">\n    <ng-content></ng-content>\n  </div>\n\n  <div *ngIf=\"badgeText\" class=\"ml-2\">\n    <span class=\"badge badge-pill{{ badgeTheme ? ' badge-' + badgeTheme : '' }} position-relative\"\n      style=\"top: -2px\"\n      >{{ badgeText }}</span>\n  </div>\n\n  <div class=\"d-flex flex-grow-1 justify-content-end\">\n    <seam-icon *ngIf=\"_triggersSubmenu\"\n      style=\"width: 30px; height: 20px; flex: 0 0 auto;\"\n      class=\"pl-2\"\n      [icon]=\"sublevelIcon\"\n      [iconClass]=\"subLevelIconClass\"\n      iconType=\"image-fill\">\n    </seam-icon>\n  </div>\n</div>\n", styles: [":host.cdk-mouse-focused:not(:hover){background:transparent}:host[aria-expanded]{color:#16181b;text-decoration:none;background-color:#e9ecef}\n"] }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: undefined, decorators: [{
-                    type: Inject,
-                    args: [DOCUMENT]
-                }] }, { type: i1.FocusMonitor }, { type: i0.ChangeDetectorRef }, { type: undefined, decorators: [{
-                    type: Inject,
-                    args: [THESEAM_MENU_PANEL]
-                }, {
-                    type: Optional
-                }] }]; }, propDecorators: { role: [{
-                type: Input
-            }], icon: [{
-                type: Input
-            }], iconClass: [{
-                type: Input
-            }], sublevelIcon: [{
-                type: Input
-            }], subLevelIconClass: [{
-                type: Input
-            }], badgeText: [{
-                type: Input
-            }], badgeTheme: [{
-                type: Input
-            }], _checkDisabled: [{
-                type: HostListener,
-                args: ['click', ['$event']]
-            }], _handleMouseEnter: [{
-                type: HostListener,
-                args: ['mouseenter']
-            }] } });
-
-let menuPanelUid = 0;
-const LIB_MENU = {
-    provide: THESEAM_MENU_PANEL,
-    // tslint:disable-next-line:no-use-before-declare
-    useExisting: forwardRef(() => MenuComponent)
-};
-class MenuComponent {
-    /**
-     * Defines a width for a menu that will scale down if the window innerWidth is
-     * smaller than the value.
-     */
-    get baseWidth() { return this._baseWidth.value; }
-    set baseWidth(value) {
-        const _val = coerceNumberProperty(value, null);
-        if (_val !== this._baseWidth.value) {
-            this._baseWidth.next(_val);
-        }
-    }
-    constructor() {
-        this._ngUnsubscribe = new Subject();
-        this.panelId = `menu-panel-${menuPanelUid++}`;
-        this._footer = new BehaviorSubject(undefined);
-        this.hasFooter$ = this._footer.pipe(map(v => v !== null && v !== undefined));
-        this._header = new BehaviorSubject(undefined);
-        this.hasHeader$ = this._header.pipe(map(v => v !== null && v !== undefined));
-        /** Menu items inside the current menu. */
-        this._items = [];
-        /** Emits whenever the amount of menu items changes. */
-        this._itemChanges = new Subject();
-        /** Subscription to tab events on the menu panel */
-        this._tabSubscription = Subscription.EMPTY;
-        /** Emits whenever an animation on the menu completes. */
-        this._animationDone = new Subject();
-        /** Whether the menu is animating. */
-        this._isAnimating = false;
-        this.closed = new EventEmitter();
-        this._baseWidth = new BehaviorSubject(null);
-        this.animationType = 'slide';
-        this._menuWidth$ = this._baseWidth.pipe(switchMap(baseWidth => {
-            if (baseWidth) {
-                return fromEvent(window, 'resize').pipe(startWith(undefined), map(() => window.innerWidth < baseWidth ? `${window.innerWidth}px` : `${baseWidth}px`));
-            }
-            return of(undefined);
-        }), distinctUntilChanged(), takeUntil(this._ngUnsubscribe));
-    }
-    ngOnDestroy() {
-        this._tabSubscription.unsubscribe();
-        this.closed.complete();
-        this._ngUnsubscribe.next(undefined);
-        this._ngUnsubscribe.complete();
-    }
-    ngAfterContentInit() {
-        this._keyManager = new FocusKeyManager(this._items).withWrap().withTypeAhead();
-        this._tabSubscription = this._keyManager.tabOut.subscribe(() => this.closed.emit('tab'));
-    }
-    /** Stream that emits whenever the hovered menu item changes. */
-    _hovered() {
-        return this._itemChanges.pipe(startWith(this._items), switchMap(items => merge(...items.map(item => item._hovered))));
-    }
-    /** Handle a keyboard event from the menu, delegating to the appropriate action. */
-    _handleKeydown(event) {
-        // tslint:disable-next-line:deprecation
-        const keyCode = event.keyCode;
-        const manager = this._keyManager;
-        switch (keyCode) {
-            case ESCAPE:
-                if (!hasModifierKey(event)) {
-                    event.preventDefault();
-                    this.closed.emit('keydown');
-                }
-                break;
-            case LEFT_ARROW:
-                if (this.parentMenu && this.direction === 'ltr') {
-                    this.closed.emit('keydown');
-                }
-                break;
-            case RIGHT_ARROW:
-                if (this.parentMenu && this.direction === 'rtl') {
-                    this.closed.emit('keydown');
-                }
-                break;
-            case HOME:
-            case END:
-                if (!hasModifierKey(event)) {
-                    keyCode === HOME ? manager?.setFirstItemActive() : manager?.setLastItemActive();
-                    event.preventDefault();
-                }
-                break;
-            default:
-                if (keyCode === UP_ARROW || keyCode === DOWN_ARROW) {
-                    manager?.setFocusOrigin('keyboard');
-                }
-                manager?.onKeydown(event);
-        }
-    }
-    /**
-     * Focus the first item in the menu.
-     * @param origin Action from which the focus originated. Used to set the correct styling.
-     */
-    focusFirstItem(origin = 'program') {
-        this._keyManager?.setFocusOrigin(origin).setFirstItemActive();
-    }
-    /**
-     * Resets the active item in the menu. This is used when the menu is opened, allowing
-     * the user to start from the first option when pressing the down arrow.
-     */
-    resetActiveItem() {
-        this._keyManager?.setActiveItem(-1);
-    }
-    /** Registers a menu item with the menu. */
-    addItem(item) {
-        // We register the items through this method, rather than picking them up through
-        // `ContentChildren`, because we need the items to be picked up by their closest
-        // `seam-menu` ancestor. If we used `@ContentChildren(MenuItemComponent, {descendants: true})`,
-        // all descendant items will bleed into the top-level menu in the case where the consumer
-        // has `seam-menu` instances nested inside each other.
-        if (this._items.indexOf(item) === -1) {
-            this._items.push(item);
-            this._itemChanges.next(this._items);
-        }
-    }
-    /** Removes an item from the menu. */
-    removeItem(item) {
-        const index = this._items.indexOf(item);
-        if (this._items.indexOf(item) > -1) {
-            this._items.splice(index, 1);
-            this._itemChanges.next(this._items);
-        }
-    }
-    /** Sets the footer component. */
-    setFooter(footer) {
-        this._footer.next(footer);
-    }
-    /** Sets the header component. */
-    setHeader(header) {
-        this._header.next(header);
-    }
-    _dropdownMenuClick(event) {
-        // This is needed, because some menu's will get stuck open if the component
-        // managing the menu is destroyed before the menu finishes its cleanup. I
-        // may look for a fix to that eventually.
-        this.closed.emit('click');
-    }
-    /** Callback that is invoked when the panel animation completes. */
-    _onAnimationDone(event) {
-        this._animationDone.next(event);
-        this._isAnimating = false;
-    }
-    _onAnimationStart(event) {
-        this._isAnimating = true;
-        // Scroll the content element to the top as soon as the animation starts. This is necessary,
-        // because we move focus to the first item while it's still being animated, which can throw
-        // the browser off when it determines the scroll position. Alternatively we can move focus
-        // when the animation is done, however moving focus asynchronously will interrupt screen
-        // readers which are in the process of reading out the menu already. We take the `element`
-        // from the `event` since we can't use a `ViewChild` to access the pane.
-        if (event.toState === 'enter' && this._keyManager?.activeItemIndex === 0) {
-            event.element.scrollTop = 0;
-        }
-    }
-}
-MenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-MenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: MenuComponent, selector: "seam-menu", inputs: { menuClass: "menuClass", baseWidth: "baseWidth", animationType: "animationType" }, outputs: { closed: "closed" }, providers: [LIB_MENU], viewQueries: [{ propertyName: "templateRef", first: true, predicate: TemplateRef, descendants: true }], exportAs: ["seamMenu"], ngImport: i0, template: "<ng-template>\n  <div class=\"seam-menu-container\"\n    @slideDown\n    (@slideDown.start)=\"_onAnimationStart($event)\"\n    (@slideDown.done)=\"_onAnimationDone($event)\"\n    [class.seam-menu-anim--slide]=\"animationType==='slide'\"\n    [class.seam-menu-anim--fade]=\"animationType==='fade'\"\n    [id]=\"panelId\">\n    <div class=\"dropdown-menu show position-static{{ menuClass ? ' ' + menuClass : '' }}\"\n      [style.width]=\"_menuWidth$ | async\"\n      [class.pt-0]=\"hasHeader$ | async\"\n      [class.pb-0]=\"hasFooter$ | async\"\n      (keydown)=\"_handleKeydown($event)\"\n      (click)=\"_dropdownMenuClick($event)\"\n      tabindex=\"-1\"\n      role=\"menu\"\n      >\n      <ng-content></ng-content>\n    </div>\n  </div>\n</ng-template>\n", styles: [".seam-menu-container.seam-menu-anim--slide{overflow:hidden}.seam-menu-container.ng-animating,.dropdown-menu.ng-animating{-webkit-user-select:none;-moz-user-select:none;user-select:none;pointer-events:none}\n"], dependencies: [{ kind: "pipe", type: i2.AsyncPipe, name: "async" }], animations: [
-        trigger('slideDown', [
-            transition(':enter', useAnimation(menuDropdownPanelIn)),
-            transition(':leave', useAnimation(menuDropdownPanelOut)),
-        ])
-    ], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MenuComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'seam-menu', providers: [LIB_MENU], animations: [
-                        trigger('slideDown', [
-                            transition(':enter', useAnimation(menuDropdownPanelIn)),
-                            transition(':leave', useAnimation(menuDropdownPanelOut)),
-                        ])
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, exportAs: 'seamMenu', template: "<ng-template>\n  <div class=\"seam-menu-container\"\n    @slideDown\n    (@slideDown.start)=\"_onAnimationStart($event)\"\n    (@slideDown.done)=\"_onAnimationDone($event)\"\n    [class.seam-menu-anim--slide]=\"animationType==='slide'\"\n    [class.seam-menu-anim--fade]=\"animationType==='fade'\"\n    [id]=\"panelId\">\n    <div class=\"dropdown-menu show position-static{{ menuClass ? ' ' + menuClass : '' }}\"\n      [style.width]=\"_menuWidth$ | async\"\n      [class.pt-0]=\"hasHeader$ | async\"\n      [class.pb-0]=\"hasFooter$ | async\"\n      (keydown)=\"_handleKeydown($event)\"\n      (click)=\"_dropdownMenuClick($event)\"\n      tabindex=\"-1\"\n      role=\"menu\"\n      >\n      <ng-content></ng-content>\n    </div>\n  </div>\n</ng-template>\n", styles: [".seam-menu-container.seam-menu-anim--slide{overflow:hidden}.seam-menu-container.ng-animating,.dropdown-menu.ng-animating{-webkit-user-select:none;-moz-user-select:none;user-select:none;pointer-events:none}\n"] }]
-        }], ctorParameters: function () { return []; }, propDecorators: { templateRef: [{
-                type: ViewChild,
-                args: [TemplateRef]
-            }], closed: [{
-                type: Output
-            }], menuClass: [{
-                type: Input
-            }], baseWidth: [{
-                type: Input
-            }], animationType: [{
-                type: Input
-            }] } });
-
-/** Options for binding a passive event listener. */
-const passiveEventListenerOptions = normalizePassiveListenerOptions({ passive: true });
-class MenuToggleDirective {
-    get menu() { return this._menu; }
-    set menu(menu) {
-        if (menu === this._menu) {
-            return;
-        }
-        this._menu = menu;
-        this._menuClosedSubscription.unsubscribe();
-        if (menu) {
-            if (menu === this._parentMenuComponent && (typeof ngDevMode === 'undefined' || ngDevMode)) {
-                throw Error(`seamMenuToggle: menu cannot contain its own trigger. Assign a menu that is ` +
-                    `not a parent of the trigger or move the trigger outside of the menu.`);
-            }
-            this._menuClosedSubscription = menu.closed.subscribe((reason) => {
-                // this._destroyMenu(reason)
-                this.closeMenu();
-                // If a click closed the menu, we should close the entire chain of nested menus.
-                if ((reason === 'click' || reason === 'tab') && this._parentMenuComponent) {
-                    this._parentMenuComponent.closed.emit(reason);
-                }
-            });
-        }
-        this._menuItemInstance?._setTriggersSubmenu(this.triggersSubmenu());
-    }
-    set positions(val) {
-        this._positions = val;
-        if (this.menuOpen()) {
-            this._overlayRef?.updatePositionStrategy(this.getOverlayPosition(this._elementRef.nativeElement));
-        }
-    }
-    get positions() {
-        const positions = this._positions;
-        if (this.triggersSubmenu()) {
-            return [
-                {
-                    originX: 'start',
-                    originY: 'top',
-                    overlayX: 'end',
-                    overlayY: 'top',
-                    offsetY: this.seamMenuTogglePositionsOffsetY,
-                },
-                {
-                    originX: 'end',
-                    originY: 'top',
-                    overlayX: 'start',
-                    overlayY: 'top',
-                    offsetY: this.seamMenuTogglePositionsOffsetY,
-                },
-                {
-                    originX: 'start',
-                    originY: 'bottom',
-                    overlayX: 'end',
-                    overlayY: 'top',
-                },
-                {
-                    originX: 'start',
-                    originY: 'top',
-                    overlayX: 'start',
-                    overlayY: 'bottom',
-                },
-            ];
-        }
-        return positions;
-    }
-    _onMouseDown(event) {
-        if (!isFakeMousedownFromScreenReader(event)) {
-            // Since right or middle button clicks won't trigger the `click` event,
-            // we shouldn't consider the menu as opened by mouse in those cases.
-            this._openedBy = event.button === 0 ? 'mouse' : null;
-            // Since clicking on the trigger won't close the menu if it opens a sub-menu,
-            // we should prevent focus from moving onto it via click to avoid the
-            // highlight from lingering on the menu item.
-            if (this.triggersSubmenu()) {
-                event.preventDefault();
-            }
-        }
-    }
-    _onKeydown(event) {
-        this._openedBy = null;
-        // console.log('keydown', event)
-        // tslint:disable-next-line:deprecation
-        const keyCode = event.keyCode;
-        if (keyCode === UP_ARROW || keyCode === DOWN_ARROW) {
-            if (this.menuOpen()) {
-                this.menu?.focusFirstItem(this._openedBy || 'program');
-            }
-        }
-        else if (keyCode === ESCAPE) {
-            this.closeMenu();
-        }
-        // Pressing enter on the trigger will trigger the click handler later.
-        if (keyCode === ENTER || keyCode === SPACE) {
-            this._openedBy = 'keyboard';
-        }
-        if (this.triggersSubmenu() &&
-            ((keyCode === RIGHT_ARROW && this.dir === 'ltr') ||
-                (keyCode === LEFT_ARROW && this.dir === 'rtl'))) {
-            this._openedBy = 'keyboard';
-            this.openMenu();
-        }
-    }
-    _onClick(event) {
-        if (this.triggersSubmenu()) {
-            // Stop event propagation to avoid closing the parent menu.
-            event.stopPropagation();
-            this.openMenu();
-        }
-        else {
-            this.toggle();
-        }
-    }
-    _onDocumentKeydown(event) {
-        if (event.keyCode === ESCAPE) {
-            this.closeMenu();
-        }
-    }
-    constructor(_elementRef, _viewContainerRef, _overlay, _focusMonitor, _parentMenu, _menuItemInstance, _dir) {
-        this._elementRef = _elementRef;
-        this._viewContainerRef = _viewContainerRef;
-        this._overlay = _overlay;
-        this._focusMonitor = _focusMonitor;
-        this._parentMenu = _parentMenu;
-        this._menuItemInstance = _menuItemInstance;
-        this._dir = _dir;
-        this._active = false;
-        this._menuClosedSubscription = Subscription.EMPTY;
-        this._closingActionsSubscription = Subscription.EMPTY;
-        this._hoverSubscription = Subscription.EMPTY;
-        this._changeDetectorRef = inject(ChangeDetectorRef);
-        this.restoreFocus = true;
-        // Tracking input type is necessary so it's possible to only auto-focus
-        // the first item of the list when the menu is opened via the keyboard
-        this._openedBy = null;
-        this._positions = [
-            {
-                originX: 'end',
-                originY: 'bottom',
-                overlayX: 'end',
-                overlayY: 'top',
-            },
-            {
-                originX: 'start',
-                originY: 'bottom',
-                overlayX: 'start',
-                overlayY: 'top',
-            },
-            {
-                originX: 'end',
-                originY: 'top',
-                overlayX: 'end',
-                overlayY: 'bottom',
-            },
-            {
-                originX: 'start',
-                originY: 'top',
-                overlayX: 'start',
-                overlayY: 'bottom',
-            },
-        ];
-        this.menuToggle = new EventEmitter();
-        // TODO: Figure out how to automatically handle this. I think the offset can
-        // be calculated using the first item's offsetTop and borderTop. The problem
-        // is that I was only able to calculate it after the animation had started, so
-        // the initial transition was slightly off.
-        this.seamMenuTogglePositionsOffsetY = -11;
-        /** Event emitted when the associated menu is opened. */
-        this.menuOpened = new EventEmitter();
-        /** Event emitted when the associated menu is opened. */
-        this.menuClosed = new EventEmitter();
-        /**
-         * Handles touch start events on the trigger.
-         * Needs to be an arrow function so we can easily use addEventListener and removeEventListener.
-         */
-        this._handleTouchStart = () => this._openedBy = 'touch';
-        this._parentMenuComponent = this._parentMenu instanceof MenuComponent ? this._parentMenu : undefined;
-        this._elementRef.nativeElement.addEventListener('touchstart', this._handleTouchStart, passiveEventListenerOptions);
-    }
-    ngOnDestroy() {
-        this.closeMenu();
-        this._elementRef.nativeElement.removeEventListener('touchstart', this._handleTouchStart, passiveEventListenerOptions);
-        this._menuClosedSubscription.unsubscribe();
-        this._closingActionsSubscription.unsubscribe();
-        this._hoverSubscription.unsubscribe();
-    }
-    ngAfterContentInit() {
-        this._handleHover();
-    }
-    toggle() {
-        if (this._active) {
-            this.closeMenu();
-        }
-        else {
-            this.openMenu();
-        }
-    }
-    openMenu() {
-        if (this._active || !this.menu) {
-            return;
-        }
-        this._active = true;
-        this._overlayRef = this._overlay.create({
-            hasBackdrop: !this._parentMenuComponent,
-            backdropClass: 'cdk-overlay-transparent-backdrop',
-            positionStrategy: this.getOverlayPosition(this._elementRef.nativeElement),
-        });
-        const tpl = this.menu.templateRef;
-        if (!tpl) {
-            throw Error(`Menu template not found.`);
-        }
-        this._overlayRef.attach(new TemplatePortal(tpl, this._viewContainerRef));
-        this._closingActionsSubscription = this._menuClosingActions().subscribe(() => this.closeMenu());
-        this._initMenu(this.menu);
-        this._menuClosedSubscription = this.menu.closed.subscribe(v => {
-            // console.log('closed', v)
-            this.closeMenu();
-        });
-        // this._overlayRef.backdropClick().subscribe(v => {
-        //   console.log('backdropClick', v)
-        // })
-        this.menuToggle.emit(true);
-    }
-    /** The text direction of the containing app. */
-    get dir() {
-        return this._dir && this._dir.value === 'rtl' ? 'rtl' : 'ltr';
-    }
-    /** Whether the menu triggers a sub-menu or a top-level one. */
-    triggersSubmenu() {
-        return !!(this._menuItemInstance && this._parentMenuComponent && this.menu);
-    }
-    closeMenu() {
-        if (!this._active) {
-            return;
-        }
-        let emitCloseEvent = false;
-        if (this.menuOpen()) {
-            emitCloseEvent = true;
-        }
-        if (this._overlayRef?.hasAttached()) {
-            this._overlayRef?.detach();
-        }
-        this._resetMenu();
-        this._elementRef.nativeElement.removeEventListener('touchstart', this._handleTouchStart, passiveEventListenerOptions);
-        this._menuClosedSubscription.unsubscribe();
-        this._closingActionsSubscription.unsubscribe();
-        if (emitCloseEvent) {
-            this.menu?.closed.emit();
-        }
-        this._active = false;
-        this.menuToggle.emit(false);
-    }
-    menuOpen() {
-        return (this._overlayRef && this._overlayRef.hasAttached()) ?? false;
-    }
-    getOverlayPosition(origin) {
-        const positionStrategy = this._overlay.position()
-            .flexibleConnectedTo(origin)
-            .withPositions(this.positions)
-            .withFlexibleDimensions(false)
-            .withPush(true);
-        return positionStrategy;
-    }
-    /**
-     * Focuses the menu trigger.
-     * @param origin Source of the menu trigger's focus.
-     */
-    focus(origin = 'program') {
-        if (this._focusMonitor) {
-            this._focusMonitor.focusVia(this._elementRef, origin);
-        }
-        else {
-            this._elementRef.nativeElement.focus();
-        }
-    }
-    /**
-     * This method sets the menu state to open and focuses the first item if
-     * the menu was opened via the keyboard.
-     */
-    _initMenu(menu) {
-        menu.parentMenu = this.triggersSubmenu() ? this._parentMenu : undefined;
-        menu.direction = this.dir;
-        // this._setMenuElevation(menu)
-        menu.focusFirstItem(this._openedBy || 'program');
-        this._setIsMenuOpen(true);
-    }
-    /**
-     * This method resets the menu when it's closed, most importantly restoring
-     * focus to the menu trigger if the menu was opened via the keyboard.
-     */
-    _resetMenu() {
-        this._setIsMenuOpen(false);
-        // We should reset focus if the user is navigating using a keyboard or
-        // if we have a top-level trigger which might cause focus to be lost
-        // when clicking on the backdrop.
-        if (this.restoreFocus) {
-            if (!this._openedBy) {
-                // Note that the focus style will show up both for `program` and
-                // `keyboard` so we don't have to specify which one it is.
-                this.focus();
-            }
-            else if (!this.triggersSubmenu()) {
-                this.focus(this._openedBy);
-            }
-        }
-        this._openedBy = null;
-    }
-    // set state rather than toggle to support triggers sharing a menu
-    _setIsMenuOpen(isOpen) {
-        if (isOpen !== this.menuOpen()) {
-            // this._menuOpen = isOpen
-            this.menuOpen() ? this.menuOpened.emit() : this.menuClosed.emit();
-            if (this.triggersSubmenu()) {
-                this._menuItemInstance?._setHighlighted(isOpen);
-            }
-            this._changeDetectorRef.markForCheck();
-        }
-    }
-    /** Returns a stream that emits whenever an action that should close the menu occurs. */
-    _menuClosingActions() {
-        const backdrop = this._overlayRef?.backdropClick() ?? of();
-        const detachments = this._overlayRef?.detachments() ?? of();
-        const parentClose = this._parentMenu ? this._parentMenu.closed : of();
-        const hover = this._parentMenuComponent ? this._parentMenuComponent._hovered().pipe(filter(active => active !== this._menuItemInstance), filter(() => this.menuOpen())) : of();
-        return merge(backdrop, parentClose, hover, detachments);
-    }
-    /** Handles the cases where the user hovers over the trigger. */
-    _handleHover() {
-        // Subscribe to changes in the hovered item in order to toggle the panel.
-        if (!this.triggersSubmenu() || !this._parentMenuComponent) {
-            return;
-        }
-        this._hoverSubscription = this._parentMenuComponent
-            ._hovered()
-            // Since we might have multiple competing triggers for the same menu (e.g. a sub-menu
-            // with different data and triggers), we have to delay it by a tick to ensure that
-            // it won't be closed immediately after it is opened.
-            .pipe(filter(active => active === this._menuItemInstance && !active.disabled), delay(0, asapScheduler))
-            .subscribe(() => {
-            this._openedBy = 'mouse';
-            // If the same menu is used between multiple triggers, it might still be animating
-            // while the new trigger tries to re-open it. Wait for the animation to finish
-            // before doing so. Also interrupt if the user moves to another item.
-            if (this.menu instanceof MenuComponent && this.menu._isAnimating) {
-                // We need the `delay(0)` here in order to avoid
-                // 'changed after checked' errors in some cases. See #12194.
-                this.menu._animationDone
-                    .pipe(take(1), delay(0, asapScheduler), takeUntil$1(this._parentMenuComponent._hovered()))
-                    .subscribe(() => this.openMenu());
-            }
-            else {
-                this.openMenu();
-            }
-        });
-    }
-}
-MenuToggleDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MenuToggleDirective, deps: [{ token: i0.ElementRef }, { token: i0.ViewContainerRef }, { token: i1$1.Overlay }, { token: i1.FocusMonitor }, { token: THESEAM_MENU_PANEL, optional: true }, { token: MenuItemComponent, optional: true, self: true }, { token: i4.Directionality, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
-MenuToggleDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: MenuToggleDirective, selector: "[seamMenuToggle]", inputs: { menu: ["seamMenuToggle", "menu"], positions: "positions", seamMenuTogglePositionsOffsetY: "seamMenuTogglePositionsOffsetY" }, outputs: { menuToggle: "menuToggle", menuOpened: "menuOpened", menuClosed: "menuClosed" }, host: { attributes: { "aria-haspopup": "true" }, listeners: { "mousedown": "_onMouseDown($event)", "keydown": "_onKeydown($event)", "click": "_onClick($event)", "document:keydown": "_onDocumentKeydown($event)" }, properties: { "attr.aria-expanded": "menuOpen() || null", "attr.aria-controls": "menuOpen() ? menu.panelId : null" }, classAttribute: "seam-menu-toggle" }, exportAs: ["seamMenuToggle"], ngImport: i0 });
-__decorate([
-    InputNumber(0)
-], MenuToggleDirective.prototype, "seamMenuTogglePositionsOffsetY", void 0);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MenuToggleDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[seamMenuToggle]',
-                    // tslint:disable-next-line:use-host-property-decorator
-                    host: {
-                        'class': 'seam-menu-toggle',
-                        'aria-haspopup': 'true',
-                        '[attr.aria-expanded]': 'menuOpen() || null',
-                        '[attr.aria-controls]': 'menuOpen() ? menu.panelId : null',
-                    },
-                    exportAs: 'seamMenuToggle'
-                }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ViewContainerRef }, { type: i1$1.Overlay }, { type: i1.FocusMonitor }, { type: undefined, decorators: [{
-                    type: Inject,
-                    args: [THESEAM_MENU_PANEL]
-                }, {
-                    type: Optional
-                }] }, { type: MenuItemComponent, decorators: [{
-                    type: Optional
-                }, {
-                    type: Self
-                }] }, { type: i4.Directionality, decorators: [{
-                    type: Optional
-                }] }]; }, propDecorators: { menu: [{
-                type: Input,
-                args: ['seamMenuToggle']
-            }], positions: [{
-                type: Input
-            }], menuToggle: [{
-                type: Output
-            }], seamMenuTogglePositionsOffsetY: [{
-                type: Input
-            }], menuOpened: [{
-                type: Output
-            }], menuClosed: [{
-                type: Output
-            }], _onMouseDown: [{
-                type: HostListener,
-                args: ['mousedown', ['$event']]
-            }], _onKeydown: [{
-                type: HostListener,
-                args: ['keydown', ['$event']]
-            }], _onClick: [{
-                type: HostListener,
-                args: ['click', ['$event']]
-            }], _onDocumentKeydown: [{
-                type: HostListener,
-                args: ['document:keydown', ['$event']]
-            }] } });
-
-// TODO: Split up the button and anchor classes.
-class MenuFooterActionComponent {
-    get _attrType() { return this.type; }
-    /** ARIA type for the button. */
-    get type() { return this._isButton() ? this._type || 'button' : undefined; }
-    set type(value) {
-        this._type = value;
-    }
-    get _classBtn() { return this._isButton(); }
-    get _classBtnLink() { return this._isButton(); }
-    get _stylePadding() { return this._isButton() && 0; }
-    get _styleBorder() { return this._isButton() && 0; }
-    get _styleDisplay() { return this._isButton() && 'inline'; }
-    constructor(_elementRef) {
-        this._elementRef = _elementRef;
-    }
-    /** Determines if the component host is a button. */
-    _isButton() {
-        return this._elementRef.nativeElement.nodeName.toLowerCase() === 'button';
-    }
-    /** Determines if the component host is an anchor. */
-    _isAnchor() {
-        return this._elementRef.nativeElement.nodeName.toLowerCase() === 'a';
-    }
-}
-MenuFooterActionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MenuFooterActionComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-MenuFooterActionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: MenuFooterActionComponent, selector: "button[seamMenuFooterAction],a[seamMenuFooterAction]", inputs: { type: "type" }, host: { properties: { "attr.type": "this._attrType", "class.btn": "this._classBtn", "class.btn-link": "this._classBtnLink", "style.padding.px": "this._stylePadding", "style.border.px": "this._styleBorder", "style.display.px": "this._styleDisplay" } }, ngImport: i0, template: "<ng-content></ng-content>\n", styles: [""], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MenuFooterActionComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'button[seamMenuFooterAction],a[seamMenuFooterAction]', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content></ng-content>\n" }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { _attrType: [{
-                type: HostBinding,
-                args: ['attr.type']
-            }], type: [{
-                type: Input
-            }], _classBtn: [{
-                type: HostBinding,
-                args: ['class.btn']
-            }], _classBtnLink: [{
-                type: HostBinding,
-                args: ['class.btn-link']
-            }], _stylePadding: [{
-                type: HostBinding,
-                args: ['style.padding.px']
-            }], _styleBorder: [{
-                type: HostBinding,
-                args: ['style.border.px']
-            }], _styleDisplay: [{
-                type: HostBinding,
-                args: ['style.display.px']
-            }] } });
-
-class MenuFooterComponent {
-    constructor(_parentMenu) {
-        this._parentMenu = _parentMenu;
-    }
-    ngOnInit() {
-        if (this._parentMenu && this._parentMenu.setFooter) {
-            this._parentMenu.setFooter(this);
-        }
-    }
-    ngOnDestroy() {
-        if (this._parentMenu && this._parentMenu.setFooter) {
-            this._parentMenu.setFooter(undefined);
-        }
-    }
-}
-MenuFooterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MenuFooterComponent, deps: [{ token: THESEAM_MENU_PANEL, optional: true }], target: i0.ɵɵFactoryTarget.Component });
-MenuFooterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: MenuFooterComponent, selector: "seam-menu-footer", host: { classAttribute: "d-flex flex-column text-center bg-light border-top rounded-bottom py-2" }, ngImport: i0, template: "<ng-content select=\"a[seamMenuFooterAction],button[seamMenuFooterAction]\"></ng-content>\n", styles: [""], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MenuFooterComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'seam-menu-footer', host: {
-                        'class': 'd-flex flex-column text-center bg-light border-top rounded-bottom py-2'
-                    }, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content select=\"a[seamMenuFooterAction],button[seamMenuFooterAction]\"></ng-content>\n" }]
-        }], ctorParameters: function () { return [{ type: undefined, decorators: [{
-                    type: Inject,
-                    args: [THESEAM_MENU_PANEL]
-                }, {
-                    type: Optional
-                }] }]; } });
-
-class MenuHeaderComponent {
-    constructor(_parentMenu) {
-        this._parentMenu = _parentMenu;
-    }
-    ngOnInit() {
-        if (this._parentMenu && this._parentMenu.setHeader) {
-            this._parentMenu.setHeader(this);
-        }
-    }
-    ngOnDestroy() {
-        if (this._parentMenu && this._parentMenu.setHeader) {
-            this._parentMenu.setHeader(undefined);
-        }
-    }
-}
-MenuHeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MenuHeaderComponent, deps: [{ token: THESEAM_MENU_PANEL, optional: true }], target: i0.ɵɵFactoryTarget.Component });
-MenuHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: MenuHeaderComponent, selector: "seam-menu-header", host: { classAttribute: "d-flex flex-column bg-light border-bottom rounded-top py-2 mb-2" }, ngImport: i0, template: "<ng-content></ng-content>\n", styles: [""], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MenuHeaderComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'seam-menu-header', host: {
-                        'class': 'd-flex flex-column bg-light border-bottom rounded-top py-2 mb-2'
-                    }, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content></ng-content>\n" }]
-        }], ctorParameters: function () { return [{ type: undefined, decorators: [{
-                    type: Inject,
-                    args: [THESEAM_MENU_PANEL]
-                }, {
-                    type: Optional
-                }] }]; } });
-
-class TheSeamMenuModule {
-}
-TheSeamMenuModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TheSeamMenuModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-TheSeamMenuModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: TheSeamMenuModule, declarations: [MenuComponent,
-        MenuToggleDirective,
-        MenuItemComponent,
-        MenuDividerComponent,
-        MenuFooterComponent,
-        MenuFooterActionComponent,
-        MenuHeaderComponent], imports: [CommonModule,
-        OverlayModule,
-        TheSeamIconModule], exports: [MenuComponent,
-        MenuToggleDirective,
-        MenuItemComponent,
-        MenuDividerComponent,
-        TheSeamIconModule,
-        OverlayModule,
-        MenuFooterComponent,
-        MenuFooterActionComponent,
-        MenuHeaderComponent] });
-TheSeamMenuModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TheSeamMenuModule, imports: [CommonModule,
-        OverlayModule,
-        TheSeamIconModule, TheSeamIconModule,
-        OverlayModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TheSeamMenuModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [
-                        MenuComponent,
-                        MenuToggleDirective,
-                        MenuItemComponent,
-                        MenuDividerComponent,
-                        MenuFooterComponent,
-                        MenuFooterActionComponent,
-                        MenuHeaderComponent,
-                    ],
-                    imports: [
-                        CommonModule,
-                        OverlayModule,
-                        TheSeamIconModule
-                    ],
-                    exports: [
-                        MenuComponent,
-                        MenuToggleDirective,
-                        MenuItemComponent,
-                        MenuDividerComponent,
-                        TheSeamIconModule,
-                        OverlayModule,
-                        MenuFooterComponent,
-                        MenuFooterActionComponent,
-                        MenuHeaderComponent
-                    ]
-                }]
-        }] });
-
-/**
- * Generated bundle index. Do not edit.
- */
-
-export { LIB_MENU, MenuComponent, MenuDividerComponent, MenuFooterActionComponent, MenuFooterComponent, MenuHeaderComponent, MenuItemComponent, MenuToggleDirective, THESEAM_MENU_PANEL, TheSeamMenuFooterHarness, TheSeamMenuHarness, TheSeamMenuHeaderHarness, TheSeamMenuItemHarness, TheSeamMenuModule, menuDropdownPanelExpandIn, menuDropdownPanelExpandOut, menuDropdownPanelFadeIn, menuDropdownPanelFadeOut, menuDropdownPanelIn, menuDropdownPanelOut, menuDropdownPanelSlideIn, menuDropdownPanelSlideOut };
-//# sourceMappingURL=theseam-ui-common-menu.mjs.map