| /** |
| * @license |
| * Copyright Google LLC All Rights Reserved. |
| * |
| * Use of this source code is governed by an MIT-style license that can be |
| * found in the LICENSE file at https://angular.io/license |
| */ |
| import { ComponentFactoryResolver, Directive, EventEmitter, NgModule, Output, TemplateRef, ViewContainerRef } from '@angular/core'; |
| |
| /** |
| * @fileoverview added by tsickle |
| * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc |
| */ |
| |
| /** |
| * Throws an exception when attempting to attach a null portal to a host. |
| * \@docs-private |
| * @return {?} |
| */ |
| function throwNullPortalError() { |
| throw Error('Must provide a portal to attach'); |
| } |
| /** |
| * Throws an exception when attempting to attach a portal to a host that is already attached. |
| * \@docs-private |
| * @return {?} |
| */ |
| function throwPortalAlreadyAttachedError() { |
| throw Error('Host already has a portal attached'); |
| } |
| /** |
| * Throws an exception when attempting to attach a portal to an already-disposed host. |
| * \@docs-private |
| * @return {?} |
| */ |
| function throwPortalOutletAlreadyDisposedError() { |
| throw Error('This PortalOutlet has already been disposed'); |
| } |
| /** |
| * Throws an exception when attempting to attach an unknown portal type. |
| * \@docs-private |
| * @return {?} |
| */ |
| function throwUnknownPortalTypeError() { |
| throw Error('Attempting to attach an unknown Portal type. BasePortalOutlet accepts either ' + |
| 'a ComponentPortal or a TemplatePortal.'); |
| } |
| /** |
| * Throws an exception when attempting to attach a portal to a null host. |
| * \@docs-private |
| * @return {?} |
| */ |
| function throwNullPortalOutletError() { |
| throw Error('Attempting to attach a portal to a null PortalOutlet'); |
| } |
| /** |
| * Throws an exception when attempting to detach a portal that is not attached. |
| * \@docs-private |
| * @return {?} |
| */ |
| function throwNoPortalAttachedError() { |
| throw Error('Attempting to detach a portal that is not attached to a host'); |
| } |
| |
| /** |
| * @fileoverview added by tsickle |
| * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc |
| */ |
| /** |
| * A `Portal` is something that you want to render somewhere else. |
| * It can be attach to / detached from a `PortalOutlet`. |
| * @abstract |
| * @template T |
| */ |
| class Portal { |
| /** |
| * Attach this portal to a host. |
| * @param {?} host |
| * @return {?} |
| */ |
| attach(host) { |
| if (host == null) { |
| throwNullPortalOutletError(); |
| } |
| if (host.hasAttached()) { |
| throwPortalAlreadyAttachedError(); |
| } |
| this._attachedHost = host; |
| return (/** @type {?} */ (host.attach(this))); |
| } |
| /** |
| * Detach this portal from its host |
| * @return {?} |
| */ |
| detach() { |
| /** @type {?} */ |
| let host = this._attachedHost; |
| if (host == null) { |
| throwNoPortalAttachedError(); |
| } |
| else { |
| this._attachedHost = null; |
| host.detach(); |
| } |
| } |
| /** |
| * Whether this portal is attached to a host. |
| * @return {?} |
| */ |
| get isAttached() { |
| return this._attachedHost != null; |
| } |
| /** |
| * Sets the PortalOutlet reference without performing `attach()`. This is used directly by |
| * the PortalOutlet when it is performing an `attach()` or `detach()`. |
| * @param {?} host |
| * @return {?} |
| */ |
| setAttachedHost(host) { |
| this._attachedHost = host; |
| } |
| } |
| /** |
| * A `ComponentPortal` is a portal that instantiates some Component upon attachment. |
| * @template T |
| */ |
| class ComponentPortal extends Portal { |
| /** |
| * @param {?} component |
| * @param {?=} viewContainerRef |
| * @param {?=} injector |
| * @param {?=} componentFactoryResolver |
| */ |
| constructor(component, viewContainerRef, injector, componentFactoryResolver) { |
| super(); |
| this.component = component; |
| this.viewContainerRef = viewContainerRef; |
| this.injector = injector; |
| this.componentFactoryResolver = componentFactoryResolver; |
| } |
| } |
| /** |
| * A `TemplatePortal` is a portal that represents some embedded template (TemplateRef). |
| * @template C |
| */ |
| class TemplatePortal extends Portal { |
| /** |
| * @param {?} template |
| * @param {?} viewContainerRef |
| * @param {?=} context |
| */ |
| constructor(template, viewContainerRef, context) { |
| super(); |
| this.templateRef = template; |
| this.viewContainerRef = viewContainerRef; |
| this.context = context; |
| } |
| /** |
| * @return {?} |
| */ |
| get origin() { |
| return this.templateRef.elementRef; |
| } |
| /** |
| * Attach the portal to the provided `PortalOutlet`. |
| * When a context is provided it will override the `context` property of the `TemplatePortal` |
| * instance. |
| * @param {?} host |
| * @param {?=} context |
| * @return {?} |
| */ |
| attach(host, context = this.context) { |
| this.context = context; |
| return super.attach(host); |
| } |
| /** |
| * @return {?} |
| */ |
| detach() { |
| this.context = undefined; |
| return super.detach(); |
| } |
| } |
| /** |
| * Partial implementation of PortalOutlet that handles attaching |
| * ComponentPortal and TemplatePortal. |
| * @abstract |
| */ |
| class BasePortalOutlet { |
| constructor() { |
| /** |
| * Whether this host has already been permanently disposed. |
| */ |
| this._isDisposed = false; |
| } |
| /** |
| * Whether this host has an attached portal. |
| * @return {?} |
| */ |
| hasAttached() { |
| return !!this._attachedPortal; |
| } |
| /** |
| * Attaches a portal. |
| * @param {?} portal |
| * @return {?} |
| */ |
| attach(portal) { |
| if (!portal) { |
| throwNullPortalError(); |
| } |
| if (this.hasAttached()) { |
| throwPortalAlreadyAttachedError(); |
| } |
| if (this._isDisposed) { |
| throwPortalOutletAlreadyDisposedError(); |
| } |
| if (portal instanceof ComponentPortal) { |
| this._attachedPortal = portal; |
| return this.attachComponentPortal(portal); |
| } |
| else if (portal instanceof TemplatePortal) { |
| this._attachedPortal = portal; |
| return this.attachTemplatePortal(portal); |
| } |
| throwUnknownPortalTypeError(); |
| } |
| /** |
| * Detaches a previously attached portal. |
| * @return {?} |
| */ |
| detach() { |
| if (this._attachedPortal) { |
| this._attachedPortal.setAttachedHost(null); |
| this._attachedPortal = null; |
| } |
| this._invokeDisposeFn(); |
| } |
| /** |
| * Permanently dispose of this portal host. |
| * @return {?} |
| */ |
| dispose() { |
| if (this.hasAttached()) { |
| this.detach(); |
| } |
| this._invokeDisposeFn(); |
| this._isDisposed = true; |
| } |
| /** |
| * \@docs-private |
| * @param {?} fn |
| * @return {?} |
| */ |
| setDisposeFn(fn) { |
| this._disposeFn = fn; |
| } |
| /** |
| * @private |
| * @return {?} |
| */ |
| _invokeDisposeFn() { |
| if (this._disposeFn) { |
| this._disposeFn(); |
| this._disposeFn = null; |
| } |
| } |
| } |
| |
| /** |
| * @fileoverview added by tsickle |
| * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc |
| */ |
| /** |
| * A PortalOutlet for attaching portals to an arbitrary DOM element outside of the Angular |
| * application context. |
| */ |
| class DomPortalOutlet extends BasePortalOutlet { |
| /** |
| * @param {?} outletElement |
| * @param {?} _componentFactoryResolver |
| * @param {?} _appRef |
| * @param {?} _defaultInjector |
| */ |
| constructor(outletElement, _componentFactoryResolver, _appRef, _defaultInjector) { |
| super(); |
| this.outletElement = outletElement; |
| this._componentFactoryResolver = _componentFactoryResolver; |
| this._appRef = _appRef; |
| this._defaultInjector = _defaultInjector; |
| } |
| /** |
| * Attach the given ComponentPortal to DOM element using the ComponentFactoryResolver. |
| * @template T |
| * @param {?} portal Portal to be attached |
| * @return {?} Reference to the created component. |
| */ |
| attachComponentPortal(portal) { |
| /** @type {?} */ |
| const resolver = portal.componentFactoryResolver || this._componentFactoryResolver; |
| /** @type {?} */ |
| const componentFactory = resolver.resolveComponentFactory(portal.component); |
| /** @type {?} */ |
| let componentRef; |
| // If the portal specifies a ViewContainerRef, we will use that as the attachment point |
| // for the component (in terms of Angular's component tree, not rendering). |
| // When the ViewContainerRef is missing, we use the factory to create the component directly |
| // and then manually attach the view to the application. |
| if (portal.viewContainerRef) { |
| componentRef = portal.viewContainerRef.createComponent(componentFactory, portal.viewContainerRef.length, portal.injector || portal.viewContainerRef.injector); |
| this.setDisposeFn((/** |
| * @return {?} |
| */ |
| () => componentRef.destroy())); |
| } |
| else { |
| componentRef = componentFactory.create(portal.injector || this._defaultInjector); |
| this._appRef.attachView(componentRef.hostView); |
| this.setDisposeFn((/** |
| * @return {?} |
| */ |
| () => { |
| this._appRef.detachView(componentRef.hostView); |
| componentRef.destroy(); |
| })); |
| } |
| // At this point the component has been instantiated, so we move it to the location in the DOM |
| // where we want it to be rendered. |
| this.outletElement.appendChild(this._getComponentRootNode(componentRef)); |
| return componentRef; |
| } |
| /** |
| * Attaches a template portal to the DOM as an embedded view. |
| * @template C |
| * @param {?} portal Portal to be attached. |
| * @return {?} Reference to the created embedded view. |
| */ |
| attachTemplatePortal(portal) { |
| /** @type {?} */ |
| let viewContainer = portal.viewContainerRef; |
| /** @type {?} */ |
| let viewRef = viewContainer.createEmbeddedView(portal.templateRef, portal.context); |
| viewRef.detectChanges(); |
| // The method `createEmbeddedView` will add the view as a child of the viewContainer. |
| // But for the DomPortalOutlet the view can be added everywhere in the DOM |
| // (e.g Overlay Container) To move the view to the specified host element. We just |
| // re-append the existing root nodes. |
| viewRef.rootNodes.forEach((/** |
| * @param {?} rootNode |
| * @return {?} |
| */ |
| rootNode => this.outletElement.appendChild(rootNode))); |
| this.setDisposeFn(((/** |
| * @return {?} |
| */ |
| () => { |
| /** @type {?} */ |
| let index = viewContainer.indexOf(viewRef); |
| if (index !== -1) { |
| viewContainer.remove(index); |
| } |
| }))); |
| // TODO(jelbourn): Return locals from view. |
| return viewRef; |
| } |
| /** |
| * Clears out a portal from the DOM. |
| * @return {?} |
| */ |
| dispose() { |
| super.dispose(); |
| if (this.outletElement.parentNode != null) { |
| this.outletElement.parentNode.removeChild(this.outletElement); |
| } |
| } |
| /** |
| * Gets the root HTMLElement for an instantiated component. |
| * @private |
| * @param {?} componentRef |
| * @return {?} |
| */ |
| _getComponentRootNode(componentRef) { |
| return (/** @type {?} */ (((/** @type {?} */ (componentRef.hostView))).rootNodes[0])); |
| } |
| } |
| |
| /** |
| * @fileoverview added by tsickle |
| * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc |
| */ |
| /** |
| * Directive version of a `TemplatePortal`. Because the directive *is* a TemplatePortal, |
| * the directive instance itself can be attached to a host, enabling declarative use of portals. |
| */ |
| class CdkPortal extends TemplatePortal { |
| /** |
| * @param {?} templateRef |
| * @param {?} viewContainerRef |
| */ |
| constructor(templateRef, viewContainerRef) { |
| super(templateRef, viewContainerRef); |
| } |
| } |
| CdkPortal.decorators = [ |
| { type: Directive, args: [{ |
| selector: '[cdk-portal], [cdkPortal], [portal]', |
| exportAs: 'cdkPortal', |
| },] }, |
| ]; |
| /** @nocollapse */ |
| CdkPortal.ctorParameters = () => [ |
| { type: TemplateRef }, |
| { type: ViewContainerRef } |
| ]; |
| /** |
| * Directive version of a PortalOutlet. Because the directive *is* a PortalOutlet, portals can be |
| * directly attached to it, enabling declarative use. |
| * |
| * Usage: |
| * `<ng-template [cdkPortalOutlet]="greeting"></ng-template>` |
| */ |
| class CdkPortalOutlet extends BasePortalOutlet { |
| /** |
| * @param {?} _componentFactoryResolver |
| * @param {?} _viewContainerRef |
| */ |
| constructor(_componentFactoryResolver, _viewContainerRef) { |
| super(); |
| this._componentFactoryResolver = _componentFactoryResolver; |
| this._viewContainerRef = _viewContainerRef; |
| /** |
| * Whether the portal component is initialized. |
| */ |
| this._isInitialized = false; |
| /** |
| * Emits when a portal is attached to the outlet. |
| */ |
| this.attached = new EventEmitter(); |
| } |
| /** |
| * Portal associated with the Portal outlet. |
| * @return {?} |
| */ |
| get portal() { |
| return this._attachedPortal; |
| } |
| /** |
| * @param {?} portal |
| * @return {?} |
| */ |
| set portal(portal) { |
| // Ignore the cases where the `portal` is set to a falsy value before the lifecycle hooks have |
| // run. This handles the cases where the user might do something like `<div cdkPortalOutlet>` |
| // and attach a portal programmatically in the parent component. When Angular does the first CD |
| // round, it will fire the setter with empty string, causing the user's content to be cleared. |
| if (this.hasAttached() && !portal && !this._isInitialized) { |
| return; |
| } |
| if (this.hasAttached()) { |
| super.detach(); |
| } |
| if (portal) { |
| super.attach(portal); |
| } |
| this._attachedPortal = portal; |
| } |
| /** |
| * Component or view reference that is attached to the portal. |
| * @return {?} |
| */ |
| get attachedRef() { |
| return this._attachedRef; |
| } |
| /** |
| * @return {?} |
| */ |
| ngOnInit() { |
| this._isInitialized = true; |
| } |
| /** |
| * @return {?} |
| */ |
| ngOnDestroy() { |
| super.dispose(); |
| this._attachedPortal = null; |
| this._attachedRef = null; |
| } |
| /** |
| * Attach the given ComponentPortal to this PortalOutlet using the ComponentFactoryResolver. |
| * |
| * @template T |
| * @param {?} portal Portal to be attached to the portal outlet. |
| * @return {?} Reference to the created component. |
| */ |
| attachComponentPortal(portal) { |
| portal.setAttachedHost(this); |
| // If the portal specifies an origin, use that as the logical location of the component |
| // in the application tree. Otherwise use the location of this PortalOutlet. |
| /** @type {?} */ |
| const viewContainerRef = portal.viewContainerRef != null ? |
| portal.viewContainerRef : |
| this._viewContainerRef; |
| /** @type {?} */ |
| const resolver = portal.componentFactoryResolver || this._componentFactoryResolver; |
| /** @type {?} */ |
| const componentFactory = resolver.resolveComponentFactory(portal.component); |
| /** @type {?} */ |
| const ref = viewContainerRef.createComponent(componentFactory, viewContainerRef.length, portal.injector || viewContainerRef.injector); |
| super.setDisposeFn((/** |
| * @return {?} |
| */ |
| () => ref.destroy())); |
| this._attachedPortal = portal; |
| this._attachedRef = ref; |
| this.attached.emit(ref); |
| return ref; |
| } |
| /** |
| * Attach the given TemplatePortal to this PortlHost as an embedded View. |
| * @template C |
| * @param {?} portal Portal to be attached. |
| * @return {?} Reference to the created embedded view. |
| */ |
| attachTemplatePortal(portal) { |
| portal.setAttachedHost(this); |
| /** @type {?} */ |
| const viewRef = this._viewContainerRef.createEmbeddedView(portal.templateRef, portal.context); |
| super.setDisposeFn((/** |
| * @return {?} |
| */ |
| () => this._viewContainerRef.clear())); |
| this._attachedPortal = portal; |
| this._attachedRef = viewRef; |
| this.attached.emit(viewRef); |
| return viewRef; |
| } |
| } |
| CdkPortalOutlet.decorators = [ |
| { type: Directive, args: [{ |
| selector: '[cdkPortalOutlet], [cdkPortalHost], [portalHost]', |
| exportAs: 'cdkPortalOutlet, cdkPortalHost', |
| inputs: ['portal: cdkPortalOutlet'] |
| },] }, |
| ]; |
| /** @nocollapse */ |
| CdkPortalOutlet.ctorParameters = () => [ |
| { type: ComponentFactoryResolver }, |
| { type: ViewContainerRef } |
| ]; |
| CdkPortalOutlet.propDecorators = { |
| attached: [{ type: Output }] |
| }; |
| class PortalModule { |
| } |
| PortalModule.decorators = [ |
| { type: NgModule, args: [{ |
| exports: [CdkPortal, CdkPortalOutlet], |
| declarations: [CdkPortal, CdkPortalOutlet], |
| },] }, |
| ]; |
| |
| /** |
| * @fileoverview added by tsickle |
| * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc |
| */ |
| |
| /** |
| * Custom injector to be used when providing custom |
| * injection tokens to components inside a portal. |
| * \@docs-private |
| */ |
| class PortalInjector { |
| /** |
| * @param {?} _parentInjector |
| * @param {?} _customTokens |
| */ |
| constructor(_parentInjector, _customTokens) { |
| this._parentInjector = _parentInjector; |
| this._customTokens = _customTokens; |
| } |
| /** |
| * @param {?} token |
| * @param {?=} notFoundValue |
| * @return {?} |
| */ |
| get(token, notFoundValue) { |
| /** @type {?} */ |
| const value = this._customTokens.get(token); |
| if (typeof value !== 'undefined') { |
| return value; |
| } |
| return this._parentInjector.get(token, notFoundValue); |
| } |
| } |
| |
| /** |
| * @fileoverview added by tsickle |
| * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc |
| */ |
| |
| /** |
| * @fileoverview added by tsickle |
| * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc |
| */ |
| |
| export { DomPortalOutlet as DomPortalHost, CdkPortalOutlet as PortalHostDirective, CdkPortal as TemplatePortalDirective, BasePortalOutlet as BasePortalHost, Portal, ComponentPortal, TemplatePortal, BasePortalOutlet, DomPortalOutlet, CdkPortal, CdkPortalOutlet, PortalModule, PortalInjector }; |
| //# sourceMappingURL=portal.js.map |
