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

package/fesm2022/theseam-ui-common-modal.mjs

@@ -0,0 +1,1447 @@
+import * as i1 from '@angular/cdk/a11y';
+import { A11yModule } from '@angular/cdk/a11y';
+import * as i1$1 from '@angular/cdk/overlay';
+import { BlockScrollStrategy, ViewportRuler, Overlay, OverlayConfig, OverlayModule } from '@angular/cdk/overlay';
+import * as i3 from '@angular/cdk/portal';
+import { BasePortalOutlet, CdkPortalOutlet, ComponentPortal, TemplatePortal, PortalModule } from '@angular/cdk/portal';
+import * as i3$1 from '@angular/common';
+import { CommonModule } from '@angular/common';
+import * as i0 from '@angular/core';
+import { InjectionToken, DOCUMENT, HostListener, ViewChild, HostBinding, Optional, Inject, Component, inject, Injector, SkipSelf, Injectable, Input, Directive, ContentChild, forwardRef, EventEmitter, isDevMode, Output, NgModule } from '@angular/core';
+import * as i5 from '@angular/forms';
+import { ReactiveFormsModule } from '@angular/forms';
+import * as i1$2 from '@angular/router';
+import { RouterModule } from '@angular/router';
+import * as i4$1 from '@fortawesome/angular-fontawesome';
+import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
+import { Directionality } from '@angular/cdk/bidi';
+import { Subject, defer, of } from 'rxjs';
+import { distinctUntilChanged, filter, map, startWith, switchMap, takeUntil } from 'rxjs/operators';
+import { trigger, state, transition, style, animate } from '@angular/animations';
+import { ESCAPE } from '@angular/cdk/keycodes';
+import * as i3$2 from '@theseam/ui-common/scrollbar';
+import * as i4 from '@theseam/ui-common/dynamic-component-loader';
+import { __decorate } from 'tslib';
+import { InputBoolean } from '@theseam/ui-common/core';
+
+/**
+ * Finds the closest MatDialogRef to an element by looking at the DOM.
+ * @param element Element relative to which to look for a dialog.
+ * @param openDialogs References to the currently-open dialogs.
+ */
+function getClosestModal(element, openDialogs) {
+    let parent = element.nativeElement.parentElement;
+    while (parent && !parent.classList.contains('seam-modal-container')) {
+        parent = parent.parentElement;
+    }
+    const parentId = parent ? parent.id : null;
+    return parentId ? openDialogs.find(dialog => dialog.id === parentId) : null;
+}
+
+// tslint:disable:no-inferrable-types
+class ModalConfig {
+    /** Component to use as the container for the dialog. */
+    containerComponent;
+    /**
+     * Where the attached component should live in Angular's *logical* component tree.
+     * This affects what is available for injection and the change detection order for the
+     * component instantiated inside of the dialog. This does not affect where the dialog
+     * content will be rendered.
+     */
+    viewContainerRef;
+    /** The id of the dialog. */
+    id;
+    /** The ARIA role of the dialog. */
+    role = 'dialog';
+    /** Custom class(es) for the overlay panel. */
+    panelClass = '';
+    /** Whether the dialog has a background. */
+    hasBackdrop = true;
+    /** Custom class(es) for the backdrop. */
+    backdropClass = '';
+    /** Whether the dialog can be closed by user interaction. */
+    disableClose = false;
+    /** The width of the dialog. */
+    width = '100%';
+    /** The height of the dialog. */
+    height = '';
+    /** The minimum width of the dialog. */
+    minWidth = '';
+    /** The minimum height of the dialog. */
+    minHeight = '';
+    /** The maximum width of the dialog. */
+    maxWidth = '';
+    /** The maximum height of the dialog. */
+    maxHeight = '';
+    /** The position of the dialog. */
+    position;
+    /** Data to be injected into the dialog content. */
+    data = null;
+    /** The layout direction for the dialog content. */
+    direction;
+    /** ID of the element that describes the dialog. */
+    ariaDescribedBy = null;
+    /** Aria label to assign to the dialog element */
+    ariaLabel = null;
+    /** Whether the dialog should focus the first focusable element on open. */
+    autoFocus = true;
+    /** Duration of the enter animation. Has to be a valid CSS value (e.g. 100ms). */
+    enterAnimationDuration = '225ms';
+    /** Duration of the exit animation. Has to be a valid CSS value (e.g. 50ms). */
+    exitAnimationDuration = '225ms';
+    /** Bootstrap modal sizes */
+    modalSize;
+}
+// tslint:enable:no-inferrable-types
+function mergeModalConfigs(a, b) {
+    return { ...a, ...b };
+}
+/** Injection token that can be used to specify modal options. */
+const LIB_MODAL_CONFIG = new InjectionToken('seamModalConfig');
+
+function throwDialogContentAlreadyAttachedError() {
+    throw Error('Attempting to attach dialog content after content is already attached');
+}
+/**
+ * Internal component that wraps user-provided dialog content.
+ * @docs-private
+ */
+class ModalContainerComponent extends BasePortalOutlet {
+    _elementRef;
+    _focusTrapFactory;
+    _changeDetectorRef;
+    _document;
+    _config;
+    get _idAttr() { return this._id; }
+    // @HostBinding is used in the class as it is expected to be extended.  Since @Component decorator
+    // metadata is not inherited by child classes, instead the host binding data is defined in a way
+    // that can be inherited.
+    // tslint:disable:no-host-decorator-in-concrete
+    get _ariaLabel() { return this._config.ariaLabel || null; }
+    get _ariaDescribedBy() { return this._config.ariaDescribedBy; }
+    get _role() { return this._config.role; }
+    // @HostBinding('attr.tabindex') get _tabindex() { return -1 }
+    _seamModalContainer = true;
+    _id;
+    constructor(_elementRef, _focusTrapFactory, _changeDetectorRef, _document, 
+    /** The dialog configuration. */
+    _config) {
+        super();
+        this._elementRef = _elementRef;
+        this._focusTrapFactory = _focusTrapFactory;
+        this._changeDetectorRef = _changeDetectorRef;
+        this._document = _document;
+        this._config = _config;
+        this._focusTrap = this._focusTrapFactory.create(this._elementRef.nativeElement, {
+            defer: true,
+        });
+        // We use a Subject with a distinctUntilChanged, rather than a callback attached to .done,
+        // because some browsers fire the done event twice and we don't want to emit duplicate events.
+        // See: https://github.com/angular/angular/issues/24084
+        this._animationDone.pipe(distinctUntilChanged((x, y) => {
+            return x.fromState === y.fromState && x.toState === y.toState;
+        })).subscribe(event => {
+            // Emit lifecycle events based on animation `done` callback.
+            if (event.toState === 'enter') {
+                this._autoFocusFirstTabbableElement();
+                this._afterEnter.next();
+                this._afterEnter.complete();
+            }
+            if (event.fromState === 'enter' && (event.toState === 'void' || event.toState === 'exit')) {
+                this._returnFocusAfterDialog();
+                this._afterExit.next();
+                this._afterExit.complete();
+            }
+        });
+    }
+    /** State of the dialog animation. */
+    _state = 'enter';
+    /** Element that was focused before the dialog was opened. Save this to restore upon close. */
+    _elementFocusedBeforeDialogWasOpened = null;
+    /** The class that traps and manages focus within the dialog. */
+    _focusTrap;
+    _modalDialog = true;
+    _modalDialogCentered = true;
+    get _modalDialogSm() { return this._config.modalSize === 'sm'; }
+    get _modalDialogLg() { return this._config.modalSize === 'lg'; }
+    get _modalDialogXl() { return this._config.modalSize === 'xl'; }
+    /** The portal host inside of this container into which the dialog content will be loaded. */
+    _portalHost;
+    /** A subject emitting before the dialog enters the view. */
+    _beforeEnter = new Subject();
+    /** A subject emitting after the dialog enters the view. */
+    _afterEnter = new Subject();
+    /** A subject emitting before the dialog exits the view. */
+    _beforeExit = new Subject();
+    /** A subject emitting after the dialog exits the view. */
+    _afterExit = new Subject();
+    /** Stream of animation `done` events. */
+    _animationDone = new Subject();
+    // NOTE: For current bootstrap style modal
+    _onClick(event) {
+        event.stopPropagation();
+    }
+    /** Destroy focus trap to place focus back to the element focused before the dialog opened. */
+    ngOnDestroy() {
+        this._focusTrap.destroy();
+        this._animationDone.complete();
+    }
+    /**
+     * Attach a ComponentPortal as content to this dialog container.
+     * @param portal Portal to be attached as the dialog content.
+     */
+    attachComponentPortal(portal) {
+        if (!this._portalHost) {
+            throw Error(`_portalHost not found.`);
+        }
+        if (this._portalHost.hasAttached()) {
+            throwDialogContentAlreadyAttachedError();
+        }
+        this._savePreviouslyFocusedElement();
+        return this._portalHost.attachComponentPortal(portal);
+    }
+    /**
+     * Attach a TemplatePortal as content to this dialog container.
+     * @param portal Portal to be attached as the dialog content.
+     */
+    attachTemplatePortal(portal) {
+        if (!this._portalHost) {
+            throw Error(`_portalHost not found.`);
+        }
+        if (this._portalHost.hasAttached()) {
+            throwDialogContentAlreadyAttachedError();
+        }
+        this._savePreviouslyFocusedElement();
+        return this._portalHost.attachTemplatePortal(portal);
+    }
+    /** Emit lifecycle events based on animation `start` callback. */
+    _onAnimationStart(event) {
+        if (event.toState === 'enter') {
+            this._beforeEnter.next();
+            this._beforeEnter.complete();
+        }
+        if (event.fromState === 'enter' && (event.toState === 'void' || event.toState === 'exit')) {
+            this._beforeExit.next();
+            this._beforeExit.complete();
+        }
+    }
+    /** Starts the dialog exit animation. */
+    _startExiting() {
+        this._state = 'exit';
+        // Mark the container for check so it can react if the
+        // view container is using OnPush change detection.
+        this._changeDetectorRef.markForCheck();
+    }
+    /** Saves a reference to the element that was focused before the dialog was opened. */
+    _savePreviouslyFocusedElement() {
+        if (this._document) {
+            this._elementFocusedBeforeDialogWasOpened = this._document.activeElement;
+            // Move focus onto the dialog immediately in order to prevent the user from accidentally
+            // opening multiple dialogs at the same time. Needs to be async, because the element
+            // may not be focusable immediately.
+            Promise.resolve().then(() => this._elementRef.nativeElement.focus());
+        }
+    }
+    /**
+     * Autofocus the first tabbable element inside of the dialog, if there is not a tabbable element,
+     * focus the dialog instead.
+     */
+    _autoFocusFirstTabbableElement() {
+        // If were to attempt to focus immediately, then the content of the dialog would not yet be
+        // ready in instances where change detection has to run first. To deal with this, we simply
+        // wait for the microtask queue to be empty.
+        if (this._config.autoFocus) {
+            this._focusTrap.focusInitialElementWhenReady().then(hasMovedFocus => {
+                // If we didn't find any focusable elements inside the dialog, focus the
+                // container so the user can't tab into other elements behind it.
+                if (!hasMovedFocus) {
+                    this._elementRef.nativeElement.focus();
+                }
+            });
+        }
+    }
+    /** Returns the focus to the element focused before the dialog was open. */
+    _returnFocusAfterDialog() {
+        const toFocus = this._elementFocusedBeforeDialogWasOpened;
+        // We need the extra check, because IE can set the `activeElement` to null in some cases.
+        if (toFocus && typeof toFocus.focus === 'function') {
+            toFocus.focus();
+        }
+    }
+    getNativeElement() {
+        return this._elementRef.nativeElement;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: ModalContainerComponent, deps: [{ token: i0.ElementRef }, { token: i1.ConfigurableFocusTrapFactory }, { token: i0.ChangeDetectorRef }, { token: DOCUMENT, optional: true }, { token: ModalConfig }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.0", type: ModalContainerComponent, isStandalone: false, selector: "seam-modal-container", host: { listeners: { "@dialog.start": "_onAnimationStart($event)", "@dialog.done": "_animationDone.next($event)", "click": "_onClick($event)" }, properties: { "@dialog": "{\n      value: _state,\n      params: {\n        enterAnimationDuration: _config.enterAnimationDuration,\n        exitAnimationDuration: _config.exitAnimationDuration\n      }\n    }", "attr.id": "this._idAttr", "attr.aria-label": "this._ariaLabel", "attr.aria-describedby": "this._ariaDescribedBy", "attr.role": "this._role", "class.seam-modal-container": "this._seamModalContainer", "class.modal-dialog": "this._modalDialog", "class.modal-dialog-centered": "this._modalDialogCentered", "class.modal-sm": "this._modalDialogSm", "class.modal-lg": "this._modalDialogLg", "class.modal-xl": "this._modalDialogXl" } }, viewQueries: [{ propertyName: "_portalHost", first: true, predicate: CdkPortalOutlet /*, { static: true }*/, descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"modal-content\" [tabindex]=\"-1\">\n  <ng-template cdkPortalOutlet></ng-template>\n</div>\n", styles: [":host[tabindex=\"-1\"]:focus:not(:focus-visible){outline:0!important}\n"], dependencies: [{ kind: "directive", type: i3.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }], animations: [
+            trigger('dialog', [
+                state('enter', style({ opacity: 1 })),
+                state('exit, void', style({ opacity: 0 })),
+                transition('* => enter', animate('{{enterAnimationDuration}}')),
+                transition('* => exit, * => void', animate('{{exitAnimationDuration}}')),
+            ])
+        ] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: ModalContainerComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'seam-modal-container', animations: [
+                        trigger('dialog', [
+                            state('enter', style({ opacity: 1 })),
+                            state('exit, void', style({ opacity: 0 })),
+                            transition('* => enter', animate('{{enterAnimationDuration}}')),
+                            transition('* => exit, * => void', animate('{{exitAnimationDuration}}')),
+                        ])
+                    ], host: {
+                        '[@dialog]': `{
+      value: _state,
+      params: {
+        enterAnimationDuration: _config.enterAnimationDuration,
+        exitAnimationDuration: _config.exitAnimationDuration
+      }
+    }`,
+                        '(@dialog.start)': '_onAnimationStart($event)',
+                        '(@dialog.done)': '_animationDone.next($event)',
+                    }, standalone: false, template: "<div class=\"modal-content\" [tabindex]=\"-1\">\n  <ng-template cdkPortalOutlet></ng-template>\n</div>\n", styles: [":host[tabindex=\"-1\"]:focus:not(:focus-visible){outline:0!important}\n"] }]
+        }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i1.ConfigurableFocusTrapFactory }, { type: i0.ChangeDetectorRef }, { type: undefined, decorators: [{
+                    type: Optional
+                }, {
+                    type: Inject,
+                    args: [DOCUMENT]
+                }] }, { type: ModalConfig }], propDecorators: { _idAttr: [{
+                type: HostBinding,
+                args: ['attr.id']
+            }], _ariaLabel: [{
+                type: HostBinding,
+                args: ['attr.aria-label']
+            }], _ariaDescribedBy: [{
+                type: HostBinding,
+                args: ['attr.aria-describedby']
+            }], _role: [{
+                type: HostBinding,
+                args: ['attr.role']
+            }], _seamModalContainer: [{
+                type: HostBinding,
+                args: ['class.seam-modal-container']
+            }], _modalDialog: [{
+                type: HostBinding,
+                args: ['class.modal-dialog']
+            }], _modalDialogCentered: [{
+                type: HostBinding,
+                args: ['class.modal-dialog-centered']
+            }], _modalDialogSm: [{
+                type: HostBinding,
+                args: ['class.modal-sm']
+            }], _modalDialogLg: [{
+                type: HostBinding,
+                args: ['class.modal-lg']
+            }], _modalDialogXl: [{
+                type: HostBinding,
+                args: ['class.modal-xl']
+            }], _portalHost: [{
+                type: ViewChild,
+                args: [CdkPortalOutlet /*, { static: true }*/, { static: true }]
+            }], _onClick: [{
+                type: HostListener,
+                args: ['click', ['$event']]
+            }] } });
+
+/** Injection token that determines the scroll handling while the dialog is open. */
+const MODAL_SCROLL_STRATEGY = new InjectionToken('ModalScrollStrategy', {
+    providedIn: 'root',
+    factory: () => {
+        const injector = inject(Injector);
+        return () => new BlockScrollStrategy(injector.get(ViewportRuler), injector.get(DOCUMENT));
+    },
+});
+/** Injection token for the Dialog's Data. */
+const MODAL_DATA = new InjectionToken('ModalData');
+/** Injection token for the DialogConfig. */
+const MODAL_CONFIG = new InjectionToken('ModalConfig');
+/** Injection token for the Dialog's DialogContainer component. */
+const MODAL_CONTAINER = new InjectionToken('ModalContainer');
+/** @docs-private */
+function THESEAM_MODAL_SCROLL_STRATEGY_PROVIDER_FACTORY(overlay) {
+    return () => overlay.scrollStrategies.block();
+}
+/** @docs-private */
+const THESEAM_MODAL_SCROLL_STRATEGY_PROVIDER = {
+    provide: MODAL_SCROLL_STRATEGY,
+    deps: [Overlay],
+    useFactory: THESEAM_MODAL_SCROLL_STRATEGY_PROVIDER_FACTORY,
+};
+
+const DRAG_CLOSE_THRESHOLD = 5;
+/** Unique id for the created dialog. */
+let uniqueId = 0;
+/**
+ * Reference to a dialog opened via the Dialog service.
+ */
+class ModalRef {
+    _overlayRef;
+    _containerInstance;
+    id;
+    /** The instance of the component in the dialog. */
+    componentInstance = null;
+    /** Whether the user is allowed to close the dialog. */
+    disableClose;
+    /** Result to be passed to afterClosed. */
+    _result;
+    _clickOutsideCleanup = null;
+    constructor(_overlayRef, _containerInstance, id = `seam-modal-${uniqueId++}`) {
+        this._overlayRef = _overlayRef;
+        this._containerInstance = _containerInstance;
+        this.id = id;
+        // Pass the id along to the container.
+        _containerInstance._id = id;
+        // If the dialog has a backdrop, handle clicks from the backdrop.
+        if (_containerInstance._config.hasBackdrop) {
+            _overlayRef.backdropClick().subscribe(() => {
+                if (!this.disableClose) {
+                    this.close();
+                }
+            });
+            this._clickOutsideCleanup = this._initCloseOnClickOutside();
+        }
+        this.beforeClosed().subscribe(() => {
+            this._overlayRef.detachBackdrop();
+        });
+        this.afterClosed().subscribe(() => {
+            this._overlayRef.detach();
+            this._overlayRef.dispose();
+            this.componentInstance = null;
+        });
+        // Close when escape keydown event occurs
+        _overlayRef.keydownEvents()
+            // tslint:disable-next-line:deprecation
+            .pipe(filter(event => event.keyCode === ESCAPE && !this.disableClose))
+            .subscribe(() => this.close());
+    }
+    _initCloseOnClickOutside() {
+        const close = () => {
+            if (!this.disableClose) {
+                this.close();
+            }
+        };
+        const isInContainer = (target) => {
+            return this._containerInstance.getNativeElement().contains(target);
+        };
+        const getPosition = (event) => {
+            return { x: event.clientX, y: event.clientY };
+        };
+        const dist = (x1, y1, x2, y2) => {
+            return Math.sqrt(Math.pow((x2 - x1), 2) + Math.pow((y2 - y1), 2));
+        };
+        let pressed = false;
+        let pressedPosition = null;
+        const _handlePressDown = (event) => {
+            pressed = true;
+            pressedPosition = getPosition(event);
+        };
+        const _handlePressUp = (event) => {
+            if (pressedPosition) {
+                const target = event.target;
+                if (target && !isInContainer(target)) {
+                    const currentPosition = getPosition(event);
+                    const d = dist(currentPosition.x, currentPosition.y, pressedPosition.x, pressedPosition.y);
+                    if (d < DRAG_CLOSE_THRESHOLD) {
+                        close();
+                    }
+                }
+                pressedPosition = null;
+            }
+            else if (pressed) {
+                close();
+            }
+            pressed = false;
+        };
+        this._overlayRef.overlayElement.addEventListener('mousedown', _handlePressDown);
+        this._overlayRef.overlayElement.addEventListener('pointerdown', _handlePressDown);
+        this._overlayRef.overlayElement.addEventListener('mouseup', _handlePressUp);
+        this._overlayRef.overlayElement.addEventListener('pointerup', _handlePressUp);
+        return () => {
+            this._overlayRef.overlayElement.removeEventListener('mousedown', _handlePressDown);
+            this._overlayRef.overlayElement.removeEventListener('pointerdown', _handlePressDown);
+            this._overlayRef.overlayElement.removeEventListener('mouseup', _handlePressUp);
+            this._overlayRef.overlayElement.removeEventListener('pointerup', _handlePressUp);
+        };
+    }
+    /** Gets an observable that emits when the overlay's backdrop has been clicked. */
+    backdropClick() {
+        return this._overlayRef.backdropClick();
+    }
+    /**
+     * Close the dialog.
+     * @param dialogResult Optional result to return to the dialog opener.
+     */
+    close(dialogResult) {
+        this._result = dialogResult;
+        this._containerInstance._startExiting();
+        if (this._clickOutsideCleanup) {
+            this._clickOutsideCleanup();
+        }
+    }
+    /**
+     * Updates the dialog's position.
+     * @param position New dialog position.
+     */
+    updatePosition(position) {
+        const strategy = this._getPositionStrategy();
+        if (position && (position.left || position.right)) {
+            position.left ? strategy.left(position.left) : strategy.right(position.right);
+        }
+        else {
+            strategy.centerHorizontally();
+        }
+        if (position && (position.top || position.bottom)) {
+            position.top ? strategy.top(position.top) : strategy.bottom(position.bottom);
+        }
+        else {
+            strategy.centerVertically();
+        }
+        this._overlayRef.updatePosition();
+        return this;
+    }
+    /**
+     * Gets an observable that emits when keydown events are targeted on the overlay.
+     */
+    keydownEvents() {
+        return this._overlayRef.keydownEvents();
+    }
+    /**
+     * Updates the dialog's width and height, defined, min and max.
+     * @param size New size for the overlay.
+     */
+    updateSize(size) {
+        if (size.width) {
+            // tslint:disable-next-line:deprecation
+            this._getPositionStrategy().width(size.width.toString());
+        }
+        if (size.height) {
+            // tslint:disable-next-line:deprecation
+            this._getPositionStrategy().height(size.height.toString());
+        }
+        this._overlayRef.updateSize(size);
+        this._overlayRef.updatePosition();
+        return this;
+    }
+    /** Fetches the position strategy object from the overlay ref. */
+    _getPositionStrategy() {
+        return this._overlayRef.getConfig().positionStrategy;
+    }
+    /** Gets an observable that emits when dialog begins opening. */
+    beforeOpened() {
+        return this._containerInstance._beforeEnter.asObservable();
+    }
+    /** Gets an observable that emits when dialog is finished opening. */
+    afterOpened() {
+        return this._containerInstance._afterEnter.asObservable();
+    }
+    /** Gets an observable that emits when dialog begins closing. */
+    beforeClosed() {
+        return this._containerInstance._beforeExit.pipe(map(() => this._result));
+    }
+    /** Gets an observable that emits when dialog is finished closing. */
+    afterClosed() {
+        return this._containerInstance._afterExit.pipe(map(() => this._result));
+    }
+}
+
+/**
+ * Service to open modal dialogs.
+ */
+class Modal {
+    overlay;
+    injector;
+    _parentDialog;
+    _scrollbars;
+    _dynamicComponentLoaderModule;
+    _scrollStrategy;
+    _dialogRefConstructor = ModalRef;
+    /** Stream that emits when all dialogs are closed. */
+    get _afterAllClosed() {
+        return this._parentDialog ? this._parentDialog.afterAllClosed : this._afterAllClosedBase;
+    }
+    _afterAllClosedBase = new Subject();
+    afterAllClosed = defer(() => this.openDialogs.length
+        ? this._afterAllClosed : this._afterAllClosed.pipe(startWith(undefined)));
+    /** Stream that emits when a dialog is opened. */
+    get afterOpened() {
+        return this._parentDialog ? this._parentDialog.afterOpened : this._afterOpened;
+    }
+    _afterOpened = new Subject();
+    /** Stream that emits when a dialog is opened. */
+    get openDialogs() {
+        return this._parentDialog ? this._parentDialog.openDialogs : this._openDialogs;
+    }
+    _openDialogs = [];
+    constructor(overlay, injector, scrollStrategy, _parentDialog, location, _scrollbars, _dynamicComponentLoaderModule) {
+        this.overlay = overlay;
+        this.injector = injector;
+        this._parentDialog = _parentDialog;
+        this._scrollbars = _scrollbars;
+        this._dynamicComponentLoaderModule = _dynamicComponentLoaderModule;
+        // Close all of the dialogs when the user goes forwards/backwards in history or when the
+        // location hash changes. Note that this usually doesn't include clicking on links (unless
+        // the user is using the `HashLocationStrategy`).
+        if (!_parentDialog && location) {
+            location.subscribe(() => this.closeAll());
+        }
+        this._scrollStrategy = scrollStrategy;
+    }
+    /** Gets an open dialog by id. */
+    getById(id) {
+        return this._openDialogs.find(ref => ref.id === id);
+    }
+    /** Closes all open dialogs. */
+    closeAll() {
+        this.openDialogs.forEach(ref => ref.close());
+    }
+    /** Opens a dialog from a component. */
+    openFromComponent(component, config) {
+        const _config = this._applyConfigDefaults(config);
+        if (_config.id && this.getById(_config.id)) {
+            throw Error(`Modal with id "${_config.id}" exists already. The modal id must be unique.`);
+        }
+        const overlayRef = this._createOverlay(_config);
+        const dialogContainer = this._attachDialogContainer(overlayRef, _config);
+        const dialogRef = this._attachDialogContentForComponent(component, dialogContainer, overlayRef, _config);
+        this.registerDialogRef(dialogRef);
+        return dialogRef;
+    }
+    /** Opens a dialog from a template. */
+    openFromTemplate(template, config) {
+        const _config = this._applyConfigDefaults(config);
+        if (_config.id && this.getById(_config.id)) {
+            throw Error(`Modal with id "${_config.id}" exists already. The modal id must be unique.`);
+        }
+        const overlayRef = this._createOverlay(_config);
+        const dialogContainer = this._attachDialogContainer(overlayRef, _config);
+        const dialogRef = this._attachDialogContentForTemplate(template, dialogContainer, overlayRef, _config);
+        this.registerDialogRef(dialogRef);
+        return dialogRef;
+    }
+    /** Opens a dialog from a lazy-loaded component. */
+    openFromLazyComponent(componentId, config) {
+        const _config = this._applyConfigDefaults(config);
+        if (_config.id && this.getById(_config.id)) {
+            throw Error(`Modal with id "${_config.id}" exists already. The modal id must be unique.`);
+        }
+        return this._dynamicComponentLoaderModule
+            .getComponentFactory(componentId)
+            .pipe(switchMap(componentFactory => {
+            const modalRef = this.openFromComponent(componentFactory.componentType, _config);
+            return of(modalRef);
+        }));
+    }
+    ngOnDestroy() {
+        // Only close all the dialogs at this level.
+        this._openDialogs.forEach(ref => ref.close());
+    }
+    /**
+     * Forwards emitting events for when dialogs are opened and all dialogs are closed.
+     */
+    registerDialogRef(dialogRef) {
+        this.openDialogs.push(dialogRef);
+        let cleanupScroll;
+        const dialogBeforeOpenSub = dialogRef.beforeOpened().subscribe(() => {
+            cleanupScroll = this._registerDialogRefScrollEvents(dialogRef);
+            dialogBeforeOpenSub.unsubscribe();
+        });
+        const dialogBeforeCloseSub = dialogRef.beforeClosed().subscribe(() => {
+            // TODO: Do I need to destroy the instance? I feel like I should, but the
+            // way I have this implemented currently causes the native scrollbar to
+            // appear before the element is removed from the DOM.
+            // this._scrollbars.destroyInstance(dialogRef._overlayRef.overlayElement)
+            if (cleanupScroll) {
+                cleanupScroll();
+            }
+            dialogBeforeCloseSub.unsubscribe();
+        });
+        const dialogOpenSub = dialogRef.afterOpened().subscribe(() => {
+            this.afterOpened.next(dialogRef);
+            dialogOpenSub.unsubscribe();
+        });
+        const dialogCloseSub = dialogRef.afterClosed().subscribe(() => {
+            // this._scrollbars.destroyInstance(dialogRef._overlayRef.overlayElement)
+            const dialogIndex = this._openDialogs.indexOf(dialogRef);
+            if (dialogIndex > -1) {
+                this._openDialogs.splice(dialogIndex, 1);
+            }
+            if (!this._openDialogs.length) {
+                this._afterAllClosedBase.next();
+                dialogCloseSub.unsubscribe();
+            }
+        });
+    }
+    // TODO: Cleanup. This was rushed together fast and became an unefficient mess.
+    _registerDialogRefScrollEvents(dialogRef) {
+        const _scrollbarMouseDownListener = () => {
+            if (dialogRef) {
+                dialogRef.disableClose = true;
+            }
+        };
+        const _scrollbarMouseUpListener = () => {
+            setTimeout(() => { if (dialogRef) {
+                dialogRef.disableClose = false;
+            } });
+        };
+        let verticalHandleElement;
+        let horizontalHandleElement;
+        this._scrollbars.initializeInstance(dialogRef._overlayRef.overlayElement, {
+            callbacks: {
+                onInitialized: () => {
+                    // console.log('onInitialized')
+                    setTimeout(() => {
+                        const instance = this._scrollbars.getInstance(dialogRef._overlayRef.overlayElement);
+                        if (instance) {
+                            verticalHandleElement = instance.getElements().scrollbarVertical.handle;
+                            if (verticalHandleElement) {
+                                verticalHandleElement.addEventListener('mousedown', _scrollbarMouseDownListener);
+                                verticalHandleElement.addEventListener('touchstart', _scrollbarMouseDownListener);
+                            }
+                            horizontalHandleElement = instance.getElements().scrollbarHorizontal.handle;
+                            if (horizontalHandleElement) {
+                                horizontalHandleElement.addEventListener('mousedown', _scrollbarMouseDownListener);
+                                horizontalHandleElement.addEventListener('touchstart', _scrollbarMouseDownListener);
+                            }
+                            if (verticalHandleElement || horizontalHandleElement) {
+                                document.addEventListener('mouseup', _scrollbarMouseUpListener);
+                                document.addEventListener('touchend', _scrollbarMouseUpListener);
+                                document.addEventListener('touchcancel', _scrollbarMouseUpListener);
+                            }
+                        }
+                    });
+                },
+                onDestroyed: () => {
+                    // console.log('onDestroyed')
+                    // // const instance = this._scrollbars.getInstance(dialogRef._overlayRef.overlayElement)
+                    // // const scrollElem = instance.getElements().scrollbarVertical.handle
+                    // if (verticalHandleElement) {
+                    //   verticalHandleElement.removeEventListener('mousedown', _scrollbarMouseDownListener)
+                    //   verticalHandleElement.removeEventListener('touchstart', _scrollbarMouseDownListener)
+                    // }
+                    // if (horizontalHandleElement) {
+                    //   horizontalHandleElement.removeEventListener('mousedown', _scrollbarMouseDownListener)
+                    //   horizontalHandleElement.removeEventListener('touchstart', _scrollbarMouseDownListener)
+                    // }
+                    // if (verticalHandleElement || horizontalHandleElement) {
+                    //   document.removeEventListener('mouseup', _scrollbarMouseUpListener)
+                    //   document.removeEventListener('touchend', _scrollbarMouseUpListener)
+                    //   document.removeEventListener('touchcancel', _scrollbarMouseUpListener)
+                    // }
+                }
+            }
+        });
+        // Cleans up the registered events.
+        return () => {
+            // console.log('scrollevents cleanup')
+            // const instance = this._scrollbars.getInstance(dialogRef._overlayRef.overlayElement)
+            // const scrollElem = instance.getElements().scrollbarVertical.handle
+            if (verticalHandleElement) {
+                verticalHandleElement.removeEventListener('mousedown', _scrollbarMouseDownListener);
+                verticalHandleElement.removeEventListener('touchstart', _scrollbarMouseDownListener);
+            }
+            if (horizontalHandleElement) {
+                horizontalHandleElement.removeEventListener('mousedown', _scrollbarMouseDownListener);
+                horizontalHandleElement.removeEventListener('touchstart', _scrollbarMouseDownListener);
+            }
+            if (verticalHandleElement || horizontalHandleElement) {
+                document.removeEventListener('mouseup', _scrollbarMouseUpListener);
+                document.removeEventListener('touchend', _scrollbarMouseUpListener);
+                document.removeEventListener('touchcancel', _scrollbarMouseUpListener);
+            }
+        };
+    }
+    /**
+     * Creates an overlay config from a dialog config.
+     * @param config The dialog configuration.
+     * @returns The overlay configuration.
+     */
+    _createOverlay(config) {
+        let panelClass = (config.panelClass || []);
+        if (typeof panelClass === 'string') {
+            panelClass = [panelClass];
+        }
+        panelClass = [...panelClass, 'modal', 'd-block', 'overflow-auto'];
+        const overlayConfig = new OverlayConfig({
+            positionStrategy: this.overlay.position().global(),
+            scrollStrategy: this._scrollStrategy(),
+            panelClass,
+            hasBackdrop: config.hasBackdrop,
+            direction: config.direction,
+            minWidth: config.minWidth,
+            minHeight: config.minHeight,
+            maxWidth: config.maxWidth,
+            maxHeight: config.maxHeight
+        });
+        if (config.backdropClass) {
+            overlayConfig.backdropClass = config.backdropClass;
+        }
+        return this.overlay.create(overlayConfig);
+    }
+    /**
+     * Attaches an MatDialogContainer to a dialog's already-created overlay.
+     * @param overlay Reference to the dialog's underlying overlay.
+     * @param config The dialog configuration.
+     * @returns A promise resolving to a ComponentRef for the attached container.
+     */
+    _attachDialogContainer(overlay, config) {
+        const container = config.containerComponent || this.injector.get(MODAL_CONTAINER, ModalContainerComponent);
+        const userInjector = config && config.viewContainerRef && config.viewContainerRef.injector;
+        const injector = Injector.create({
+            parent: userInjector || this.injector,
+            providers: [
+                { provide: ModalConfig, useValue: config },
+            ],
+        });
+        const containerPortal = new ComponentPortal(container, config.viewContainerRef, injector);
+        const containerRef = overlay.attach(containerPortal);
+        containerRef.instance._config = config;
+        return containerRef.instance;
+    }
+    /**
+     * Attaches the user-provided component to the already-created MatDialogContainer.
+     * @param componentOrTemplateRef The type of component being loaded into the dialog,
+     *     or a TemplateRef to instantiate as the content.
+     * @param dialogContainer Reference to the wrapping MatDialogContainer.
+     * @param overlayRef Reference to the overlay in which the dialog resides.
+     * @param config The dialog configuration.
+     * @returns A promise resolving to the MatDialogRef that should be returned to the user.
+     */
+    _attachDialogContentForComponent(componentOrTemplateRef, dialogContainer, overlayRef, config) {
+        // Create a reference to the dialog we're creating in order to give the user a handle
+        // to modify and close it.
+        // eslint-disable-next-line new-cap
+        const dialogRef = new this._dialogRefConstructor(overlayRef, dialogContainer, config.id);
+        const injector = this._createInjector(config, dialogRef, dialogContainer);
+        const contentRef = dialogContainer.attachComponentPortal(new ComponentPortal(componentOrTemplateRef, undefined, injector));
+        dialogRef.componentInstance = contentRef.instance;
+        dialogRef.disableClose = config.disableClose;
+        dialogRef.updateSize({ width: config.width, height: config.height })
+            .updatePosition(config.position);
+        return dialogRef;
+    }
+    /**
+     * Attaches the user-provided component to the already-created MatDialogContainer.
+     * @param componentOrTemplateRef The type of component being loaded into the dialog,
+     *     or a TemplateRef to instantiate as the content.
+     * @param dialogContainer Reference to the wrapping MatDialogContainer.
+     * @param overlayRef Reference to the overlay in which the dialog resides.
+     * @param config The dialog configuration.
+     * @returns A promise resolving to the MatDialogRef that should be returned to the user.
+     */
+    _attachDialogContentForTemplate(componentOrTemplateRef, dialogContainer, overlayRef, config) {
+        // Create a reference to the dialog we're creating in order to give the user a handle
+        // to modify and close it.
+        // eslint-disable-next-line new-cap
+        const dialogRef = new this._dialogRefConstructor(overlayRef, dialogContainer, config.id);
+        dialogContainer.attachTemplatePortal(new TemplatePortal(componentOrTemplateRef, null, { $implicit: config.data, dialogRef }));
+        dialogRef.updateSize({ width: config.width, height: config.height })
+            .updatePosition(config.position);
+        return dialogRef;
+    }
+    /**
+     * Creates a custom injector to be used inside the dialog. This allows a component loaded inside
+     * of a dialog to close itself and, optionally, to return a value.
+     * @param config Config object that is used to construct the dialog.
+     * @param dialogRef Reference to the dialog.
+     * @param container Dialog container element that wraps all of the contents.
+     * @returns The custom injector that can be used inside the dialog.
+     */
+    _createInjector(config, dialogRef, dialogContainer) {
+        const userInjector = config && config.viewContainerRef && config.viewContainerRef.injector;
+        const providers = [
+            { provide: MODAL_CONTAINER, useValue: dialogContainer },
+            { provide: MODAL_DATA, useValue: config.data },
+        ];
+        if (config.direction &&
+            (!userInjector || !userInjector.get(Directionality, null))) {
+            providers.push({
+                provide: Directionality,
+                useValue: {
+                    value: config.direction,
+                    change: of(),
+                },
+            });
+        }
+        return Injector.create({ parent: userInjector || this.injector, providers });
+    }
+    /**
+     * Expands the provided configuration object to include the default values for properties which
+     * are undefined.
+     */
+    _applyConfigDefaults(config) {
+        const dialogConfig = this.injector.get(MODAL_CONFIG, ModalConfig);
+        // eslint-disable-next-line new-cap
+        return { ...new dialogConfig(), ...config };
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: Modal, deps: [{ token: i1$1.Overlay }, { token: i0.Injector }, { token: MODAL_SCROLL_STRATEGY }, { token: Modal, optional: true, skipSelf: true }, { token: i3$1.Location, optional: true }, { token: i3$2.TheSeamOverlayScrollbarsService }, { token: i4.TheSeamDynamicComponentLoader }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: Modal, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: Modal, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }], ctorParameters: () => [{ type: i1$1.Overlay }, { type: i0.Injector }, { type: undefined, decorators: [{
+                    type: Inject,
+                    args: [MODAL_SCROLL_STRATEGY]
+                }] }, { type: Modal, decorators: [{
+                    type: Optional
+                }, {
+                    type: SkipSelf
+                }] }, { type: i3$1.Location, decorators: [{
+                    type: Optional
+                }] }, { type: i3$2.TheSeamOverlayScrollbarsService }, { type: i4.TheSeamDynamicComponentLoader }] });
+
+class ModalCloseDirective {
+    _elementRef;
+    _modal;
+    _modalRef;
+    modalRef;
+    // @HostBinding('class.close') _closeCss = true
+    get _attrType() { return this.type; }
+    type = 'button';
+    get _attrAriaLabel() { return this.ariaLabel || null; }
+    /** Screenreader label for the button. */
+    ariaLabel;
+    seamModalClose;
+    // NOTE: This will most likely be temporary.
+    seamModalNext;
+    seamModalNextConfig;
+    _onClick() {
+        if (this.modalRef) {
+            if (this.seamModalNext) {
+                this.modalRef.afterClosed().subscribe(() => {
+                    if (typeof this.seamModalNext === 'string') {
+                        this._modal.openFromLazyComponent(this.seamModalNext, this.seamModalNextConfig).subscribe();
+                    }
+                    else {
+                        this._modal.openFromComponent(this.seamModalNext, this.seamModalNextConfig);
+                    }
+                });
+            }
+            this.modalRef.close(this.seamModalClose);
+        }
+    }
+    constructor(_elementRef, _modal, _modalRef) {
+        this._elementRef = _elementRef;
+        this._modal = _modal;
+        this._modalRef = _modalRef;
+        this.modalRef = _modalRef;
+    }
+    ngOnInit() {
+        if (!this.modalRef) {
+            // When this directive is included in a dialog via TemplateRef (rather than being
+            // in a Component), the DialogRef isn't available via injection because embedded
+            // views cannot be given a custom injector. Instead, we look up the DialogRef by
+            // ID. This must occur in `onInit`, as the ID binding for the dialog container won't
+            // be resolved at constructor time.
+            this.modalRef = getClosestModal(this._elementRef, this._modal.openDialogs);
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: ModalCloseDirective, deps: [{ token: i0.ElementRef }, { token: Modal }, { token: ModalRef, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.0", type: ModalCloseDirective, isStandalone: false, selector: "button[seamModalClose]", inputs: { type: "type", ariaLabel: ["aria-label", "ariaLabel"], seamModalClose: "seamModalClose", seamModalNext: "seamModalNext", seamModalNextConfig: "seamModalNextConfig" }, host: { listeners: { "click": "_onClick()" }, properties: { "attr.type": "this._attrType", "attr.aria-label": "this._attrAriaLabel" } }, exportAs: ["seamModalClose"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: ModalCloseDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'button[seamModalClose]',
+                    exportAs: 'seamModalClose',
+                    standalone: false
+                }]
+        }], ctorParameters: () => [{ type: i0.ElementRef }, { type: Modal }, { type: ModalRef, decorators: [{
+                    type: Optional
+                }] }], propDecorators: { _attrType: [{
+                type: HostBinding,
+                args: ['attr.type']
+            }], type: [{
+                type: Input
+            }], _attrAriaLabel: [{
+                type: HostBinding,
+                args: ['attr.aria-label']
+            }], ariaLabel: [{
+                type: Input,
+                args: ['aria-label']
+            }], seamModalClose: [{
+                type: Input
+            }], seamModalNext: [{
+                type: Input
+            }], seamModalNextConfig: [{
+                type: Input
+            }], _onClick: [{
+                type: HostListener,
+                args: ['click']
+            }] } });
+
+class ModalFooterTplDirective {
+    template;
+    constructor(template) {
+        this.template = template;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: ModalFooterTplDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.0", type: ModalFooterTplDirective, isStandalone: false, selector: "[seamModalFooterTpl]", ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: ModalFooterTplDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[seamModalFooterTpl]',
+                    standalone: false
+                }]
+        }], ctorParameters: () => [{ type: i0.TemplateRef }] });
+
+class ModalHeaderIconTplDirective {
+    template;
+    constructor(template) {
+        this.template = template;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: ModalHeaderIconTplDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.0", type: ModalHeaderIconTplDirective, isStandalone: false, selector: "[seamModalHeaderIconTpl]", ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: ModalHeaderIconTplDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[seamModalHeaderIconTpl]',
+                    standalone: false
+                }]
+        }], ctorParameters: () => [{ type: i0.TemplateRef }] });
+
+class ModalHeaderTitleTplDirective {
+    template;
+    constructor(template) {
+        this.template = template;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: ModalHeaderTitleTplDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.0", type: ModalHeaderTitleTplDirective, isStandalone: false, selector: "[seamModalHeaderTitleTpl]", ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: ModalHeaderTitleTplDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[seamModalHeaderTitleTpl]',
+                    standalone: false
+                }]
+        }], ctorParameters: () => [{ type: i0.TemplateRef }] });
+
+class ModalTitleDirective {
+    _elementRef;
+    _modalTitleCss = true;
+    constructor(_elementRef) {
+        this._elementRef = _elementRef;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: ModalTitleDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.0", type: ModalTitleDirective, isStandalone: false, selector: "[seamModalTitle]", host: { properties: { "class.modal-title": "this._modalTitleCss" } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: ModalTitleDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[seamModalTitle]',
+                    standalone: false
+                }]
+        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { _modalTitleCss: [{
+                type: HostBinding,
+                args: ['class.modal-title']
+            }] } });
+
+// TODO: Make this work for current modal usage.
+class ModalDirective {
+    template;
+    modal;
+    constructor(template, modal) {
+        this.template = template;
+        this.modal = modal;
+    }
+    open() {
+        // console.log('[ModalDirective] open')
+        const ref = this.modal.openFromTemplate(this.template);
+        // ref.backdropClick().subscribe(e => console.log('backdropClick', e))
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: ModalDirective, deps: [{ token: i0.TemplateRef }, { token: Modal }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.0", type: ModalDirective, isStandalone: false, selector: "[seamModal]", exportAs: ["seamModal"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: ModalDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[seamModal]',
+                    exportAs: 'seamModal',
+                    standalone: false
+                }]
+        }], ctorParameters: () => [{ type: i0.TemplateRef }, { type: Modal }] });
+
+class ModalBodyComponent {
+    _modalBodyCss = true;
+    _paddingCss = true;
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: ModalBodyComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.0", type: ModalBodyComponent, isStandalone: false, selector: "seam-modal-body", host: { properties: { "class.modal-body": "this._modalBodyCss", "class.p-3": "this._paddingCss" } }, ngImport: i0, template: "<ng-content></ng-content>\n", styles: [":host{display:block}\n"] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: ModalBodyComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'seam-modal-body', standalone: false, template: "<ng-content></ng-content>\n", styles: [":host{display:block}\n"] }]
+        }], propDecorators: { _modalBodyCss: [{
+                type: HostBinding,
+                args: ['class.modal-body']
+            }], _paddingCss: [{
+                type: HostBinding,
+                args: ['class.p-3']
+            }] } });
+
+class ModalFooterComponent {
+    _modalFooterCss = true;
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: ModalFooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.0", type: ModalFooterComponent, isStandalone: false, selector: "seam-modal-footer", host: { properties: { "class.modal-footer": "this._modalFooterCss" } }, ngImport: i0, template: "<ng-content></ng-content>\n", styles: [""] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: ModalFooterComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'seam-modal-footer', standalone: false, template: "<ng-content></ng-content>\n" }]
+        }], propDecorators: { _modalFooterCss: [{
+                type: HostBinding,
+                args: ['class.modal-footer']
+            }] } });
+
+class ModalHeaderComponent {
+    _modalHeaderCss = true;
+    hasCloseBtn = true;
+    _titleDirective;
+    _closeDirective;
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: ModalHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.0", type: ModalHeaderComponent, isStandalone: false, selector: "seam-modal-header", inputs: { hasCloseBtn: "hasCloseBtn" }, host: { properties: { "class.modal-header": "this._modalHeaderCss" } }, queries: [{ propertyName: "_titleDirective", first: true, predicate: ModalTitleDirective, descendants: true, static: true }, { propertyName: "_closeDirective", first: true, predicate: ModalCloseDirective, descendants: true, static: true }], ngImport: i0, template: "<ng-content></ng-content>\n\n<!-- <button seamModalClose>\n  <span aria-hidden=\"true\">&times;</span>\n</button> -->\n\n<!-- seam-modal-header-close -->\n", styles: [""] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: ModalHeaderComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'seam-modal-header', standalone: false, template: "<ng-content></ng-content>\n\n<!-- <button seamModalClose>\n  <span aria-hidden=\"true\">&times;</span>\n</button> -->\n\n<!-- seam-modal-header-close -->\n" }]
+        }], propDecorators: { _modalHeaderCss: [{
+                type: HostBinding,
+                args: ['class.modal-header']
+            }], hasCloseBtn: [{
+                type: Input
+            }], _titleDirective: [{
+                type: ContentChild,
+                args: [ModalTitleDirective, { static: true }]
+            }], _closeDirective: [{
+                type: ContentChild,
+                args: [ModalCloseDirective, { static: true }]
+            }] } });
+
+const THESEAM_MODAL_CONTAINER = new InjectionToken('seamModalContainer');
+
+const LIB_MODAL = {
+    provide: THESEAM_MODAL_CONTAINER,
+    // tslint:disable-next-line:no-use-before-declare
+    useExisting: forwardRef(() => ModalComponent),
+    multi: true,
+};
+class ModalComponent {
+    _viewContainerRef;
+    _overlay;
+    _route;
+    static ngAcceptInputType_showCloseBtn;
+    set closeOnKeyPressed(value) { this._closeOnKeyPressed = Array.isArray(value) ? value : []; }
+    get closeOnKeyPressed() { return this._closeOnKeyPressed; }
+    _closeOnKeyPressed = [ESCAPE];
+    showCloseBtn = true;
+    titleText;
+    get icon() { return this._iconUrl || this._iconObj; }
+    set icon(value) {
+        if (typeof value === 'string') {
+            this._iconUrl = value;
+            this._iconObj = undefined;
+        }
+        else {
+            this._iconUrl = undefined;
+            this._iconObj = value;
+        }
+    }
+    _iconUrl;
+    _iconObj;
+    get iconTpl() {
+        return this._iconTpl || (this._queryIconTpl && this._queryIconTpl.template);
+    }
+    set iconTpl(value) {
+        this._iconTpl = value;
+    }
+    _iconTpl;
+    get titleTpl() {
+        return this._titleTpl || (this._queryTitleTpl && this._queryTitleTpl.template);
+    }
+    set titleTpl(value) {
+        this._titleTpl = value;
+    }
+    _titleTpl;
+    get footerTpl() {
+        return this._footerTpl || (this._queryFooterTpl && this._queryFooterTpl.template);
+    }
+    set footerTpl(value) {
+        this._footerTpl = value;
+    }
+    _footerTpl;
+    modalClosed = new EventEmitter();
+    _overlayRef;
+    overlayDetached = new EventEmitter();
+    _queryIconTpl;
+    _queryTitleTpl;
+    _queryFooterTpl;
+    _modalTpl;
+    /** Makes the modal container a form with this formGroup. */
+    form;
+    /** Emit the `(ngSubmit)` event. NOTE: Only if `form` is defined. */
+    formSubmit = new EventEmitter();
+    constructor(_viewContainerRef, _overlay, _route) {
+        this._viewContainerRef = _viewContainerRef;
+        this._overlay = _overlay;
+        this._route = _route;
+        if (isDevMode()) {
+            // eslint-disable-next-line no-console
+            console.warn('seamModal has some issues with its design. Use the Modal service for now, because seamModal will have breaking changes or be removed soon.');
+        }
+    }
+    ngOnDestroy() {
+        this.close();
+    }
+    ngAfterViewInit() {
+        if (this.isRouteModal()) {
+            this.open();
+        }
+    }
+    open(portal) {
+        if (this._overlayRef && this._overlayRef.hasAttached()) {
+            return;
+        }
+        const positionStrategy = this._overlay.position()
+            .global()
+            .centerHorizontally()
+            .centerVertically();
+        this._overlayRef = this._overlay.create({
+            hasBackdrop: true,
+            positionStrategy
+        });
+        this._overlayRef.detachments().subscribe(_ => this.overlayDetached.emit());
+        this._overlayRef.backdropClick().subscribe(_ => this.close());
+        this._overlayRef.keydownEvents()
+            // tslint:disable-next-line:deprecation
+            .pipe(filter(e => e.keyCode === ESCAPE))
+            .subscribe(_ => this.close());
+        let portalToAttach = portal;
+        if (!portalToAttach) {
+            if (!this._modalTpl) {
+                throw new Error(`_modalTpl not found.`);
+            }
+            portalToAttach = new TemplatePortal(this._modalTpl, this._viewContainerRef);
+        }
+        this._overlayRef.attach(portalToAttach);
+    }
+    close() {
+        if (!this._overlayRef || !this._overlayRef.hasAttached()) {
+            return;
+        }
+        this._overlayRef.detach();
+        this.modalClosed.emit();
+    }
+    _onSubmit() {
+        this.formSubmit.emit();
+    }
+    isRouteModal() {
+        return this._route.outlet === 'modal';
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: ModalComponent, deps: [{ token: i0.ViewContainerRef }, { token: i1$1.Overlay }, { token: i1$2.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.0", type: ModalComponent, isStandalone: false, selector: "seam-modal", inputs: { closeOnKeyPressed: "closeOnKeyPressed", showCloseBtn: "showCloseBtn", titleText: "titleText", icon: "icon", iconTpl: "iconTpl", titleTpl: "titleTpl", footerTpl: "footerTpl", form: "form" }, outputs: { modalClosed: "modalClosed", overlayDetached: "overlayDetached", formSubmit: "formSubmit" }, providers: [LIB_MODAL], queries: [{ propertyName: "_queryIconTpl", first: true, predicate: ModalHeaderIconTplDirective, descendants: true, static: true }, { propertyName: "_queryTitleTpl", first: true, predicate: ModalHeaderTitleTplDirective, descendants: true, static: true }, { propertyName: "_queryFooterTpl", first: true, predicate: ModalFooterTplDirective, descendants: true, static: true }], viewQueries: [{ propertyName: "_modalTpl", first: true, predicate: ["modalTpl"], descendants: true, static: true }], ngImport: i0, template: "<ng-template #modalTpl>\n  <form *ngIf=\"form\" [formGroup]=\"form\" (ngSubmit)=\"_onSubmit()\" class=\"p-4\" style=\"max-width: 800px\">\n    <ng-container *ngTemplateOutlet=\"modalContent\"></ng-container>\n  </form>\n\n  <div *ngIf=\"!form\" class=\"p-4\" style=\"max-width: 800px\">\n    <ng-container *ngTemplateOutlet=\"modalContent\"></ng-container>\n  </div>\n\n  <ng-template #modalContent>\n    <div class=\"modal-content\">\n      <div class=\"modal-header py-2\">\n        <h4 class=\"modal-title\">\n          <span class=\"pr-2 modal-header-icon\">\n            <ng-container *ngIf=\"iconTpl; else noIconTpl\">\n              <ng-template\n                [ngTemplateOutlet]=\"iconTpl\"\n                [ngTemplateOutletContext]=\"{ $implicit: icon, icon: icon }\">\n              </ng-template>\n            </ng-container>\n            <ng-template #noIconTpl>\n              <fa-icon *ngIf=\"_iconObj\"\n                class=\"modal-header-icon--fa\"\n                [icon]=\"_iconObj\"\n                size=\"sm\"></fa-icon>\n              <img *ngIf=\"_iconUrl\"\n                class=\"modal-header-icon--img\"\n                [src]=\"_iconUrl\" [alt]=\"titleText\">\n            </ng-template>\n          </span>\n\n          <span class=\"modal-header-title\">\n            <ng-container *ngIf=\"titleTpl; else noTitleTpl\">\n              <ng-template\n                [ngTemplateOutlet]=\"titleTpl\"\n                [ngTemplateOutletContext]=\"{ $implicit: titleText, title: titleText }\">\n              </ng-template>\n            </ng-container>\n            <ng-template #noTitleTpl>{{ titleText }}</ng-template>\n          </span>\n        </h4>\n        <button *ngIf=\"showCloseBtn\"\n          type=\"button\"\n          class=\"close\"\n          (click)=\"close()\"\n          aria-label=\"Close\">\n          <span aria-hidden=\"true\">&times;</span>\n        </button>\n      </div>\n      <div class=\"modal-body\">\n        <ng-content></ng-content>\n      </div>\n      <div *ngIf=\"_queryFooterTpl\" class=\"modal-footer p-2\">\n        <ng-container *ngComponentOutlet=\"$any(_queryFooterTpl.template)\"></ng-container>\n      </div>\n    </div>\n  </ng-template>\n</ng-template>\n", styles: [""], dependencies: [{ kind: "directive", type: i3$1.NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"], exportAs: ["ngComponentOutlet"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i4$1.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { kind: "directive", type: i5.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }] });
+}
+__decorate([
+    InputBoolean()
+], ModalComponent.prototype, "showCloseBtn", void 0);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: ModalComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'seam-modal', providers: [LIB_MODAL], standalone: false, template: "<ng-template #modalTpl>\n  <form *ngIf=\"form\" [formGroup]=\"form\" (ngSubmit)=\"_onSubmit()\" class=\"p-4\" style=\"max-width: 800px\">\n    <ng-container *ngTemplateOutlet=\"modalContent\"></ng-container>\n  </form>\n\n  <div *ngIf=\"!form\" class=\"p-4\" style=\"max-width: 800px\">\n    <ng-container *ngTemplateOutlet=\"modalContent\"></ng-container>\n  </div>\n\n  <ng-template #modalContent>\n    <div class=\"modal-content\">\n      <div class=\"modal-header py-2\">\n        <h4 class=\"modal-title\">\n          <span class=\"pr-2 modal-header-icon\">\n            <ng-container *ngIf=\"iconTpl; else noIconTpl\">\n              <ng-template\n                [ngTemplateOutlet]=\"iconTpl\"\n                [ngTemplateOutletContext]=\"{ $implicit: icon, icon: icon }\">\n              </ng-template>\n            </ng-container>\n            <ng-template #noIconTpl>\n              <fa-icon *ngIf=\"_iconObj\"\n                class=\"modal-header-icon--fa\"\n                [icon]=\"_iconObj\"\n                size=\"sm\"></fa-icon>\n              <img *ngIf=\"_iconUrl\"\n                class=\"modal-header-icon--img\"\n                [src]=\"_iconUrl\" [alt]=\"titleText\">\n            </ng-template>\n          </span>\n\n          <span class=\"modal-header-title\">\n            <ng-container *ngIf=\"titleTpl; else noTitleTpl\">\n              <ng-template\n                [ngTemplateOutlet]=\"titleTpl\"\n                [ngTemplateOutletContext]=\"{ $implicit: titleText, title: titleText }\">\n              </ng-template>\n            </ng-container>\n            <ng-template #noTitleTpl>{{ titleText }}</ng-template>\n          </span>\n        </h4>\n        <button *ngIf=\"showCloseBtn\"\n          type=\"button\"\n          class=\"close\"\n          (click)=\"close()\"\n          aria-label=\"Close\">\n          <span aria-hidden=\"true\">&times;</span>\n        </button>\n      </div>\n      <div class=\"modal-body\">\n        <ng-content></ng-content>\n      </div>\n      <div *ngIf=\"_queryFooterTpl\" class=\"modal-footer p-2\">\n        <ng-container *ngComponentOutlet=\"$any(_queryFooterTpl.template)\"></ng-container>\n      </div>\n    </div>\n  </ng-template>\n</ng-template>\n" }]
+        }], ctorParameters: () => [{ type: i0.ViewContainerRef }, { type: i1$1.Overlay }, { type: i1$2.ActivatedRoute }], propDecorators: { closeOnKeyPressed: [{
+                type: Input
+            }], showCloseBtn: [{
+                type: Input
+            }], titleText: [{
+                type: Input
+            }], icon: [{
+                type: Input
+            }], iconTpl: [{
+                type: Input
+            }], titleTpl: [{
+                type: Input
+            }], footerTpl: [{
+                type: Input
+            }], modalClosed: [{
+                type: Output
+            }], overlayDetached: [{
+                type: Output
+            }], _queryIconTpl: [{
+                type: ContentChild,
+                args: [ModalHeaderIconTplDirective, { static: true }]
+            }], _queryTitleTpl: [{
+                type: ContentChild,
+                args: [ModalHeaderTitleTplDirective, { static: true }]
+            }], _queryFooterTpl: [{
+                type: ContentChild,
+                args: [ModalFooterTplDirective, { static: true }]
+            }], _modalTpl: [{
+                type: ViewChild,
+                args: ['modalTpl', { static: true }]
+            }], form: [{
+                type: Input
+            }], formSubmit: [{
+                type: Output
+            }] } });
+
+class RouteModalComponent {
+    _route;
+    _router;
+    _modal;
+    _ngUnsubscribe = new Subject();
+    // @ViewChild(ModalComponent, { static: true }) _modal: ModalComponent
+    constructor(_route, _router, _modal) {
+        this._route = _route;
+        this._router = _router;
+        this._modal = _modal;
+    }
+    ngOnInit() {
+        this._route.data
+            .pipe(takeUntil(this._ngUnsubscribe))
+            .subscribe(data => {
+            // console.log('data', data)
+            if (data.routeComponent) {
+                // console.log(this._route.snapshot)
+                const modalRef = this._modal.openFromComponent(data.routeComponent, {
+                    modalSize: 'lg',
+                    data
+                });
+                modalRef.afterClosed().subscribe(() => {
+                    const parent = this.getOutletParent();
+                    this._router.navigate([{ outlets: { modal: null, primary: ['.'] } }], 
+                    // { relativeTo: this._route.parent }
+                    { relativeTo: parent });
+                });
+            }
+        });
+    }
+    ngOnDestroy() {
+        this._ngUnsubscribe.next(undefined);
+        this._ngUnsubscribe.complete();
+    }
+    getOutletParent() {
+        let route = this._route;
+        while (route && route.outlet !== 'modal') {
+            route = route.parent;
+        }
+        return route ? route.parent : route;
+    }
+    _onDetached() {
+        if (this.isRouteModal()) {
+            this._router.navigate([{ outlets: { modal: null, primary: ['.'] } }], { relativeTo: this._route.parent });
+        }
+    }
+    isRouteModal() {
+        return this._route.outlet === 'modal';
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: RouteModalComponent, deps: [{ token: i1$2.ActivatedRoute }, { token: i1$2.Router }, { token: Modal }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.0", type: RouteModalComponent, isStandalone: false, selector: "seam-route-modal", ngImport: i0, template: "<!-- <seam-modal (overlayDetached)=\"_onDetached()\">\n  <router-outlet></router-outlet>\n</seam-modal> -->\n", styles: [""] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: RouteModalComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'seam-route-modal', standalone: false, template: "<!-- <seam-modal (overlayDetached)=\"_onDetached()\">\n  <router-outlet></router-outlet>\n</seam-modal> -->\n" }]
+        }], ctorParameters: () => [{ type: i1$2.ActivatedRoute }, { type: i1$2.Router }, { type: Modal }] });
+
+class TheSeamModalModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: TheSeamModalModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.0", ngImport: i0, type: TheSeamModalModule, declarations: [ModalComponent,
+            ModalFooterTplDirective,
+            ModalHeaderIconTplDirective,
+            ModalHeaderTitleTplDirective,
+            RouteModalComponent,
+            ModalDirective,
+            ModalContainerComponent,
+            ModalHeaderComponent,
+            ModalTitleDirective,
+            ModalBodyComponent,
+            ModalFooterComponent,
+            ModalCloseDirective], imports: [CommonModule,
+            OverlayModule,
+            FontAwesomeModule,
+            RouterModule,
+            ReactiveFormsModule,
+            PortalModule,
+            A11yModule], exports: [ModalComponent,
+            ModalFooterTplDirective,
+            ModalHeaderIconTplDirective,
+            ModalHeaderTitleTplDirective,
+            RouteModalComponent,
+            ModalDirective,
+            // Re-export the PortalModule so that people extending the `CdkDialogContainer`
+            // don't have to remember to import it or be faced with an unhelpful error.
+            PortalModule,
+            ModalHeaderComponent,
+            ModalTitleDirective,
+            ModalBodyComponent,
+            ModalFooterComponent,
+            ModalCloseDirective] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: TheSeamModalModule, providers: [
+            THESEAM_MODAL_SCROLL_STRATEGY_PROVIDER,
+            { provide: MODAL_CONTAINER, useValue: ModalContainerComponent },
+            { provide: MODAL_CONFIG, useValue: ModalConfig },
+        ], imports: [CommonModule,
+            OverlayModule,
+            FontAwesomeModule,
+            RouterModule,
+            ReactiveFormsModule,
+            PortalModule,
+            A11yModule, 
+            // Re-export the PortalModule so that people extending the `CdkDialogContainer`
+            // don't have to remember to import it or be faced with an unhelpful error.
+            PortalModule] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: TheSeamModalModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [
+                        ModalComponent,
+                        ModalFooterTplDirective,
+                        ModalHeaderIconTplDirective,
+                        ModalHeaderTitleTplDirective,
+                        RouteModalComponent,
+                        ModalDirective,
+                        ModalContainerComponent,
+                        ModalHeaderComponent,
+                        ModalTitleDirective,
+                        ModalBodyComponent,
+                        ModalFooterComponent,
+                        ModalCloseDirective
+                    ],
+                    imports: [
+                        CommonModule,
+                        OverlayModule,
+                        FontAwesomeModule,
+                        RouterModule,
+                        ReactiveFormsModule,
+                        PortalModule,
+                        A11yModule,
+                    ],
+                    exports: [
+                        ModalComponent,
+                        ModalFooterTplDirective,
+                        ModalHeaderIconTplDirective,
+                        ModalHeaderTitleTplDirective,
+                        RouteModalComponent,
+                        ModalDirective,
+                        // Re-export the PortalModule so that people extending the `CdkDialogContainer`
+                        // don't have to remember to import it or be faced with an unhelpful error.
+                        PortalModule,
+                        ModalHeaderComponent,
+                        ModalTitleDirective,
+                        ModalBodyComponent,
+                        ModalFooterComponent,
+                        ModalCloseDirective
+                    ],
+                    providers: [
+                        THESEAM_MODAL_SCROLL_STRATEGY_PROVIDER,
+                        { provide: MODAL_CONTAINER, useValue: ModalContainerComponent },
+                        { provide: MODAL_CONFIG, useValue: ModalConfig },
+                    ]
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { LIB_MODAL, LIB_MODAL_CONFIG, MODAL_CONFIG, MODAL_CONTAINER, MODAL_DATA, MODAL_SCROLL_STRATEGY, Modal, ModalBodyComponent, ModalCloseDirective, ModalComponent, ModalConfig, ModalContainerComponent, ModalDirective, ModalFooterComponent, ModalFooterTplDirective, ModalHeaderComponent, ModalHeaderIconTplDirective, ModalHeaderTitleTplDirective, ModalRef, ModalTitleDirective, RouteModalComponent, THESEAM_MODAL_CONTAINER, THESEAM_MODAL_SCROLL_STRATEGY_PROVIDER, THESEAM_MODAL_SCROLL_STRATEGY_PROVIDER_FACTORY, TheSeamModalModule, getClosestModal, mergeModalConfigs, throwDialogContentAlreadyAttachedError };
+//# sourceMappingURL=theseam-ui-common-modal.mjs.map