import { ESCAPE, hasModifierKey } from "./chunk-UMSNQQWJ.js"; import { BidiModule, Directionality, Platform, _getEventTarget, _isTestEnvironment, getRtlScrollAxisType, supportsScrollBehavior } from "./chunk-UPQZZZIG.js"; import { coerceArray, coerceCssPixelValue, coerceElement, coerceNumberProperty } from "./chunk-7XTJNSRU.js"; import { animate, query, stagger, state, style, transition, trigger } from "./chunk-BNCUYWOH.js"; import { DOCUMENT, Location } from "./chunk-OSQBUYO6.js"; import { ANIMATION_MODULE_TYPE, ApplicationRef, ChangeDetectionStrategy, ChangeDetectorRef, Component, ComponentFactoryResolver$1, ConnectableObservable, Directive, ElementRef, EventEmitter, Inject, Injectable, InjectionToken, Injector, Input, IterableDiffers, NgModule, NgZone, Observable, Optional, Output, SkipSelf, Subject, Subscription, TemplateRef, ViewChild, ViewContainerRef, ViewEncapsulation$1, animationFrameScheduler, asapScheduler, auditTime, booleanAttribute, distinctUntilChanged, filter, forwardRef, fromEvent, inject, isObservable, merge, of, pairwise, setClassMetadata, shareReplay, startWith, switchMap, take, takeUntil, takeWhile, ɵɵInheritDefinitionFeature, ɵɵInputTransformsFeature, ɵɵNgOnChangesFeature, ɵɵProvidersFeature, ɵɵStandaloneFeature, ɵɵadvance, ɵɵclassProp, ɵɵdefineComponent, ɵɵdefineDirective, ɵɵdefineInjectable, ɵɵdefineInjector, ɵɵdefineNgModule, ɵɵdirectiveInject, ɵɵelement, ɵɵelementEnd, ɵɵelementStart, ɵɵgetInheritedFactory, ɵɵinject, ɵɵloadQuery, ɵɵprojection, ɵɵprojectionDef, ɵɵqueryRefresh, ɵɵstyleProp, ɵɵviewQuery } from "./chunk-FGESKT7O.js"; import { __spreadProps, __spreadValues } from "./chunk-HSNDBVJ3.js"; // node_modules/@angular/cdk/fesm2022/portal.mjs function throwNullPortalError() { throw Error("Must provide a portal to attach"); } function throwPortalAlreadyAttachedError() { throw Error("Host already has a portal attached"); } function throwPortalOutletAlreadyDisposedError() { throw Error("This PortalOutlet has already been disposed"); } function throwUnknownPortalTypeError() { throw Error("Attempting to attach an unknown Portal type. BasePortalOutlet accepts either a ComponentPortal or a TemplatePortal."); } function throwNullPortalOutletError() { throw Error("Attempting to attach a portal to a null PortalOutlet"); } function throwNoPortalAttachedError() { throw Error("Attempting to detach a portal that is not attached to a host"); } var Portal = class { /** Attach this portal to a host. */ attach(host) { if (typeof ngDevMode === "undefined" || ngDevMode) { if (host == null) { throwNullPortalOutletError(); } if (host.hasAttached()) { throwPortalAlreadyAttachedError(); } } this._attachedHost = host; return host.attach(this); } /** Detach this portal from its host */ detach() { let host = this._attachedHost; if (host != null) { this._attachedHost = null; host.detach(); } else if (typeof ngDevMode === "undefined" || ngDevMode) { throwNoPortalAttachedError(); } } /** Whether this portal is attached to a host. */ 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()`. */ setAttachedHost(host) { this._attachedHost = host; } }; var ComponentPortal = class extends Portal { constructor(component, viewContainerRef, injector, componentFactoryResolver, projectableNodes) { super(); this.component = component; this.viewContainerRef = viewContainerRef; this.injector = injector; this.componentFactoryResolver = componentFactoryResolver; this.projectableNodes = projectableNodes; } }; var TemplatePortal = class extends Portal { constructor(templateRef, viewContainerRef, context, injector) { super(); this.templateRef = templateRef; this.viewContainerRef = viewContainerRef; this.context = context; this.injector = injector; } 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. */ attach(host, context = this.context) { this.context = context; return super.attach(host); } detach() { this.context = void 0; return super.detach(); } }; var DomPortal = class extends Portal { constructor(element) { super(); this.element = element instanceof ElementRef ? element.nativeElement : element; } }; var BasePortalOutlet = class { constructor() { this._isDisposed = false; this.attachDomPortal = null; } /** Whether this host has an attached portal. */ hasAttached() { return !!this._attachedPortal; } /** Attaches a portal. */ attach(portal) { if (typeof ngDevMode === "undefined" || ngDevMode) { 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); } else if (this.attachDomPortal && portal instanceof DomPortal) { this._attachedPortal = portal; return this.attachDomPortal(portal); } if (typeof ngDevMode === "undefined" || ngDevMode) { throwUnknownPortalTypeError(); } } /** Detaches a previously attached portal. */ detach() { if (this._attachedPortal) { this._attachedPortal.setAttachedHost(null); this._attachedPortal = null; } this._invokeDisposeFn(); } /** Permanently dispose of this portal host. */ dispose() { if (this.hasAttached()) { this.detach(); } this._invokeDisposeFn(); this._isDisposed = true; } /** @docs-private */ setDisposeFn(fn) { this._disposeFn = fn; } _invokeDisposeFn() { if (this._disposeFn) { this._disposeFn(); this._disposeFn = null; } } }; var DomPortalOutlet = class extends BasePortalOutlet { /** * @param outletElement Element into which the content is projected. * @param _componentFactoryResolver Used to resolve the component factory. * Only required when attaching component portals. * @param _appRef Reference to the application. Only used in component portals when there * is no `ViewContainerRef` available. * @param _defaultInjector Injector to use as a fallback when the portal being attached doesn't * have one. Only used for component portals. * @param _document Reference to the document. Used when attaching a DOM portal. Will eventually * become a required parameter. */ constructor(outletElement, _componentFactoryResolver, _appRef, _defaultInjector, _document) { super(); this.outletElement = outletElement; this._componentFactoryResolver = _componentFactoryResolver; this._appRef = _appRef; this._defaultInjector = _defaultInjector; this.attachDomPortal = (portal) => { if (!this._document && (typeof ngDevMode === "undefined" || ngDevMode)) { throw Error("Cannot attach DOM portal without _document constructor parameter"); } const element = portal.element; if (!element.parentNode && (typeof ngDevMode === "undefined" || ngDevMode)) { throw Error("DOM portal content must be attached to a parent node."); } const anchorNode = this._document.createComment("dom-portal"); element.parentNode.insertBefore(anchorNode, element); this.outletElement.appendChild(element); this._attachedPortal = portal; super.setDisposeFn(() => { if (anchorNode.parentNode) { anchorNode.parentNode.replaceChild(element, anchorNode); } }); }; this._document = _document; } /** * Attach the given ComponentPortal to DOM element using the ComponentFactoryResolver. * @param portal Portal to be attached * @returns Reference to the created component. */ attachComponentPortal(portal) { const resolver = portal.componentFactoryResolver || this._componentFactoryResolver; if ((typeof ngDevMode === "undefined" || ngDevMode) && !resolver) { throw Error("Cannot attach component portal to outlet without a ComponentFactoryResolver."); } const componentFactory = resolver.resolveComponentFactory(portal.component); let componentRef; if (portal.viewContainerRef) { componentRef = portal.viewContainerRef.createComponent(componentFactory, portal.viewContainerRef.length, portal.injector || portal.viewContainerRef.injector, portal.projectableNodes || void 0); this.setDisposeFn(() => componentRef.destroy()); } else { if ((typeof ngDevMode === "undefined" || ngDevMode) && !this._appRef) { throw Error("Cannot attach component portal to outlet without an ApplicationRef."); } componentRef = componentFactory.create(portal.injector || this._defaultInjector || Injector.NULL); this._appRef.attachView(componentRef.hostView); this.setDisposeFn(() => { if (this._appRef.viewCount > 0) { this._appRef.detachView(componentRef.hostView); } componentRef.destroy(); }); } this.outletElement.appendChild(this._getComponentRootNode(componentRef)); this._attachedPortal = portal; return componentRef; } /** * Attaches a template portal to the DOM as an embedded view. * @param portal Portal to be attached. * @returns Reference to the created embedded view. */ attachTemplatePortal(portal) { let viewContainer = portal.viewContainerRef; let viewRef = viewContainer.createEmbeddedView(portal.templateRef, portal.context, { injector: portal.injector }); viewRef.rootNodes.forEach((rootNode) => this.outletElement.appendChild(rootNode)); viewRef.detectChanges(); this.setDisposeFn(() => { let index = viewContainer.indexOf(viewRef); if (index !== -1) { viewContainer.remove(index); } }); this._attachedPortal = portal; return viewRef; } /** * Clears out a portal from the DOM. */ dispose() { super.dispose(); this.outletElement.remove(); } /** Gets the root HTMLElement for an instantiated component. */ _getComponentRootNode(componentRef) { return componentRef.hostView.rootNodes[0]; } }; var _CdkPortal = class _CdkPortal extends TemplatePortal { constructor(templateRef, viewContainerRef) { super(templateRef, viewContainerRef); } }; _CdkPortal.ɵfac = function CdkPortal_Factory(t) { return new (t || _CdkPortal)(ɵɵdirectiveInject(TemplateRef), ɵɵdirectiveInject(ViewContainerRef)); }; _CdkPortal.ɵdir = ɵɵdefineDirective({ type: _CdkPortal, selectors: [["", "cdkPortal", ""]], exportAs: ["cdkPortal"], features: [ɵɵInheritDefinitionFeature] }); var CdkPortal = _CdkPortal; (() => { (typeof ngDevMode === "undefined" || ngDevMode) && setClassMetadata(CdkPortal, [{ type: Directive, args: [{ selector: "[cdkPortal]", exportAs: "cdkPortal" }] }], () => [{ type: TemplateRef }, { type: ViewContainerRef }], null); })(); var _TemplatePortalDirective = class _TemplatePortalDirective extends CdkPortal { }; _TemplatePortalDirective.ɵfac = (() => { let ɵTemplatePortalDirective_BaseFactory; return function TemplatePortalDirective_Factory(t) { return (ɵTemplatePortalDirective_BaseFactory || (ɵTemplatePortalDirective_BaseFactory = ɵɵgetInheritedFactory(_TemplatePortalDirective)))(t || _TemplatePortalDirective); }; })(); _TemplatePortalDirective.ɵdir = ɵɵdefineDirective({ type: _TemplatePortalDirective, selectors: [["", "cdk-portal", ""], ["", "portal", ""]], exportAs: ["cdkPortal"], features: [ɵɵProvidersFeature([{ provide: CdkPortal, useExisting: _TemplatePortalDirective }]), ɵɵInheritDefinitionFeature] }); var TemplatePortalDirective = _TemplatePortalDirective; (() => { (typeof ngDevMode === "undefined" || ngDevMode) && setClassMetadata(TemplatePortalDirective, [{ type: Directive, args: [{ selector: "[cdk-portal], [portal]", exportAs: "cdkPortal", providers: [{ provide: CdkPortal, useExisting: TemplatePortalDirective }] }] }], null, null); })(); var _CdkPortalOutlet = class _CdkPortalOutlet extends BasePortalOutlet { constructor(_componentFactoryResolver, _viewContainerRef, _document) { super(); this._componentFactoryResolver = _componentFactoryResolver; this._viewContainerRef = _viewContainerRef; this._isInitialized = false; this.attached = new EventEmitter(); this.attachDomPortal = (portal) => { if (!this._document && (typeof ngDevMode === "undefined" || ngDevMode)) { throw Error("Cannot attach DOM portal without _document constructor parameter"); } const element = portal.element; if (!element.parentNode && (typeof ngDevMode === "undefined" || ngDevMode)) { throw Error("DOM portal content must be attached to a parent node."); } const anchorNode = this._document.createComment("dom-portal"); portal.setAttachedHost(this); element.parentNode.insertBefore(anchorNode, element); this._getRootNode().appendChild(element); this._attachedPortal = portal; super.setDisposeFn(() => { if (anchorNode.parentNode) { anchorNode.parentNode.replaceChild(element, anchorNode); } }); }; this._document = _document; } /** Portal associated with the Portal outlet. */ get portal() { return this._attachedPortal; } set portal(portal) { if (this.hasAttached() && !portal && !this._isInitialized) { return; } if (this.hasAttached()) { super.detach(); } if (portal) { super.attach(portal); } this._attachedPortal = portal || null; } /** Component or view reference that is attached to the portal. */ get attachedRef() { return this._attachedRef; } ngOnInit() { this._isInitialized = true; } ngOnDestroy() { super.dispose(); this._attachedRef = this._attachedPortal = null; } /** * Attach the given ComponentPortal to this PortalOutlet using the ComponentFactoryResolver. * * @param portal Portal to be attached to the portal outlet. * @returns Reference to the created component. */ attachComponentPortal(portal) { portal.setAttachedHost(this); const viewContainerRef = portal.viewContainerRef != null ? portal.viewContainerRef : this._viewContainerRef; const resolver = portal.componentFactoryResolver || this._componentFactoryResolver; const componentFactory = resolver.resolveComponentFactory(portal.component); const ref = viewContainerRef.createComponent(componentFactory, viewContainerRef.length, portal.injector || viewContainerRef.injector, portal.projectableNodes || void 0); if (viewContainerRef !== this._viewContainerRef) { this._getRootNode().appendChild(ref.hostView.rootNodes[0]); } super.setDisposeFn(() => ref.destroy()); this._attachedPortal = portal; this._attachedRef = ref; this.attached.emit(ref); return ref; } /** * Attach the given TemplatePortal to this PortalHost as an embedded View. * @param portal Portal to be attached. * @returns Reference to the created embedded view. */ attachTemplatePortal(portal) { portal.setAttachedHost(this); const viewRef = this._viewContainerRef.createEmbeddedView(portal.templateRef, portal.context, { injector: portal.injector }); super.setDisposeFn(() => this._viewContainerRef.clear()); this._attachedPortal = portal; this._attachedRef = viewRef; this.attached.emit(viewRef); return viewRef; } /** Gets the root node of the portal outlet. */ _getRootNode() { const nativeElement = this._viewContainerRef.element.nativeElement; return nativeElement.nodeType === nativeElement.ELEMENT_NODE ? nativeElement : nativeElement.parentNode; } }; _CdkPortalOutlet.ɵfac = function CdkPortalOutlet_Factory(t) { return new (t || _CdkPortalOutlet)(ɵɵdirectiveInject(ComponentFactoryResolver$1), ɵɵdirectiveInject(ViewContainerRef), ɵɵdirectiveInject(DOCUMENT)); }; _CdkPortalOutlet.ɵdir = ɵɵdefineDirective({ type: _CdkPortalOutlet, selectors: [["", "cdkPortalOutlet", ""]], inputs: { portal: ["cdkPortalOutlet", "portal"] }, outputs: { attached: "attached" }, exportAs: ["cdkPortalOutlet"], features: [ɵɵInheritDefinitionFeature] }); var CdkPortalOutlet = _CdkPortalOutlet; (() => { (typeof ngDevMode === "undefined" || ngDevMode) && setClassMetadata(CdkPortalOutlet, [{ type: Directive, args: [{ selector: "[cdkPortalOutlet]", exportAs: "cdkPortalOutlet", inputs: ["portal: cdkPortalOutlet"] }] }], () => [{ type: ComponentFactoryResolver$1 }, { type: ViewContainerRef }, { type: void 0, decorators: [{ type: Inject, args: [DOCUMENT] }] }], { attached: [{ type: Output }] }); })(); var _PortalHostDirective = class _PortalHostDirective extends CdkPortalOutlet { }; _PortalHostDirective.ɵfac = (() => { let ɵPortalHostDirective_BaseFactory; return function PortalHostDirective_Factory(t) { return (ɵPortalHostDirective_BaseFactory || (ɵPortalHostDirective_BaseFactory = ɵɵgetInheritedFactory(_PortalHostDirective)))(t || _PortalHostDirective); }; })(); _PortalHostDirective.ɵdir = ɵɵdefineDirective({ type: _PortalHostDirective, selectors: [["", "cdkPortalHost", ""], ["", "portalHost", ""]], inputs: { portal: ["cdkPortalHost", "portal"] }, exportAs: ["cdkPortalHost"], features: [ɵɵProvidersFeature([{ provide: CdkPortalOutlet, useExisting: _PortalHostDirective }]), ɵɵInheritDefinitionFeature] }); var PortalHostDirective = _PortalHostDirective; (() => { (typeof ngDevMode === "undefined" || ngDevMode) && setClassMetadata(PortalHostDirective, [{ type: Directive, args: [{ selector: "[cdkPortalHost], [portalHost]", exportAs: "cdkPortalHost", inputs: ["portal: cdkPortalHost"], providers: [{ provide: CdkPortalOutlet, useExisting: PortalHostDirective }] }] }], null, null); })(); var _PortalModule = class _PortalModule { }; _PortalModule.ɵfac = function PortalModule_Factory(t) { return new (t || _PortalModule)(); }; _PortalModule.ɵmod = ɵɵdefineNgModule({ type: _PortalModule, declarations: [CdkPortal, CdkPortalOutlet, TemplatePortalDirective, PortalHostDirective], exports: [CdkPortal, CdkPortalOutlet, TemplatePortalDirective, PortalHostDirective] }); _PortalModule.ɵinj = ɵɵdefineInjector({}); var PortalModule = _PortalModule; (() => { (typeof ngDevMode === "undefined" || ngDevMode) && setClassMetadata(PortalModule, [{ type: NgModule, args: [{ exports: [CdkPortal, CdkPortalOutlet, TemplatePortalDirective, PortalHostDirective], declarations: [CdkPortal, CdkPortalOutlet, TemplatePortalDirective, PortalHostDirective] }] }], null, null); })(); // node_modules/ng-zorro-antd/fesm2022/ng-zorro-antd-core-animation.mjs var _AnimationDuration = class _AnimationDuration { // Tooltip }; _AnimationDuration.SLOW = "0.3s"; _AnimationDuration.BASE = "0.2s"; _AnimationDuration.FAST = "0.1s"; var AnimationDuration = _AnimationDuration; var _AnimationCurves = class _AnimationCurves { }; _AnimationCurves.EASE_BASE_OUT = "cubic-bezier(0.7, 0.3, 0.1, 1)"; _AnimationCurves.EASE_BASE_IN = "cubic-bezier(0.9, 0, 0.3, 0.7)"; _AnimationCurves.EASE_OUT = "cubic-bezier(0.215, 0.61, 0.355, 1)"; _AnimationCurves.EASE_IN = "cubic-bezier(0.55, 0.055, 0.675, 0.19)"; _AnimationCurves.EASE_IN_OUT = "cubic-bezier(0.645, 0.045, 0.355, 1)"; _AnimationCurves.EASE_OUT_BACK = "cubic-bezier(0.12, 0.4, 0.29, 1.46)"; _AnimationCurves.EASE_IN_BACK = "cubic-bezier(0.71, -0.46, 0.88, 0.6)"; _AnimationCurves.EASE_IN_OUT_BACK = "cubic-bezier(0.71, -0.46, 0.29, 1.46)"; _AnimationCurves.EASE_OUT_CIRC = "cubic-bezier(0.08, 0.82, 0.17, 1)"; _AnimationCurves.EASE_IN_CIRC = "cubic-bezier(0.6, 0.04, 0.98, 0.34)"; _AnimationCurves.EASE_IN_OUT_CIRC = "cubic-bezier(0.78, 0.14, 0.15, 0.86)"; _AnimationCurves.EASE_OUT_QUINT = "cubic-bezier(0.23, 1, 0.32, 1)"; _AnimationCurves.EASE_IN_QUINT = "cubic-bezier(0.755, 0.05, 0.855, 0.06)"; _AnimationCurves.EASE_IN_OUT_QUINT = "cubic-bezier(0.86, 0, 0.07, 1)"; var AnimationCurves = _AnimationCurves; var collapseMotion = trigger("collapseMotion", [ state("expanded", style({ height: "*" })), state("collapsed", style({ height: 0, overflow: "hidden" })), state("hidden", style({ height: 0, overflow: "hidden", borderTopWidth: "0" })), transition("expanded => collapsed", animate(`150ms ${AnimationCurves.EASE_IN_OUT}`)), transition("expanded => hidden", animate(`150ms ${AnimationCurves.EASE_IN_OUT}`)), transition("collapsed => expanded", animate(`150ms ${AnimationCurves.EASE_IN_OUT}`)), transition("hidden => expanded", animate(`150ms ${AnimationCurves.EASE_IN_OUT}`)) ]); var treeCollapseMotion = trigger("treeCollapseMotion", [ transition("* => *", [ query("nz-tree-node:leave,nz-tree-builtin-node:leave", [ style({ overflow: "hidden" }), stagger(0, [ animate(`150ms ${AnimationCurves.EASE_IN_OUT}`, style({ height: 0, opacity: 0, "padding-bottom": 0 })) ]) ], { optional: true }), query("nz-tree-node:enter,nz-tree-builtin-node:enter", [ style({ overflow: "hidden", height: 0, opacity: 0, "padding-bottom": 0 }), stagger(0, [ animate(`150ms ${AnimationCurves.EASE_IN_OUT}`, style({ overflow: "hidden", height: "*", opacity: "*", "padding-bottom": "*" })) ]) ], { optional: true }) ]) ]); var fadeMotion = trigger("fadeMotion", [ transition(":enter", [style({ opacity: 0 }), animate(`${AnimationDuration.BASE}`, style({ opacity: 1 }))]), transition(":leave", [style({ opacity: 1 }), animate(`${AnimationDuration.BASE}`, style({ opacity: 0 }))]) ]); var helpMotion = trigger("helpMotion", [ transition(":enter", [ style({ opacity: 0, transform: "translateY(-5px)" }), animate(`${AnimationDuration.SLOW} ${AnimationCurves.EASE_IN_OUT}`, style({ opacity: 1, transform: "translateY(0)" })) ]), transition(":leave", [ style({ opacity: 1, transform: "translateY(0)" }), animate(`${AnimationDuration.SLOW} ${AnimationCurves.EASE_IN_OUT}`, style({ opacity: 0, transform: "translateY(-5px)" })) ]) ]); var moveUpMotion = trigger("moveUpMotion", [ transition("* => enter", [ style({ transformOrigin: "0 0", transform: "translateY(-100%)", opacity: 0 }), animate(`${AnimationDuration.BASE}`, style({ transformOrigin: "0 0", transform: "translateY(0%)", opacity: 1 })) ]), transition("* => leave", [ style({ transformOrigin: "0 0", transform: "translateY(0%)", opacity: 1 }), animate(`${AnimationDuration.BASE}`, style({ transformOrigin: "0 0", transform: "translateY(-100%)", opacity: 0 })) ]) ]); var notificationMotion = trigger("notificationMotion", [ state("enterRight", style({ opacity: 1, transform: "translateX(0)" })), transition("* => enterRight", [style({ opacity: 0, transform: "translateX(5%)" }), animate("100ms linear")]), state("enterLeft", style({ opacity: 1, transform: "translateX(0)" })), transition("* => enterLeft", [style({ opacity: 0, transform: "translateX(-5%)" }), animate("100ms linear")]), state("enterTop", style({ opacity: 1, transform: "translateY(0)" })), transition("* => enterTop", [style({ opacity: 0, transform: "translateY(-5%)" }), animate("100ms linear")]), state("enterBottom", style({ opacity: 1, transform: "translateY(0)" })), transition("* => enterBottom", [style({ opacity: 0, transform: "translateY(5%)" }), animate("100ms linear")]), state("leave", style({ opacity: 0, transform: "scaleY(0.8)", transformOrigin: "0% 0%" })), transition("* => leave", [ style({ opacity: 1, transform: "scaleY(1)", transformOrigin: "0% 0%" }), animate("100ms linear") ]) ]); var ANIMATION_TRANSITION_IN = `${AnimationDuration.BASE} ${AnimationCurves.EASE_OUT_QUINT}`; var ANIMATION_TRANSITION_OUT = `${AnimationDuration.BASE} ${AnimationCurves.EASE_IN_QUINT}`; var slideMotion = trigger("slideMotion", [ state("void", style({ opacity: 0, transform: "scaleY(0.8)" })), state("enter", style({ opacity: 1, transform: "scaleY(1)" })), transition("void => *", [animate(ANIMATION_TRANSITION_IN)]), transition("* => void", [animate(ANIMATION_TRANSITION_OUT)]) ]); var slideAlertMotion = trigger("slideAlertMotion", [ transition(":leave", [ style({ opacity: 1, transform: "scaleY(1)", transformOrigin: "0% 0%" }), animate(`${AnimationDuration.SLOW} ${AnimationCurves.EASE_IN_OUT_CIRC}`, style({ opacity: 0, transform: "scaleY(0)", transformOrigin: "0% 0%" })) ]) ]); var zoomBigMotion = trigger("zoomBigMotion", [ transition("void => active", [ style({ opacity: 0, transform: "scale(0.8)" }), animate(`${AnimationDuration.BASE} ${AnimationCurves.EASE_OUT_CIRC}`, style({ opacity: 1, transform: "scale(1)" })) ]), transition("active => void", [ style({ opacity: 1, transform: "scale(1)" }), animate(`${AnimationDuration.BASE} ${AnimationCurves.EASE_IN_OUT_CIRC}`, style({ opacity: 0, transform: "scale(0.8)" })) ]) ]); var zoomBadgeMotion = trigger("zoomBadgeMotion", [ transition(":enter", [ style({ opacity: 0, transform: "scale(0) translate(50%, -50%)" }), animate(`${AnimationDuration.SLOW} ${AnimationCurves.EASE_OUT_BACK}`, style({ opacity: 1, transform: "scale(1) translate(50%, -50%)" })) ]), transition(":leave", [ style({ opacity: 1, transform: "scale(1) translate(50%, -50%)" }), animate(`${AnimationDuration.SLOW} ${AnimationCurves.EASE_IN_BACK}`, style({ opacity: 0, transform: "scale(0) translate(50%, -50%)" })) ]) ]); var thumbMotion = trigger("thumbMotion", [ state("from", style({ transform: "translateX({{ transform }}px)", width: "{{ width }}px" }), { params: { transform: 0, width: 0 } }), state("to", style({ transform: "translateX({{ transform }}px)", width: "{{ width }}px" }), { params: { transform: 100, width: 0 } }), transition("from => to", animate(`300ms ${AnimationCurves.EASE_IN_OUT}`)) ]); // node_modules/@angular/cdk/fesm2022/collections.mjs var DataSource = class { }; function isDataSource(value) { return value && typeof value.connect === "function" && !(value instanceof ConnectableObservable); } var ArrayDataSource = class extends DataSource { constructor(_data) { super(); this._data = _data; } connect() { return isObservable(this._data) ? this._data : of(this._data); } disconnect() { } }; var _RecycleViewRepeaterStrategy = class { constructor() { this.viewCacheSize = 20; this._viewCache = []; } /** Apply changes to the DOM. */ applyChanges(changes, viewContainerRef, itemContextFactory, itemValueResolver, itemViewChanged) { changes.forEachOperation((record, adjustedPreviousIndex, currentIndex) => { let view; let operation; if (record.previousIndex == null) { const viewArgsFactory = () => itemContextFactory(record, adjustedPreviousIndex, currentIndex); view = this._insertView(viewArgsFactory, currentIndex, viewContainerRef, itemValueResolver(record)); operation = view ? 1 : 0; } else if (currentIndex == null) { this._detachAndCacheView(adjustedPreviousIndex, viewContainerRef); operation = 3; } else { view = this._moveView(adjustedPreviousIndex, currentIndex, viewContainerRef, itemValueResolver(record)); operation = 2; } if (itemViewChanged) { itemViewChanged({ context: view?.context, operation, record }); } }); } detach() { for (const view of this._viewCache) { view.destroy(); } this._viewCache = []; } /** * Inserts a view for a new item, either from the cache or by creating a new * one. Returns `undefined` if the item was inserted into a cached view. */ _insertView(viewArgsFactory, currentIndex, viewContainerRef, value) { const cachedView = this._insertViewFromCache(currentIndex, viewContainerRef); if (cachedView) { cachedView.context.$implicit = value; return void 0; } const viewArgs = viewArgsFactory(); return viewContainerRef.createEmbeddedView(viewArgs.templateRef, viewArgs.context, viewArgs.index); } /** Detaches the view at the given index and inserts into the view cache. */ _detachAndCacheView(index, viewContainerRef) { const detachedView = viewContainerRef.detach(index); this._maybeCacheView(detachedView, viewContainerRef); } /** Moves view at the previous index to the current index. */ _moveView(adjustedPreviousIndex, currentIndex, viewContainerRef, value) { const view = viewContainerRef.get(adjustedPreviousIndex); viewContainerRef.move(view, currentIndex); view.context.$implicit = value; return view; } /** * Cache the given detached view. If the cache is full, the view will be * destroyed. */ _maybeCacheView(view, viewContainerRef) { if (this._viewCache.length < this.viewCacheSize) { this._viewCache.push(view); } else { const index = viewContainerRef.indexOf(view); if (index === -1) { view.destroy(); } else { viewContainerRef.remove(index); } } } /** Inserts a recycled view from the cache at the given index. */ _insertViewFromCache(index, viewContainerRef) { const cachedView = this._viewCache.pop(); if (cachedView) { viewContainerRef.insert(cachedView, index); } return cachedView || null; } }; var _UniqueSelectionDispatcher = class _UniqueSelectionDispatcher { constructor() { this._listeners = []; } /** * Notify other items that selection for the given name has been set. * @param id ID of the item. * @param name Name of the item. */ notify(id, name) { for (let listener of this._listeners) { listener(id, name); } } /** * Listen for future changes to item selection. * @return Function used to deregister listener */ listen(listener) { this._listeners.push(listener); return () => { this._listeners = this._listeners.filter((registered) => { return listener !== registered; }); }; } ngOnDestroy() { this._listeners = []; } }; _UniqueSelectionDispatcher.ɵfac = function UniqueSelectionDispatcher_Factory(t) { return new (t || _UniqueSelectionDispatcher)(); }; _UniqueSelectionDispatcher.ɵprov = ɵɵdefineInjectable({ token: _UniqueSelectionDispatcher, factory: _UniqueSelectionDispatcher.ɵfac, providedIn: "root" }); var UniqueSelectionDispatcher = _UniqueSelectionDispatcher; (() => { (typeof ngDevMode === "undefined" || ngDevMode) && setClassMetadata(UniqueSelectionDispatcher, [{ type: Injectable, args: [{ providedIn: "root" }] }], null, null); })(); var _VIEW_REPEATER_STRATEGY = new InjectionToken("_ViewRepeater"); // node_modules/@angular/cdk/fesm2022/scrolling.mjs var _c0 = ["contentWrapper"]; var _c1 = ["*"]; var VIRTUAL_SCROLL_STRATEGY = new InjectionToken("VIRTUAL_SCROLL_STRATEGY"); var FixedSizeVirtualScrollStrategy = class { /** * @param itemSize The size of the items in the virtually scrolling list. * @param minBufferPx The minimum amount of buffer (in pixels) before needing to render more * @param maxBufferPx The amount of buffer (in pixels) to render when rendering more. */ constructor(itemSize, minBufferPx, maxBufferPx) { this._scrolledIndexChange = new Subject(); this.scrolledIndexChange = this._scrolledIndexChange.pipe(distinctUntilChanged()); this._viewport = null; this._itemSize = itemSize; this._minBufferPx = minBufferPx; this._maxBufferPx = maxBufferPx; } /** * Attaches this scroll strategy to a viewport. * @param viewport The viewport to attach this strategy to. */ attach(viewport) { this._viewport = viewport; this._updateTotalContentSize(); this._updateRenderedRange(); } /** Detaches this scroll strategy from the currently attached viewport. */ detach() { this._scrolledIndexChange.complete(); this._viewport = null; } /** * Update the item size and buffer size. * @param itemSize The size of the items in the virtually scrolling list. * @param minBufferPx The minimum amount of buffer (in pixels) before needing to render more * @param maxBufferPx The amount of buffer (in pixels) to render when rendering more. */ updateItemAndBufferSize(itemSize, minBufferPx, maxBufferPx) { if (maxBufferPx < minBufferPx && (typeof ngDevMode === "undefined" || ngDevMode)) { throw Error("CDK virtual scroll: maxBufferPx must be greater than or equal to minBufferPx"); } this._itemSize = itemSize; this._minBufferPx = minBufferPx; this._maxBufferPx = maxBufferPx; this._updateTotalContentSize(); this._updateRenderedRange(); } /** @docs-private Implemented as part of VirtualScrollStrategy. */ onContentScrolled() { this._updateRenderedRange(); } /** @docs-private Implemented as part of VirtualScrollStrategy. */ onDataLengthChanged() { this._updateTotalContentSize(); this._updateRenderedRange(); } /** @docs-private Implemented as part of VirtualScrollStrategy. */ onContentRendered() { } /** @docs-private Implemented as part of VirtualScrollStrategy. */ onRenderedOffsetChanged() { } /** * Scroll to the offset for the given index. * @param index The index of the element to scroll to. * @param behavior The ScrollBehavior to use when scrolling. */ scrollToIndex(index, behavior) { if (this._viewport) { this._viewport.scrollToOffset(index * this._itemSize, behavior); } } /** Update the viewport's total content size. */ _updateTotalContentSize() { if (!this._viewport) { return; } this._viewport.setTotalContentSize(this._viewport.getDataLength() * this._itemSize); } /** Update the viewport's rendered range. */ _updateRenderedRange() { if (!this._viewport) { return; } const renderedRange = this._viewport.getRenderedRange(); const newRange = { start: renderedRange.start, end: renderedRange.end }; const viewportSize = this._viewport.getViewportSize(); const dataLength = this._viewport.getDataLength(); let scrollOffset = this._viewport.measureScrollOffset(); let firstVisibleIndex = this._itemSize > 0 ? scrollOffset / this._itemSize : 0; if (newRange.end > dataLength) { const maxVisibleItems = Math.ceil(viewportSize / this._itemSize); const newVisibleIndex = Math.max(0, Math.min(firstVisibleIndex, dataLength - maxVisibleItems)); if (firstVisibleIndex != newVisibleIndex) { firstVisibleIndex = newVisibleIndex; scrollOffset = newVisibleIndex * this._itemSize; newRange.start = Math.floor(firstVisibleIndex); } newRange.end = Math.max(0, Math.min(dataLength, newRange.start + maxVisibleItems)); } const startBuffer = scrollOffset - newRange.start * this._itemSize; if (startBuffer < this._minBufferPx && newRange.start != 0) { const expandStart = Math.ceil((this._maxBufferPx - startBuffer) / this._itemSize); newRange.start = Math.max(0, newRange.start - expandStart); newRange.end = Math.min(dataLength, Math.ceil(firstVisibleIndex + (viewportSize + this._minBufferPx) / this._itemSize)); } else { const endBuffer = newRange.end * this._itemSize - (scrollOffset + viewportSize); if (endBuffer < this._minBufferPx && newRange.end != dataLength) { const expandEnd = Math.ceil((this._maxBufferPx - endBuffer) / this._itemSize); if (expandEnd > 0) { newRange.end = Math.min(dataLength, newRange.end + expandEnd); newRange.start = Math.max(0, Math.floor(firstVisibleIndex - this._minBufferPx / this._itemSize)); } } } this._viewport.setRenderedRange(newRange); this._viewport.setRenderedContentOffset(this._itemSize * newRange.start); this._scrolledIndexChange.next(Math.floor(firstVisibleIndex)); } }; function _fixedSizeVirtualScrollStrategyFactory(fixedSizeDir) { return fixedSizeDir._scrollStrategy; } var _CdkFixedSizeVirtualScroll = class _CdkFixedSizeVirtualScroll { constructor() { this._itemSize = 20; this._minBufferPx = 100; this._maxBufferPx = 200; this._scrollStrategy = new FixedSizeVirtualScrollStrategy(this.itemSize, this.minBufferPx, this.maxBufferPx); } /** The size of the items in the list (in pixels). */ get itemSize() { return this._itemSize; } set itemSize(value) { this._itemSize = coerceNumberProperty(value); } /** * The minimum amount of buffer rendered beyond the viewport (in pixels). * If the amount of buffer dips below this number, more items will be rendered. Defaults to 100px. */ get minBufferPx() { return this._minBufferPx; } set minBufferPx(value) { this._minBufferPx = coerceNumberProperty(value); } /** * The number of pixels worth of buffer to render for when rendering new items. Defaults to 200px. */ get maxBufferPx() { return this._maxBufferPx; } set maxBufferPx(value) { this._maxBufferPx = coerceNumberProperty(value); } ngOnChanges() { this._scrollStrategy.updateItemAndBufferSize(this.itemSize, this.minBufferPx, this.maxBufferPx); } }; _CdkFixedSizeVirtualScroll.ɵfac = function CdkFixedSizeVirtualScroll_Factory(t) { return new (t || _CdkFixedSizeVirtualScroll)(); }; _CdkFixedSizeVirtualScroll.ɵdir = ɵɵdefineDirective({ type: _CdkFixedSizeVirtualScroll, selectors: [["cdk-virtual-scroll-viewport", "itemSize", ""]], inputs: { itemSize: "itemSize", minBufferPx: "minBufferPx", maxBufferPx: "maxBufferPx" }, standalone: true, features: [ɵɵProvidersFeature([{ provide: VIRTUAL_SCROLL_STRATEGY, useFactory: _fixedSizeVirtualScrollStrategyFactory, deps: [forwardRef(() => _CdkFixedSizeVirtualScroll)] }]), ɵɵNgOnChangesFeature] }); var CdkFixedSizeVirtualScroll = _CdkFixedSizeVirtualScroll; (() => { (typeof ngDevMode === "undefined" || ngDevMode) && setClassMetadata(CdkFixedSizeVirtualScroll, [{ type: Directive, args: [{ selector: "cdk-virtual-scroll-viewport[itemSize]", standalone: true, providers: [{ provide: VIRTUAL_SCROLL_STRATEGY, useFactory: _fixedSizeVirtualScrollStrategyFactory, deps: [forwardRef(() => CdkFixedSizeVirtualScroll)] }] }] }], null, { itemSize: [{ type: Input }], minBufferPx: [{ type: Input }], maxBufferPx: [{ type: Input }] }); })(); var DEFAULT_SCROLL_TIME = 20; var _ScrollDispatcher = class _ScrollDispatcher { constructor(_ngZone, _platform, document2) { this._ngZone = _ngZone; this._platform = _platform; this._scrolled = new Subject(); this._globalSubscription = null; this._scrolledCount = 0; this.scrollContainers = /* @__PURE__ */ new Map(); this._document = document2; } /** * Registers a scrollable instance with the service and listens for its scrolled events. When the * scrollable is scrolled, the service emits the event to its scrolled observable. * @param scrollable Scrollable instance to be registered. */ register(scrollable) { if (!this.scrollContainers.has(scrollable)) { this.scrollContainers.set(scrollable, scrollable.elementScrolled().subscribe(() => this._scrolled.next(scrollable))); } } /** * De-registers a Scrollable reference and unsubscribes from its scroll event observable. * @param scrollable Scrollable instance to be deregistered. */ deregister(scrollable) { const scrollableReference = this.scrollContainers.get(scrollable); if (scrollableReference) { scrollableReference.unsubscribe(); this.scrollContainers.delete(scrollable); } } /** * Returns an observable that emits an event whenever any of the registered Scrollable * references (or window, document, or body) fire a scrolled event. Can provide a time in ms * to override the default "throttle" time. * * **Note:** in order to avoid hitting change detection for every scroll event, * all of the events emitted from this stream will be run outside the Angular zone. * If you need to update any data bindings as a result of a scroll event, you have * to run the callback using `NgZone.run`. */ scrolled(auditTimeInMs = DEFAULT_SCROLL_TIME) { if (!this._platform.isBrowser) { return of(); } return new Observable((observer) => { if (!this._globalSubscription) { this._addGlobalListener(); } const subscription = auditTimeInMs > 0 ? this._scrolled.pipe(auditTime(auditTimeInMs)).subscribe(observer) : this._scrolled.subscribe(observer); this._scrolledCount++; return () => { subscription.unsubscribe(); this._scrolledCount--; if (!this._scrolledCount) { this._removeGlobalListener(); } }; }); } ngOnDestroy() { this._removeGlobalListener(); this.scrollContainers.forEach((_, container) => this.deregister(container)); this._scrolled.complete(); } /** * Returns an observable that emits whenever any of the * scrollable ancestors of an element are scrolled. * @param elementOrElementRef Element whose ancestors to listen for. * @param auditTimeInMs Time to throttle the scroll events. */ ancestorScrolled(elementOrElementRef, auditTimeInMs) { const ancestors = this.getAncestorScrollContainers(elementOrElementRef); return this.scrolled(auditTimeInMs).pipe(filter((target) => { return !target || ancestors.indexOf(target) > -1; })); } /** Returns all registered Scrollables that contain the provided element. */ getAncestorScrollContainers(elementOrElementRef) { const scrollingContainers = []; this.scrollContainers.forEach((_subscription, scrollable) => { if (this._scrollableContainsElement(scrollable, elementOrElementRef)) { scrollingContainers.push(scrollable); } }); return scrollingContainers; } /** Use defaultView of injected document if available or fallback to global window reference */ _getWindow() { return this._document.defaultView || window; } /** Returns true if the element is contained within the provided Scrollable. */ _scrollableContainsElement(scrollable, elementOrElementRef) { let element = coerceElement(elementOrElementRef); let scrollableElement = scrollable.getElementRef().nativeElement; do { if (element == scrollableElement) { return true; } } while (element = element.parentElement); return false; } /** Sets up the global scroll listeners. */ _addGlobalListener() { this._globalSubscription = this._ngZone.runOutsideAngular(() => { const window2 = this._getWindow(); return fromEvent(window2.document, "scroll").subscribe(() => this._scrolled.next()); }); } /** Cleans up the global scroll listener. */ _removeGlobalListener() { if (this._globalSubscription) { this._globalSubscription.unsubscribe(); this._globalSubscription = null; } } }; _ScrollDispatcher.ɵfac = function ScrollDispatcher_Factory(t) { return new (t || _ScrollDispatcher)(ɵɵinject(NgZone), ɵɵinject(Platform), ɵɵinject(DOCUMENT, 8)); }; _ScrollDispatcher.ɵprov = ɵɵdefineInjectable({ token: _ScrollDispatcher, factory: _ScrollDispatcher.ɵfac, providedIn: "root" }); var ScrollDispatcher = _ScrollDispatcher; (() => { (typeof ngDevMode === "undefined" || ngDevMode) && setClassMetadata(ScrollDispatcher, [{ type: Injectable, args: [{ providedIn: "root" }] }], () => [{ type: NgZone }, { type: Platform }, { type: void 0, decorators: [{ type: Optional }, { type: Inject, args: [DOCUMENT] }] }], null); })(); var _CdkScrollable = class _CdkScrollable { constructor(elementRef, scrollDispatcher, ngZone, dir) { this.elementRef = elementRef; this.scrollDispatcher = scrollDispatcher; this.ngZone = ngZone; this.dir = dir; this._destroyed = new Subject(); this._elementScrolled = new Observable((observer) => this.ngZone.runOutsideAngular(() => fromEvent(this.elementRef.nativeElement, "scroll").pipe(takeUntil(this._destroyed)).subscribe(observer))); } ngOnInit() { this.scrollDispatcher.register(this); } ngOnDestroy() { this.scrollDispatcher.deregister(this); this._destroyed.next(); this._destroyed.complete(); } /** Returns observable that emits when a scroll event is fired on the host element. */ elementScrolled() { return this._elementScrolled; } /** Gets the ElementRef for the viewport. */ getElementRef() { return this.elementRef; } /** * Scrolls to the specified offsets. This is a normalized version of the browser's native scrollTo * method, since browsers are not consistent about what scrollLeft means in RTL. For this method * left and right always refer to the left and right side of the scrolling container irrespective * of the layout direction. start and end refer to left and right in an LTR context and vice-versa * in an RTL context. * @param options specified the offsets to scroll to. */ scrollTo(options) { const el = this.elementRef.nativeElement; const isRtl = this.dir && this.dir.value == "rtl"; if (options.left == null) { options.left = isRtl ? options.end : options.start; } if (options.right == null) { options.right = isRtl ? options.start : options.end; } if (options.bottom != null) { options.top = el.scrollHeight - el.clientHeight - options.bottom; } if (isRtl && getRtlScrollAxisType() != 0) { if (options.left != null) { options.right = el.scrollWidth - el.clientWidth - options.left; } if (getRtlScrollAxisType() == 2) { options.left = options.right; } else if (getRtlScrollAxisType() == 1) { options.left = options.right ? -options.right : options.right; } } else { if (options.right != null) { options.left = el.scrollWidth - el.clientWidth - options.right; } } this._applyScrollToOptions(options); } _applyScrollToOptions(options) { const el = this.elementRef.nativeElement; if (supportsScrollBehavior()) { el.scrollTo(options); } else { if (options.top != null) { el.scrollTop = options.top; } if (options.left != null) { el.scrollLeft = options.left; } } } /** * Measures the scroll offset relative to the specified edge of the viewport. This method can be * used instead of directly checking scrollLeft or scrollTop, since browsers are not consistent * about what scrollLeft means in RTL. The values returned by this method are normalized such that * left and right always refer to the left and right side of the scrolling container irrespective * of the layout direction. start and end refer to left and right in an LTR context and vice-versa * in an RTL context. * @param from The edge to measure from. */ measureScrollOffset(from) { const LEFT = "left"; const RIGHT = "right"; const el = this.elementRef.nativeElement; if (from == "top") { return el.scrollTop; } if (from == "bottom") { return el.scrollHeight - el.clientHeight - el.scrollTop; } const isRtl = this.dir && this.dir.value == "rtl"; if (from == "start") { from = isRtl ? RIGHT : LEFT; } else if (from == "end") { from = isRtl ? LEFT : RIGHT; } if (isRtl && getRtlScrollAxisType() == 2) { if (from == LEFT) { return el.scrollWidth - el.clientWidth - el.scrollLeft; } else { return el.scrollLeft; } } else if (isRtl && getRtlScrollAxisType() == 1) { if (from == LEFT) { return el.scrollLeft + el.scrollWidth - el.clientWidth; } else { return -el.scrollLeft; } } else { if (from == LEFT) { return el.scrollLeft; } else { return el.scrollWidth - el.clientWidth - el.scrollLeft; } } } }; _CdkScrollable.ɵfac = function CdkScrollable_Factory(t) { return new (t || _CdkScrollable)(ɵɵdirectiveInject(ElementRef), ɵɵdirectiveInject(ScrollDispatcher), ɵɵdirectiveInject(NgZone), ɵɵdirectiveInject(Directionality, 8)); }; _CdkScrollable.ɵdir = ɵɵdefineDirective({ type: _CdkScrollable, selectors: [["", "cdk-scrollable", ""], ["", "cdkScrollable", ""]], standalone: true }); var CdkScrollable = _CdkScrollable; (() => { (typeof ngDevMode === "undefined" || ngDevMode) && setClassMetadata(CdkScrollable, [{ type: Directive, args: [{ selector: "[cdk-scrollable], [cdkScrollable]", standalone: true }] }], () => [{ type: ElementRef }, { type: ScrollDispatcher }, { type: NgZone }, { type: Directionality, decorators: [{ type: Optional }] }], null); })(); var DEFAULT_RESIZE_TIME = 20; var _ViewportRuler = class _ViewportRuler { constructor(_platform, ngZone, document2) { this._platform = _platform; this._change = new Subject(); this._changeListener = (event) => { this._change.next(event); }; this._document = document2; ngZone.runOutsideAngular(() => { if (_platform.isBrowser) { const window2 = this._getWindow(); window2.addEventListener("resize", this._changeListener); window2.addEventListener("orientationchange", this._changeListener); } this.change().subscribe(() => this._viewportSize = null); }); } ngOnDestroy() { if (this._platform.isBrowser) { const window2 = this._getWindow(); window2.removeEventListener("resize", this._changeListener); window2.removeEventListener("orientationchange", this._changeListener); } this._change.complete(); } /** Returns the viewport's width and height. */ getViewportSize() { if (!this._viewportSize) { this._updateViewportSize(); } const output = { width: this._viewportSize.width, height: this._viewportSize.height }; if (!this._platform.isBrowser) { this._viewportSize = null; } return output; } /** Gets a ClientRect for the viewport's bounds. */ getViewportRect() { const scrollPosition = this.getViewportScrollPosition(); const { width, height } = this.getViewportSize(); return { top: scrollPosition.top, left: scrollPosition.left, bottom: scrollPosition.top + height, right: scrollPosition.left + width, height, width }; } /** Gets the (top, left) scroll position of the viewport. */ getViewportScrollPosition() { if (!this._platform.isBrowser) { return { top: 0, left: 0 }; } const document2 = this._document; const window2 = this._getWindow(); const documentElement = document2.documentElement; const documentRect = documentElement.getBoundingClientRect(); const top = -documentRect.top || document2.body.scrollTop || window2.scrollY || documentElement.scrollTop || 0; const left = -documentRect.left || document2.body.scrollLeft || window2.scrollX || documentElement.scrollLeft || 0; return { top, left }; } /** * Returns a stream that emits whenever the size of the viewport changes. * This stream emits outside of the Angular zone. * @param throttleTime Time in milliseconds to throttle the stream. */ change(throttleTime = DEFAULT_RESIZE_TIME) { return throttleTime > 0 ? this._change.pipe(auditTime(throttleTime)) : this._change; } /** Use defaultView of injected document if available or fallback to global window reference */ _getWindow() { return this._document.defaultView || window; } /** Updates the cached viewport size. */ _updateViewportSize() { const window2 = this._getWindow(); this._viewportSize = this._platform.isBrowser ? { width: window2.innerWidth, height: window2.innerHeight } : { width: 0, height: 0 }; } }; _ViewportRuler.ɵfac = function ViewportRuler_Factory(t) { return new (t || _ViewportRuler)(ɵɵinject(Platform), ɵɵinject(NgZone), ɵɵinject(DOCUMENT, 8)); }; _ViewportRuler.ɵprov = ɵɵdefineInjectable({ token: _ViewportRuler, factory: _ViewportRuler.ɵfac, providedIn: "root" }); var ViewportRuler = _ViewportRuler; (() => { (typeof ngDevMode === "undefined" || ngDevMode) && setClassMetadata(ViewportRuler, [{ type: Injectable, args: [{ providedIn: "root" }] }], () => [{ type: Platform }, { type: NgZone }, { type: void 0, decorators: [{ type: Optional }, { type: Inject, args: [DOCUMENT] }] }], null); })(); var VIRTUAL_SCROLLABLE = new InjectionToken("VIRTUAL_SCROLLABLE"); var _CdkVirtualScrollable = class _CdkVirtualScrollable extends CdkScrollable { constructor(elementRef, scrollDispatcher, ngZone, dir) { super(elementRef, scrollDispatcher, ngZone, dir); } /** * Measure the viewport size for the provided orientation. * * @param orientation The orientation to measure the size from. */ measureViewportSize(orientation) { const viewportEl = this.elementRef.nativeElement; return orientation === "horizontal" ? viewportEl.clientWidth : viewportEl.clientHeight; } }; _CdkVirtualScrollable.ɵfac = function CdkVirtualScrollable_Factory(t) { return new (t || _CdkVirtualScrollable)(ɵɵdirectiveInject(ElementRef), ɵɵdirectiveInject(ScrollDispatcher), ɵɵdirectiveInject(NgZone), ɵɵdirectiveInject(Directionality, 8)); }; _CdkVirtualScrollable.ɵdir = ɵɵdefineDirective({ type: _CdkVirtualScrollable, features: [ɵɵInheritDefinitionFeature] }); var CdkVirtualScrollable = _CdkVirtualScrollable; (() => { (typeof ngDevMode === "undefined" || ngDevMode) && setClassMetadata(CdkVirtualScrollable, [{ type: Directive }], () => [{ type: ElementRef }, { type: ScrollDispatcher }, { type: NgZone }, { type: Directionality, decorators: [{ type: Optional }] }], null); })(); function rangesEqual(r1, r2) { return r1.start == r2.start && r1.end == r2.end; } var SCROLL_SCHEDULER = typeof requestAnimationFrame !== "undefined" ? animationFrameScheduler : asapScheduler; var _CdkVirtualScrollViewport = class _CdkVirtualScrollViewport extends CdkVirtualScrollable { /** The direction the viewport scrolls. */ get orientation() { return this._orientation; } set orientation(orientation) { if (this._orientation !== orientation) { this._orientation = orientation; this._calculateSpacerSize(); } } constructor(elementRef, _changeDetectorRef, ngZone, _scrollStrategy, dir, scrollDispatcher, viewportRuler, scrollable) { super(elementRef, scrollDispatcher, ngZone, dir); this.elementRef = elementRef; this._changeDetectorRef = _changeDetectorRef; this._scrollStrategy = _scrollStrategy; this.scrollable = scrollable; this._platform = inject(Platform); this._detachedSubject = new Subject(); this._renderedRangeSubject = new Subject(); this._orientation = "vertical"; this.appendOnly = false; this.scrolledIndexChange = new Observable((observer) => this._scrollStrategy.scrolledIndexChange.subscribe((index) => Promise.resolve().then(() => this.ngZone.run(() => observer.next(index))))); this.renderedRangeStream = this._renderedRangeSubject; this._totalContentSize = 0; this._totalContentWidth = ""; this._totalContentHeight = ""; this._renderedRange = { start: 0, end: 0 }; this._dataLength = 0; this._viewportSize = 0; this._renderedContentOffset = 0; this._renderedContentOffsetNeedsRewrite = false; this._isChangeDetectionPending = false; this._runAfterChangeDetection = []; this._viewportChanges = Subscription.EMPTY; if (!_scrollStrategy && (typeof ngDevMode === "undefined" || ngDevMode)) { throw Error('Error: cdk-virtual-scroll-viewport requires the "itemSize" property to be set.'); } this._viewportChanges = viewportRuler.change().subscribe(() => { this.checkViewportSize(); }); if (!this.scrollable) { this.elementRef.nativeElement.classList.add("cdk-virtual-scrollable"); this.scrollable = this; } } ngOnInit() { if (!this._platform.isBrowser) { return; } if (this.scrollable === this) { super.ngOnInit(); } this.ngZone.runOutsideAngular(() => Promise.resolve().then(() => { this._measureViewportSize(); this._scrollStrategy.attach(this); this.scrollable.elementScrolled().pipe( // Start off with a fake scroll event so we properly detect our initial position. startWith(null), // Collect multiple events into one until the next animation frame. This way if // there are multiple scroll events in the same frame we only need to recheck // our layout once. auditTime(0, SCROLL_SCHEDULER), // Usually `elementScrolled` is completed when the scrollable is destroyed, but // that may not be the case if a `CdkVirtualScrollableElement` is used so we have // to unsubscribe here just in case. takeUntil(this._destroyed) ).subscribe(() => this._scrollStrategy.onContentScrolled()); this._markChangeDetectionNeeded(); })); } ngOnDestroy() { this.detach(); this._scrollStrategy.detach(); this._renderedRangeSubject.complete(); this._detachedSubject.complete(); this._viewportChanges.unsubscribe(); super.ngOnDestroy(); } /** Attaches a `CdkVirtualScrollRepeater` to this viewport. */ attach(forOf) { if (this._forOf && (typeof ngDevMode === "undefined" || ngDevMode)) { throw Error("CdkVirtualScrollViewport is already attached."); } this.ngZone.runOutsideAngular(() => { this._forOf = forOf; this._forOf.dataStream.pipe(takeUntil(this._detachedSubject)).subscribe((data) => { const newLength = data.length; if (newLength !== this._dataLength) { this._dataLength = newLength; this._scrollStrategy.onDataLengthChanged(); } this._doChangeDetection(); }); }); } /** Detaches the current `CdkVirtualForOf`. */ detach() { this._forOf = null; this._detachedSubject.next(); } /** Gets the length of the data bound to this viewport (in number of items). */ getDataLength() { return this._dataLength; } /** Gets the size of the viewport (in pixels). */ getViewportSize() { return this._viewportSize; } // TODO(mmalerba): This is technically out of sync with what's really rendered until a render // cycle happens. I'm being careful to only call it after the render cycle is complete and before // setting it to something else, but its error prone and should probably be split into // `pendingRange` and `renderedRange`, the latter reflecting whats actually in the DOM. /** Get the current rendered range of items. */ getRenderedRange() { return this._renderedRange; } measureBoundingClientRectWithScrollOffset(from) { return this.getElementRef().nativeElement.getBoundingClientRect()[from]; } /** * Sets the total size of all content (in pixels), including content that is not currently * rendered. */ setTotalContentSize(size) { if (this._totalContentSize !== size) { this._totalContentSize = size; this._calculateSpacerSize(); this._markChangeDetectionNeeded(); } } /** Sets the currently rendered range of indices. */ setRenderedRange(range) { if (!rangesEqual(this._renderedRange, range)) { if (this.appendOnly) { range = { start: 0, end: Math.max(this._renderedRange.end, range.end) }; } this._renderedRangeSubject.next(this._renderedRange = range); this._markChangeDetectionNeeded(() => this._scrollStrategy.onContentRendered()); } } /** * Gets the offset from the start of the viewport to the start of the rendered data (in pixels). */ getOffsetToRenderedContentStart() { return this._renderedContentOffsetNeedsRewrite ? null : this._renderedContentOffset; } /** * Sets the offset from the start of the viewport to either the start or end of the rendered data * (in pixels). */ setRenderedContentOffset(offset, to = "to-start") { offset = this.appendOnly && to === "to-start" ? 0 : offset; const isRtl = this.dir && this.dir.value == "rtl"; const isHorizontal = this.orientation == "horizontal"; const axis = isHorizontal ? "X" : "Y"; const axisDirection = isHorizontal && isRtl ? -1 : 1; let transform = `translate${axis}(${Number(axisDirection * offset)}px)`; this._renderedContentOffset = offset; if (to === "to-end") { transform += ` translate${axis}(-100%)`; this._renderedContentOffsetNeedsRewrite = true; } if (this._renderedContentTransform != transform) { this._renderedContentTransform = transform; this._markChangeDetectionNeeded(() => { if (this._renderedContentOffsetNeedsRewrite) { this._renderedContentOffset -= this.measureRenderedContentSize(); this._renderedContentOffsetNeedsRewrite = false; this.setRenderedContentOffset(this._renderedContentOffset); } else { this._scrollStrategy.onRenderedOffsetChanged(); } }); } } /** * Scrolls to the given offset from the start of the viewport. Please note that this is not always * the same as setting `scrollTop` or `scrollLeft`. In a horizontal viewport with right-to-left * direction, this would be the equivalent of setting a fictional `scrollRight` property. * @param offset The offset to scroll to. * @param behavior The ScrollBehavior to use when scrolling. Default is behavior is `auto`. */ scrollToOffset(offset, behavior = "auto") { const options = { behavior }; if (this.orientation === "horizontal") { options.start = offset; } else { options.top = offset; } this.scrollable.scrollTo(options); } /** * Scrolls to the offset for the given index. * @param index The index of the element to scroll to. * @param behavior The ScrollBehavior to use when scrolling. Default is behavior is `auto`. */ scrollToIndex(index, behavior = "auto") { this._scrollStrategy.scrollToIndex(index, behavior); } /** * Gets the current scroll offset from the start of the scrollable (in pixels). * @param from The edge to measure the offset from. Defaults to 'top' in vertical mode and 'start' * in horizontal mode. */ measureScrollOffset(from) { let measureScrollOffset; if (this.scrollable == this) { measureScrollOffset = (_from) => super.measureScrollOffset(_from); } else { measureScrollOffset = (_from) => this.scrollable.measureScrollOffset(_from); } return Math.max(0, measureScrollOffset(from ?? (this.orientation === "horizontal" ? "start" : "top")) - this.measureViewportOffset()); } /** * Measures the offset of the viewport from the scrolling container * @param from The edge to measure from. */ measureViewportOffset(from) { let fromRect; const LEFT = "left"; const RIGHT = "right"; const isRtl = this.dir?.value == "rtl"; if (from == "start") { fromRect = isRtl ? RIGHT : LEFT; } else if (from == "end") { fromRect = isRtl ? LEFT : RIGHT; } else if (from) { fromRect = from; } else { fromRect = this.orientation === "horizontal" ? "left" : "top"; } const scrollerClientRect = this.scrollable.measureBoundingClientRectWithScrollOffset(fromRect); const viewportClientRect = this.elementRef.nativeElement.getBoundingClientRect()[fromRect]; return viewportClientRect - scrollerClientRect; } /** Measure the combined size of all of the rendered items. */ measureRenderedContentSize() { const contentEl = this._contentWrapper.nativeElement; return this.orientation === "horizontal" ? contentEl.offsetWidth : contentEl.offsetHeight; } /** * Measure the total combined size of the given range. Throws if the range includes items that are * not rendered. */ measureRangeSize(range) { if (!this._forOf) { return 0; } return this._forOf.measureRangeSize(range, this.orientation); } /** Update the viewport dimensions and re-render. */ checkViewportSize() { this._measureViewportSize(); this._scrollStrategy.onDataLengthChanged(); } /** Measure the viewport size. */ _measureViewportSize() { this._viewportSize = this.scrollable.measureViewportSize(this.orientation); } /** Queue up change detection to run. */ _markChangeDetectionNeeded(runAfter) { if (runAfter) { this._runAfterChangeDetection.push(runAfter); } if (!this._isChangeDetectionPending) { this._isChangeDetectionPending = true; this.ngZone.runOutsideAngular(() => Promise.resolve().then(() => { this._doChangeDetection(); })); } } /** Run change detection. */ _doChangeDetection() { this._isChangeDetectionPending = false; this._contentWrapper.nativeElement.style.transform = this._renderedContentTransform; this.ngZone.run(() => this._changeDetectorRef.markForCheck()); const runAfterChangeDetection = this._runAfterChangeDetection; this._runAfterChangeDetection = []; for (const fn of runAfterChangeDetection) { fn(); } } /** Calculates the `style.width` and `style.height` for the spacer element. */ _calculateSpacerSize() { this._totalContentHeight = this.orientation === "horizontal" ? "" : `${this._totalContentSize}px`; this._totalContentWidth = this.orientation === "horizontal" ? `${this._totalContentSize}px` : ""; } }; _CdkVirtualScrollViewport.ɵfac = function CdkVirtualScrollViewport_Factory(t) { return new (t || _CdkVirtualScrollViewport)(ɵɵdirectiveInject(ElementRef), ɵɵdirectiveInject(ChangeDetectorRef), ɵɵdirectiveInject(NgZone), ɵɵdirectiveInject(VIRTUAL_SCROLL_STRATEGY, 8), ɵɵdirectiveInject(Directionality, 8), ɵɵdirectiveInject(ScrollDispatcher), ɵɵdirectiveInject(ViewportRuler), ɵɵdirectiveInject(VIRTUAL_SCROLLABLE, 8)); }; _CdkVirtualScrollViewport.ɵcmp = ɵɵdefineComponent({ type: _CdkVirtualScrollViewport, selectors: [["cdk-virtual-scroll-viewport"]], viewQuery: function CdkVirtualScrollViewport_Query(rf, ctx) { if (rf & 1) { ɵɵviewQuery(_c0, 7); } if (rf & 2) { let _t; ɵɵqueryRefresh(_t = ɵɵloadQuery()) && (ctx._contentWrapper = _t.first); } }, hostAttrs: [1, "cdk-virtual-scroll-viewport"], hostVars: 4, hostBindings: function CdkVirtualScrollViewport_HostBindings(rf, ctx) { if (rf & 2) { ɵɵclassProp("cdk-virtual-scroll-orientation-horizontal", ctx.orientation === "horizontal")("cdk-virtual-scroll-orientation-vertical", ctx.orientation !== "horizontal"); } }, inputs: { orientation: "orientation", appendOnly: ["appendOnly", "appendOnly", booleanAttribute] }, outputs: { scrolledIndexChange: "scrolledIndexChange" }, standalone: true, features: [ɵɵProvidersFeature([{ provide: CdkScrollable, useFactory: (virtualScrollable, viewport) => virtualScrollable || viewport, deps: [[new Optional(), new Inject(VIRTUAL_SCROLLABLE)], _CdkVirtualScrollViewport] }]), ɵɵInputTransformsFeature, ɵɵInheritDefinitionFeature, ɵɵStandaloneFeature], ngContentSelectors: _c1, decls: 4, vars: 4, consts: [[1, "cdk-virtual-scroll-content-wrapper"], ["contentWrapper", ""], [1, "cdk-virtual-scroll-spacer"]], template: function CdkVirtualScrollViewport_Template(rf, ctx) { if (rf & 1) { ɵɵprojectionDef(); ɵɵelementStart(0, "div", 0, 1); ɵɵprojection(2); ɵɵelementEnd(); ɵɵelement(3, "div", 2); } if (rf & 2) { ɵɵadvance(3); ɵɵstyleProp("width", ctx._totalContentWidth)("height", ctx._totalContentHeight); } }, styles: ["cdk-virtual-scroll-viewport{display:block;position:relative;transform:translateZ(0)}.cdk-virtual-scrollable{overflow:auto;will-change:scroll-position;contain:strict;-webkit-overflow-scrolling:touch}.cdk-virtual-scroll-content-wrapper{position:absolute;top:0;left:0;contain:content}[dir=rtl] .cdk-virtual-scroll-content-wrapper{right:0;left:auto}.cdk-virtual-scroll-orientation-horizontal .cdk-virtual-scroll-content-wrapper{min-height:100%}.cdk-virtual-scroll-orientation-horizontal .cdk-virtual-scroll-content-wrapper>dl:not([cdkVirtualFor]),.cdk-virtual-scroll-orientation-horizontal .cdk-virtual-scroll-content-wrapper>ol:not([cdkVirtualFor]),.cdk-virtual-scroll-orientation-horizontal .cdk-virtual-scroll-content-wrapper>table:not([cdkVirtualFor]),.cdk-virtual-scroll-orientation-horizontal .cdk-virtual-scroll-content-wrapper>ul:not([cdkVirtualFor]){padding-left:0;padding-right:0;margin-left:0;margin-right:0;border-left-width:0;border-right-width:0;outline:none}.cdk-virtual-scroll-orientation-vertical .cdk-virtual-scroll-content-wrapper{min-width:100%}.cdk-virtual-scroll-orientation-vertical .cdk-virtual-scroll-content-wrapper>dl:not([cdkVirtualFor]),.cdk-virtual-scroll-orientation-vertical .cdk-virtual-scroll-content-wrapper>ol:not([cdkVirtualFor]),.cdk-virtual-scroll-orientation-vertical .cdk-virtual-scroll-content-wrapper>table:not([cdkVirtualFor]),.cdk-virtual-scroll-orientation-vertical .cdk-virtual-scroll-content-wrapper>ul:not([cdkVirtualFor]){padding-top:0;padding-bottom:0;margin-top:0;margin-bottom:0;border-top-width:0;border-bottom-width:0;outline:none}.cdk-virtual-scroll-spacer{height:1px;transform-origin:0 0;flex:0 0 auto}[dir=rtl] .cdk-virtual-scroll-spacer{transform-origin:100% 0}"], encapsulation: 2, changeDetection: 0 }); var CdkVirtualScrollViewport = _CdkVirtualScrollViewport; (() => { (typeof ngDevMode === "undefined" || ngDevMode) && setClassMetadata(CdkVirtualScrollViewport, [{ type: Component, args: [{ selector: "cdk-virtual-scroll-viewport", host: { "class": "cdk-virtual-scroll-viewport", "[class.cdk-virtual-scroll-orientation-horizontal]": 'orientation === "horizontal"', "[class.cdk-virtual-scroll-orientation-vertical]": 'orientation !== "horizontal"' }, encapsulation: ViewEncapsulation$1.None, changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, providers: [{ provide: CdkScrollable, useFactory: (virtualScrollable, viewport) => virtualScrollable || viewport, deps: [[new Optional(), new Inject(VIRTUAL_SCROLLABLE)], CdkVirtualScrollViewport] }], template: '\n
\n \n
\n\n
\n', styles: ["cdk-virtual-scroll-viewport{display:block;position:relative;transform:translateZ(0)}.cdk-virtual-scrollable{overflow:auto;will-change:scroll-position;contain:strict;-webkit-overflow-scrolling:touch}.cdk-virtual-scroll-content-wrapper{position:absolute;top:0;left:0;contain:content}[dir=rtl] .cdk-virtual-scroll-content-wrapper{right:0;left:auto}.cdk-virtual-scroll-orientation-horizontal .cdk-virtual-scroll-content-wrapper{min-height:100%}.cdk-virtual-scroll-orientation-horizontal .cdk-virtual-scroll-content-wrapper>dl:not([cdkVirtualFor]),.cdk-virtual-scroll-orientation-horizontal .cdk-virtual-scroll-content-wrapper>ol:not([cdkVirtualFor]),.cdk-virtual-scroll-orientation-horizontal .cdk-virtual-scroll-content-wrapper>table:not([cdkVirtualFor]),.cdk-virtual-scroll-orientation-horizontal .cdk-virtual-scroll-content-wrapper>ul:not([cdkVirtualFor]){padding-left:0;padding-right:0;margin-left:0;margin-right:0;border-left-width:0;border-right-width:0;outline:none}.cdk-virtual-scroll-orientation-vertical .cdk-virtual-scroll-content-wrapper{min-width:100%}.cdk-virtual-scroll-orientation-vertical .cdk-virtual-scroll-content-wrapper>dl:not([cdkVirtualFor]),.cdk-virtual-scroll-orientation-vertical .cdk-virtual-scroll-content-wrapper>ol:not([cdkVirtualFor]),.cdk-virtual-scroll-orientation-vertical .cdk-virtual-scroll-content-wrapper>table:not([cdkVirtualFor]),.cdk-virtual-scroll-orientation-vertical .cdk-virtual-scroll-content-wrapper>ul:not([cdkVirtualFor]){padding-top:0;padding-bottom:0;margin-top:0;margin-bottom:0;border-top-width:0;border-bottom-width:0;outline:none}.cdk-virtual-scroll-spacer{height:1px;transform-origin:0 0;flex:0 0 auto}[dir=rtl] .cdk-virtual-scroll-spacer{transform-origin:100% 0}"] }] }], () => [{ type: ElementRef }, { type: ChangeDetectorRef }, { type: NgZone }, { type: void 0, decorators: [{ type: Optional }, { type: Inject, args: [VIRTUAL_SCROLL_STRATEGY] }] }, { type: Directionality, decorators: [{ type: Optional }] }, { type: ScrollDispatcher }, { type: ViewportRuler }, { type: CdkVirtualScrollable, decorators: [{ type: Optional }, { type: Inject, args: [VIRTUAL_SCROLLABLE] }] }], { orientation: [{ type: Input }], appendOnly: [{ type: Input, args: [{ transform: booleanAttribute }] }], scrolledIndexChange: [{ type: Output }], _contentWrapper: [{ type: ViewChild, args: ["contentWrapper", { static: true }] }] }); })(); function getOffset(orientation, direction, node) { const el = node; if (!el.getBoundingClientRect) { return 0; } const rect = el.getBoundingClientRect(); if (orientation === "horizontal") { return direction === "start" ? rect.left : rect.right; } return direction === "start" ? rect.top : rect.bottom; } var _CdkVirtualForOf = class _CdkVirtualForOf { /** The DataSource to display. */ get cdkVirtualForOf() { return this._cdkVirtualForOf; } set cdkVirtualForOf(value) { this._cdkVirtualForOf = value; if (isDataSource(value)) { this._dataSourceChanges.next(value); } else { this._dataSourceChanges.next(new ArrayDataSource(isObservable(value) ? value : Array.from(value || []))); } } /** * The `TrackByFunction` to use for tracking changes. The `TrackByFunction` takes the index and * the item and produces a value to be used as the item's identity when tracking changes. */ get cdkVirtualForTrackBy() { return this._cdkVirtualForTrackBy; } set cdkVirtualForTrackBy(fn) { this._needsUpdate = true; this._cdkVirtualForTrackBy = fn ? (index, item) => fn(index + (this._renderedRange ? this._renderedRange.start : 0), item) : void 0; } /** The template used to stamp out new elements. */ set cdkVirtualForTemplate(value) { if (value) { this._needsUpdate = true; this._template = value; } } /** * The size of the cache used to store templates that are not being used for re-use later. * Setting the cache size to `0` will disable caching. Defaults to 20 templates. */ get cdkVirtualForTemplateCacheSize() { return this._viewRepeater.viewCacheSize; } set cdkVirtualForTemplateCacheSize(size) { this._viewRepeater.viewCacheSize = coerceNumberProperty(size); } constructor(_viewContainerRef, _template, _differs, _viewRepeater, _viewport, ngZone) { this._viewContainerRef = _viewContainerRef; this._template = _template; this._differs = _differs; this._viewRepeater = _viewRepeater; this._viewport = _viewport; this.viewChange = new Subject(); this._dataSourceChanges = new Subject(); this.dataStream = this._dataSourceChanges.pipe( // Start off with null `DataSource`. startWith(null), // Bundle up the previous and current data sources so we can work with both. pairwise(), // Use `_changeDataSource` to disconnect from the previous data source and connect to the // new one, passing back a stream of data changes which we run through `switchMap` to give // us a data stream that emits the latest data from whatever the current `DataSource` is. switchMap(([prev, cur]) => this._changeDataSource(prev, cur)), // Replay the last emitted data when someone subscribes. shareReplay(1) ); this._differ = null; this._needsUpdate = false; this._destroyed = new Subject(); this.dataStream.subscribe((data) => { this._data = data; this._onRenderedDataChange(); }); this._viewport.renderedRangeStream.pipe(takeUntil(this._destroyed)).subscribe((range) => { this._renderedRange = range; if (this.viewChange.observers.length) { ngZone.run(() => this.viewChange.next(this._renderedRange)); } this._onRenderedDataChange(); }); this._viewport.attach(this); } /** * Measures the combined size (width for horizontal orientation, height for vertical) of all items * in the specified range. Throws an error if the range includes items that are not currently * rendered. */ measureRangeSize(range, orientation) { if (range.start >= range.end) { return 0; } if ((range.start < this._renderedRange.start || range.end > this._renderedRange.end) && (typeof ngDevMode === "undefined" || ngDevMode)) { throw Error(`Error: attempted to measure an item that isn't rendered.`); } const renderedStartIndex = range.start - this._renderedRange.start; const rangeLen = range.end - range.start; let firstNode; let lastNode; for (let i = 0; i < rangeLen; i++) { const view = this._viewContainerRef.get(i + renderedStartIndex); if (view && view.rootNodes.length) { firstNode = lastNode = view.rootNodes[0]; break; } } for (let i = rangeLen - 1; i > -1; i--) { const view = this._viewContainerRef.get(i + renderedStartIndex); if (view && view.rootNodes.length) { lastNode = view.rootNodes[view.rootNodes.length - 1]; break; } } return firstNode && lastNode ? getOffset(orientation, "end", lastNode) - getOffset(orientation, "start", firstNode) : 0; } ngDoCheck() { if (this._differ && this._needsUpdate) { const changes = this._differ.diff(this._renderedItems); if (!changes) { this._updateContext(); } else { this._applyChanges(changes); } this._needsUpdate = false; } } ngOnDestroy() { this._viewport.detach(); this._dataSourceChanges.next(void 0); this._dataSourceChanges.complete(); this.viewChange.complete(); this._destroyed.next(); this._destroyed.complete(); this._viewRepeater.detach(); } /** React to scroll state changes in the viewport. */ _onRenderedDataChange() { if (!this._renderedRange) { return; } this._renderedItems = this._data.slice(this._renderedRange.start, this._renderedRange.end); if (!this._differ) { this._differ = this._differs.find(this._renderedItems).create((index, item) => { return this.cdkVirtualForTrackBy ? this.cdkVirtualForTrackBy(index, item) : item; }); } this._needsUpdate = true; } /** Swap out one `DataSource` for another. */ _changeDataSource(oldDs, newDs) { if (oldDs) { oldDs.disconnect(this); } this._needsUpdate = true; return newDs ? newDs.connect(this) : of(); } /** Update the `CdkVirtualForOfContext` for all views. */ _updateContext() { const count = this._data.length; let i = this._viewContainerRef.length; while (i--) { const view = this._viewContainerRef.get(i); view.context.index = this._renderedRange.start + i; view.context.count = count; this._updateComputedContextProperties(view.context); view.detectChanges(); } } /** Apply changes to the DOM. */ _applyChanges(changes) { this._viewRepeater.applyChanges(changes, this._viewContainerRef, (record, _adjustedPreviousIndex, currentIndex) => this._getEmbeddedViewArgs(record, currentIndex), (record) => record.item); changes.forEachIdentityChange((record) => { const view = this._viewContainerRef.get(record.currentIndex); view.context.$implicit = record.item; }); const count = this._data.length; let i = this._viewContainerRef.length; while (i--) { const view = this._viewContainerRef.get(i); view.context.index = this._renderedRange.start + i; view.context.count = count; this._updateComputedContextProperties(view.context); } } /** Update the computed properties on the `CdkVirtualForOfContext`. */ _updateComputedContextProperties(context) { context.first = context.index === 0; context.last = context.index === context.count - 1; context.even = context.index % 2 === 0; context.odd = !context.even; } _getEmbeddedViewArgs(record, index) { return { templateRef: this._template, context: { $implicit: record.item, // It's guaranteed that the iterable is not "undefined" or "null" because we only // generate views for elements if the "cdkVirtualForOf" iterable has elements. cdkVirtualForOf: this._cdkVirtualForOf, index: -1, count: -1, first: false, last: false, odd: false, even: false }, index }; } }; _CdkVirtualForOf.ɵfac = function CdkVirtualForOf_Factory(t) { return new (t || _CdkVirtualForOf)(ɵɵdirectiveInject(ViewContainerRef), ɵɵdirectiveInject(TemplateRef), ɵɵdirectiveInject(IterableDiffers), ɵɵdirectiveInject(_VIEW_REPEATER_STRATEGY), ɵɵdirectiveInject(CdkVirtualScrollViewport, 4), ɵɵdirectiveInject(NgZone)); }; _CdkVirtualForOf.ɵdir = ɵɵdefineDirective({ type: _CdkVirtualForOf, selectors: [["", "cdkVirtualFor", "", "cdkVirtualForOf", ""]], inputs: { cdkVirtualForOf: "cdkVirtualForOf", cdkVirtualForTrackBy: "cdkVirtualForTrackBy", cdkVirtualForTemplate: "cdkVirtualForTemplate", cdkVirtualForTemplateCacheSize: "cdkVirtualForTemplateCacheSize" }, standalone: true, features: [ɵɵProvidersFeature([{ provide: _VIEW_REPEATER_STRATEGY, useClass: _RecycleViewRepeaterStrategy }])] }); var CdkVirtualForOf = _CdkVirtualForOf; (() => { (typeof ngDevMode === "undefined" || ngDevMode) && setClassMetadata(CdkVirtualForOf, [{ type: Directive, args: [{ selector: "[cdkVirtualFor][cdkVirtualForOf]", providers: [{ provide: _VIEW_REPEATER_STRATEGY, useClass: _RecycleViewRepeaterStrategy }], standalone: true }] }], () => [{ type: ViewContainerRef }, { type: TemplateRef }, { type: IterableDiffers }, { type: _RecycleViewRepeaterStrategy, decorators: [{ type: Inject, args: [_VIEW_REPEATER_STRATEGY] }] }, { type: CdkVirtualScrollViewport, decorators: [{ type: SkipSelf }] }, { type: NgZone }], { cdkVirtualForOf: [{ type: Input }], cdkVirtualForTrackBy: [{ type: Input }], cdkVirtualForTemplate: [{ type: Input }], cdkVirtualForTemplateCacheSize: [{ type: Input }] }); })(); var _CdkVirtualScrollableElement = class _CdkVirtualScrollableElement extends CdkVirtualScrollable { constructor(elementRef, scrollDispatcher, ngZone, dir) { super(elementRef, scrollDispatcher, ngZone, dir); } measureBoundingClientRectWithScrollOffset(from) { return this.getElementRef().nativeElement.getBoundingClientRect()[from] - this.measureScrollOffset(from); } }; _CdkVirtualScrollableElement.ɵfac = function CdkVirtualScrollableElement_Factory(t) { return new (t || _CdkVirtualScrollableElement)(ɵɵdirectiveInject(ElementRef), ɵɵdirectiveInject(ScrollDispatcher), ɵɵdirectiveInject(NgZone), ɵɵdirectiveInject(Directionality, 8)); }; _CdkVirtualScrollableElement.ɵdir = ɵɵdefineDirective({ type: _CdkVirtualScrollableElement, selectors: [["", "cdkVirtualScrollingElement", ""]], hostAttrs: [1, "cdk-virtual-scrollable"], standalone: true, features: [ɵɵProvidersFeature([{ provide: VIRTUAL_SCROLLABLE, useExisting: _CdkVirtualScrollableElement }]), ɵɵInheritDefinitionFeature] }); var CdkVirtualScrollableElement = _CdkVirtualScrollableElement; (() => { (typeof ngDevMode === "undefined" || ngDevMode) && setClassMetadata(CdkVirtualScrollableElement, [{ type: Directive, args: [{ selector: "[cdkVirtualScrollingElement]", providers: [{ provide: VIRTUAL_SCROLLABLE, useExisting: CdkVirtualScrollableElement }], standalone: true, host: { "class": "cdk-virtual-scrollable" } }] }], () => [{ type: ElementRef }, { type: ScrollDispatcher }, { type: NgZone }, { type: Directionality, decorators: [{ type: Optional }] }], null); })(); var _CdkVirtualScrollableWindow = class _CdkVirtualScrollableWindow extends CdkVirtualScrollable { constructor(scrollDispatcher, ngZone, dir) { super(new ElementRef(document.documentElement), scrollDispatcher, ngZone, dir); this._elementScrolled = new Observable((observer) => this.ngZone.runOutsideAngular(() => fromEvent(document, "scroll").pipe(takeUntil(this._destroyed)).subscribe(observer))); } measureBoundingClientRectWithScrollOffset(from) { return this.getElementRef().nativeElement.getBoundingClientRect()[from]; } }; _CdkVirtualScrollableWindow.ɵfac = function CdkVirtualScrollableWindow_Factory(t) { return new (t || _CdkVirtualScrollableWindow)(ɵɵdirectiveInject(ScrollDispatcher), ɵɵdirectiveInject(NgZone), ɵɵdirectiveInject(Directionality, 8)); }; _CdkVirtualScrollableWindow.ɵdir = ɵɵdefineDirective({ type: _CdkVirtualScrollableWindow, selectors: [["cdk-virtual-scroll-viewport", "scrollWindow", ""]], standalone: true, features: [ɵɵProvidersFeature([{ provide: VIRTUAL_SCROLLABLE, useExisting: _CdkVirtualScrollableWindow }]), ɵɵInheritDefinitionFeature] }); var CdkVirtualScrollableWindow = _CdkVirtualScrollableWindow; (() => { (typeof ngDevMode === "undefined" || ngDevMode) && setClassMetadata(CdkVirtualScrollableWindow, [{ type: Directive, args: [{ selector: "cdk-virtual-scroll-viewport[scrollWindow]", providers: [{ provide: VIRTUAL_SCROLLABLE, useExisting: CdkVirtualScrollableWindow }], standalone: true }] }], () => [{ type: ScrollDispatcher }, { type: NgZone }, { type: Directionality, decorators: [{ type: Optional }] }], null); })(); var _CdkScrollableModule = class _CdkScrollableModule { }; _CdkScrollableModule.ɵfac = function CdkScrollableModule_Factory(t) { return new (t || _CdkScrollableModule)(); }; _CdkScrollableModule.ɵmod = ɵɵdefineNgModule({ type: _CdkScrollableModule, imports: [CdkScrollable], exports: [CdkScrollable] }); _CdkScrollableModule.ɵinj = ɵɵdefineInjector({}); var CdkScrollableModule = _CdkScrollableModule; (() => { (typeof ngDevMode === "undefined" || ngDevMode) && setClassMetadata(CdkScrollableModule, [{ type: NgModule, args: [{ exports: [CdkScrollable], imports: [CdkScrollable] }] }], null, null); })(); var _ScrollingModule = class _ScrollingModule { }; _ScrollingModule.ɵfac = function ScrollingModule_Factory(t) { return new (t || _ScrollingModule)(); }; _ScrollingModule.ɵmod = ɵɵdefineNgModule({ type: _ScrollingModule, imports: [BidiModule, CdkScrollableModule, CdkVirtualScrollViewport, CdkFixedSizeVirtualScroll, CdkVirtualForOf, CdkVirtualScrollableWindow, CdkVirtualScrollableElement], exports: [BidiModule, CdkScrollableModule, CdkFixedSizeVirtualScroll, CdkVirtualForOf, CdkVirtualScrollViewport, CdkVirtualScrollableWindow, CdkVirtualScrollableElement] }); _ScrollingModule.ɵinj = ɵɵdefineInjector({ imports: [BidiModule, CdkScrollableModule, BidiModule, CdkScrollableModule] }); var ScrollingModule = _ScrollingModule; (() => { (typeof ngDevMode === "undefined" || ngDevMode) && setClassMetadata(ScrollingModule, [{ type: NgModule, args: [{ imports: [BidiModule, CdkScrollableModule, CdkVirtualScrollViewport, CdkFixedSizeVirtualScroll, CdkVirtualForOf, CdkVirtualScrollableWindow, CdkVirtualScrollableElement], exports: [BidiModule, CdkScrollableModule, CdkFixedSizeVirtualScroll, CdkVirtualForOf, CdkVirtualScrollViewport, CdkVirtualScrollableWindow, CdkVirtualScrollableElement] }] }], null, null); })(); // node_modules/@angular/cdk/fesm2022/overlay.mjs var scrollBehaviorSupported = supportsScrollBehavior(); var BlockScrollStrategy = class { constructor(_viewportRuler, document2) { this._viewportRuler = _viewportRuler; this._previousHTMLStyles = { top: "", left: "" }; this._isEnabled = false; this._document = document2; } /** Attaches this scroll strategy to an overlay. */ attach() { } /** Blocks page-level scroll while the attached overlay is open. */ enable() { if (this._canBeEnabled()) { const root = this._document.documentElement; this._previousScrollPosition = this._viewportRuler.getViewportScrollPosition(); this._previousHTMLStyles.left = root.style.left || ""; this._previousHTMLStyles.top = root.style.top || ""; root.style.left = coerceCssPixelValue(-this._previousScrollPosition.left); root.style.top = coerceCssPixelValue(-this._previousScrollPosition.top); root.classList.add("cdk-global-scrollblock"); this._isEnabled = true; } } /** Unblocks page-level scroll while the attached overlay is open. */ disable() { if (this._isEnabled) { const html = this._document.documentElement; const body = this._document.body; const htmlStyle = html.style; const bodyStyle = body.style; const previousHtmlScrollBehavior = htmlStyle.scrollBehavior || ""; const previousBodyScrollBehavior = bodyStyle.scrollBehavior || ""; this._isEnabled = false; htmlStyle.left = this._previousHTMLStyles.left; htmlStyle.top = this._previousHTMLStyles.top; html.classList.remove("cdk-global-scrollblock"); if (scrollBehaviorSupported) { htmlStyle.scrollBehavior = bodyStyle.scrollBehavior = "auto"; } window.scroll(this._previousScrollPosition.left, this._previousScrollPosition.top); if (scrollBehaviorSupported) { htmlStyle.scrollBehavior = previousHtmlScrollBehavior; bodyStyle.scrollBehavior = previousBodyScrollBehavior; } } } _canBeEnabled() { const html = this._document.documentElement; if (html.classList.contains("cdk-global-scrollblock") || this._isEnabled) { return false; } const body = this._document.body; const viewport = this._viewportRuler.getViewportSize(); return body.scrollHeight > viewport.height || body.scrollWidth > viewport.width; } }; function getMatScrollStrategyAlreadyAttachedError() { return Error(`Scroll strategy has already been attached.`); } var CloseScrollStrategy = class { constructor(_scrollDispatcher, _ngZone, _viewportRuler, _config) { this._scrollDispatcher = _scrollDispatcher; this._ngZone = _ngZone; this._viewportRuler = _viewportRuler; this._config = _config; this._scrollSubscription = null; this._detach = () => { this.disable(); if (this._overlayRef.hasAttached()) { this._ngZone.run(() => this._overlayRef.detach()); } }; } /** Attaches this scroll strategy to an overlay. */ attach(overlayRef) { if (this._overlayRef && (typeof ngDevMode === "undefined" || ngDevMode)) { throw getMatScrollStrategyAlreadyAttachedError(); } this._overlayRef = overlayRef; } /** Enables the closing of the attached overlay on scroll. */ enable() { if (this._scrollSubscription) { return; } const stream = this._scrollDispatcher.scrolled(0).pipe(filter((scrollable) => { return !scrollable || !this._overlayRef.overlayElement.contains(scrollable.getElementRef().nativeElement); })); if (this._config && this._config.threshold && this._config.threshold > 1) { this._initialScrollPosition = this._viewportRuler.getViewportScrollPosition().top; this._scrollSubscription = stream.subscribe(() => { const scrollPosition = this._viewportRuler.getViewportScrollPosition().top; if (Math.abs(scrollPosition - this._initialScrollPosition) > this._config.threshold) { this._detach(); } else { this._overlayRef.updatePosition(); } }); } else { this._scrollSubscription = stream.subscribe(this._detach); } } /** Disables the closing the attached overlay on scroll. */ disable() { if (this._scrollSubscription) { this._scrollSubscription.unsubscribe(); this._scrollSubscription = null; } } detach() { this.disable(); this._overlayRef = null; } }; var NoopScrollStrategy = class { /** Does nothing, as this scroll strategy is a no-op. */ enable() { } /** Does nothing, as this scroll strategy is a no-op. */ disable() { } /** Does nothing, as this scroll strategy is a no-op. */ attach() { } }; function isElementScrolledOutsideView(element, scrollContainers) { return scrollContainers.some((containerBounds) => { const outsideAbove = element.bottom < containerBounds.top; const outsideBelow = element.top > containerBounds.bottom; const outsideLeft = element.right < containerBounds.left; const outsideRight = element.left > containerBounds.right; return outsideAbove || outsideBelow || outsideLeft || outsideRight; }); } function isElementClippedByScrolling(element, scrollContainers) { return scrollContainers.some((scrollContainerRect) => { const clippedAbove = element.top < scrollContainerRect.top; const clippedBelow = element.bottom > scrollContainerRect.bottom; const clippedLeft = element.left < scrollContainerRect.left; const clippedRight = element.right > scrollContainerRect.right; return clippedAbove || clippedBelow || clippedLeft || clippedRight; }); } var RepositionScrollStrategy = class { constructor(_scrollDispatcher, _viewportRuler, _ngZone, _config) { this._scrollDispatcher = _scrollDispatcher; this._viewportRuler = _viewportRuler; this._ngZone = _ngZone; this._config = _config; this._scrollSubscription = null; } /** Attaches this scroll strategy to an overlay. */ attach(overlayRef) { if (this._overlayRef && (typeof ngDevMode === "undefined" || ngDevMode)) { throw getMatScrollStrategyAlreadyAttachedError(); } this._overlayRef = overlayRef; } /** Enables repositioning of the attached overlay on scroll. */ enable() { if (!this._scrollSubscription) { const throttle = this._config ? this._config.scrollThrottle : 0; this._scrollSubscription = this._scrollDispatcher.scrolled(throttle).subscribe(() => { this._overlayRef.updatePosition(); if (this._config && this._config.autoClose) { const overlayRect = this._overlayRef.overlayElement.getBoundingClientRect(); const { width, height } = this._viewportRuler.getViewportSize(); const parentRects = [{ width, height, bottom: height, right: width, top: 0, left: 0 }]; if (isElementScrolledOutsideView(overlayRect, parentRects)) { this.disable(); this._ngZone.run(() => this._overlayRef.detach()); } } }); } } /** Disables repositioning of the attached overlay on scroll. */ disable() { if (this._scrollSubscription) { this._scrollSubscription.unsubscribe(); this._scrollSubscription = null; } } detach() { this.disable(); this._overlayRef = null; } }; var _ScrollStrategyOptions = class _ScrollStrategyOptions { constructor(_scrollDispatcher, _viewportRuler, _ngZone, document2) { this._scrollDispatcher = _scrollDispatcher; this._viewportRuler = _viewportRuler; this._ngZone = _ngZone; this.noop = () => new NoopScrollStrategy(); this.close = (config) => new CloseScrollStrategy(this._scrollDispatcher, this._ngZone, this._viewportRuler, config); this.block = () => new BlockScrollStrategy(this._viewportRuler, this._document); this.reposition = (config) => new RepositionScrollStrategy(this._scrollDispatcher, this._viewportRuler, this._ngZone, config); this._document = document2; } }; _ScrollStrategyOptions.ɵfac = function ScrollStrategyOptions_Factory(t) { return new (t || _ScrollStrategyOptions)(ɵɵinject(ScrollDispatcher), ɵɵinject(ViewportRuler), ɵɵinject(NgZone), ɵɵinject(DOCUMENT)); }; _ScrollStrategyOptions.ɵprov = ɵɵdefineInjectable({ token: _ScrollStrategyOptions, factory: _ScrollStrategyOptions.ɵfac, providedIn: "root" }); var ScrollStrategyOptions = _ScrollStrategyOptions; (() => { (typeof ngDevMode === "undefined" || ngDevMode) && setClassMetadata(ScrollStrategyOptions, [{ type: Injectable, args: [{ providedIn: "root" }] }], () => [{ type: ScrollDispatcher }, { type: ViewportRuler }, { type: NgZone }, { type: void 0, decorators: [{ type: Inject, args: [DOCUMENT] }] }], null); })(); var OverlayConfig = class { constructor(config) { this.scrollStrategy = new NoopScrollStrategy(); this.panelClass = ""; this.hasBackdrop = false; this.backdropClass = "cdk-overlay-dark-backdrop"; this.disposeOnNavigation = false; if (config) { const configKeys = Object.keys(config); for (const key of configKeys) { if (config[key] !== void 0) { this[key] = config[key]; } } } } }; var ConnectionPositionPair = class { constructor(origin, overlay, offsetX, offsetY, panelClass) { this.offsetX = offsetX; this.offsetY = offsetY; this.panelClass = panelClass; this.originX = origin.originX; this.originY = origin.originY; this.overlayX = overlay.overlayX; this.overlayY = overlay.overlayY; } }; var ConnectedOverlayPositionChange = class { constructor(connectionPair, scrollableViewProperties) { this.connectionPair = connectionPair; this.scrollableViewProperties = scrollableViewProperties; } }; function validateVerticalPosition(property, value) { if (value !== "top" && value !== "bottom" && value !== "center") { throw Error(`ConnectedPosition: Invalid ${property} "${value}". Expected "top", "bottom" or "center".`); } } function validateHorizontalPosition(property, value) { if (value !== "start" && value !== "end" && value !== "center") { throw Error(`ConnectedPosition: Invalid ${property} "${value}". Expected "start", "end" or "center".`); } } var _BaseOverlayDispatcher = class _BaseOverlayDispatcher { constructor(document2) { this._attachedOverlays = []; this._document = document2; } ngOnDestroy() { this.detach(); } /** Add a new overlay to the list of attached overlay refs. */ add(overlayRef) { this.remove(overlayRef); this._attachedOverlays.push(overlayRef); } /** Remove an overlay from the list of attached overlay refs. */ remove(overlayRef) { const index = this._attachedOverlays.indexOf(overlayRef); if (index > -1) { this._attachedOverlays.splice(index, 1); } if (this._attachedOverlays.length === 0) { this.detach(); } } }; _BaseOverlayDispatcher.ɵfac = function BaseOverlayDispatcher_Factory(t) { return new (t || _BaseOverlayDispatcher)(ɵɵinject(DOCUMENT)); }; _BaseOverlayDispatcher.ɵprov = ɵɵdefineInjectable({ token: _BaseOverlayDispatcher, factory: _BaseOverlayDispatcher.ɵfac, providedIn: "root" }); var BaseOverlayDispatcher = _BaseOverlayDispatcher; (() => { (typeof ngDevMode === "undefined" || ngDevMode) && setClassMetadata(BaseOverlayDispatcher, [{ type: Injectable, args: [{ providedIn: "root" }] }], () => [{ type: void 0, decorators: [{ type: Inject, args: [DOCUMENT] }] }], null); })(); var _OverlayKeyboardDispatcher = class _OverlayKeyboardDispatcher extends BaseOverlayDispatcher { constructor(document2, _ngZone) { super(document2); this._ngZone = _ngZone; this._keydownListener = (event) => { const overlays = this._attachedOverlays; for (let i = overlays.length - 1; i > -1; i--) { if (overlays[i]._keydownEvents.observers.length > 0) { const keydownEvents = overlays[i]._keydownEvents; if (this._ngZone) { this._ngZone.run(() => keydownEvents.next(event)); } else { keydownEvents.next(event); } break; } } }; } /** Add a new overlay to the list of attached overlay refs. */ add(overlayRef) { super.add(overlayRef); if (!this._isAttached) { if (this._ngZone) { this._ngZone.runOutsideAngular(() => this._document.body.addEventListener("keydown", this._keydownListener)); } else { this._document.body.addEventListener("keydown", this._keydownListener); } this._isAttached = true; } } /** Detaches the global keyboard event listener. */ detach() { if (this._isAttached) { this._document.body.removeEventListener("keydown", this._keydownListener); this._isAttached = false; } } }; _OverlayKeyboardDispatcher.ɵfac = function OverlayKeyboardDispatcher_Factory(t) { return new (t || _OverlayKeyboardDispatcher)(ɵɵinject(DOCUMENT), ɵɵinject(NgZone, 8)); }; _OverlayKeyboardDispatcher.ɵprov = ɵɵdefineInjectable({ token: _OverlayKeyboardDispatcher, factory: _OverlayKeyboardDispatcher.ɵfac, providedIn: "root" }); var OverlayKeyboardDispatcher = _OverlayKeyboardDispatcher; (() => { (typeof ngDevMode === "undefined" || ngDevMode) && setClassMetadata(OverlayKeyboardDispatcher, [{ type: Injectable, args: [{ providedIn: "root" }] }], () => [{ type: void 0, decorators: [{ type: Inject, args: [DOCUMENT] }] }, { type: NgZone, decorators: [{ type: Optional }] }], null); })(); var _OverlayOutsideClickDispatcher = class _OverlayOutsideClickDispatcher extends BaseOverlayDispatcher { constructor(document2, _platform, _ngZone) { super(document2); this._platform = _platform; this._ngZone = _ngZone; this._cursorStyleIsSet = false; this._pointerDownListener = (event) => { this._pointerDownEventTarget = _getEventTarget(event); }; this._clickListener = (event) => { const target = _getEventTarget(event); const origin = event.type === "click" && this._pointerDownEventTarget ? this._pointerDownEventTarget : target; this._pointerDownEventTarget = null; const overlays = this._attachedOverlays.slice(); for (let i = overlays.length - 1; i > -1; i--) { const overlayRef = overlays[i]; if (overlayRef._outsidePointerEvents.observers.length < 1 || !overlayRef.hasAttached()) { continue; } if (overlayRef.overlayElement.contains(target) || overlayRef.overlayElement.contains(origin)) { break; } const outsidePointerEvents = overlayRef._outsidePointerEvents; if (this._ngZone) { this._ngZone.run(() => outsidePointerEvents.next(event)); } else { outsidePointerEvents.next(event); } } }; } /** Add a new overlay to the list of attached overlay refs. */ add(overlayRef) { super.add(overlayRef); if (!this._isAttached) { const body = this._document.body; if (this._ngZone) { this._ngZone.runOutsideAngular(() => this._addEventListeners(body)); } else { this._addEventListeners(body); } if (this._platform.IOS && !this._cursorStyleIsSet) { this._cursorOriginalValue = body.style.cursor; body.style.cursor = "pointer"; this._cursorStyleIsSet = true; } this._isAttached = true; } } /** Detaches the global keyboard event listener. */ detach() { if (this._isAttached) { const body = this._document.body; body.removeEventListener("pointerdown", this._pointerDownListener, true); body.removeEventListener("click", this._clickListener, true); body.removeEventListener("auxclick", this._clickListener, true); body.removeEventListener("contextmenu", this._clickListener, true); if (this._platform.IOS && this._cursorStyleIsSet) { body.style.cursor = this._cursorOriginalValue; this._cursorStyleIsSet = false; } this._isAttached = false; } } _addEventListeners(body) { body.addEventListener("pointerdown", this._pointerDownListener, true); body.addEventListener("click", this._clickListener, true); body.addEventListener("auxclick", this._clickListener, true); body.addEventListener("contextmenu", this._clickListener, true); } }; _OverlayOutsideClickDispatcher.ɵfac = function OverlayOutsideClickDispatcher_Factory(t) { return new (t || _OverlayOutsideClickDispatcher)(ɵɵinject(DOCUMENT), ɵɵinject(Platform), ɵɵinject(NgZone, 8)); }; _OverlayOutsideClickDispatcher.ɵprov = ɵɵdefineInjectable({ token: _OverlayOutsideClickDispatcher, factory: _OverlayOutsideClickDispatcher.ɵfac, providedIn: "root" }); var OverlayOutsideClickDispatcher = _OverlayOutsideClickDispatcher; (() => { (typeof ngDevMode === "undefined" || ngDevMode) && setClassMetadata(OverlayOutsideClickDispatcher, [{ type: Injectable, args: [{ providedIn: "root" }] }], () => [{ type: void 0, decorators: [{ type: Inject, args: [DOCUMENT] }] }, { type: Platform }, { type: NgZone, decorators: [{ type: Optional }] }], null); })(); var _OverlayContainer = class _OverlayContainer { constructor(document2, _platform) { this._platform = _platform; this._document = document2; } ngOnDestroy() { this._containerElement?.remove(); } /** * This method returns the overlay container element. It will lazily * create the element the first time it is called to facilitate using * the container in non-browser environments. * @returns the container element */ getContainerElement() { if (!this._containerElement) { this._createContainer(); } return this._containerElement; } /** * Create the overlay container element, which is simply a div * with the 'cdk-overlay-container' class on the document body. */ _createContainer() { const containerClass = "cdk-overlay-container"; if (this._platform.isBrowser || _isTestEnvironment()) { const oppositePlatformContainers = this._document.querySelectorAll(`.${containerClass}[platform="server"], .${containerClass}[platform="test"]`); for (let i = 0; i < oppositePlatformContainers.length; i++) { oppositePlatformContainers[i].remove(); } } const container = this._document.createElement("div"); container.classList.add(containerClass); if (_isTestEnvironment()) { container.setAttribute("platform", "test"); } else if (!this._platform.isBrowser) { container.setAttribute("platform", "server"); } this._document.body.appendChild(container); this._containerElement = container; } }; _OverlayContainer.ɵfac = function OverlayContainer_Factory(t) { return new (t || _OverlayContainer)(ɵɵinject(DOCUMENT), ɵɵinject(Platform)); }; _OverlayContainer.ɵprov = ɵɵdefineInjectable({ token: _OverlayContainer, factory: _OverlayContainer.ɵfac, providedIn: "root" }); var OverlayContainer = _OverlayContainer; (() => { (typeof ngDevMode === "undefined" || ngDevMode) && setClassMetadata(OverlayContainer, [{ type: Injectable, args: [{ providedIn: "root" }] }], () => [{ type: void 0, decorators: [{ type: Inject, args: [DOCUMENT] }] }, { type: Platform }], null); })(); var OverlayRef = class { constructor(_portalOutlet, _host, _pane, _config, _ngZone, _keyboardDispatcher, _document, _location, _outsideClickDispatcher, _animationsDisabled = false) { this._portalOutlet = _portalOutlet; this._host = _host; this._pane = _pane; this._config = _config; this._ngZone = _ngZone; this._keyboardDispatcher = _keyboardDispatcher; this._document = _document; this._location = _location; this._outsideClickDispatcher = _outsideClickDispatcher; this._animationsDisabled = _animationsDisabled; this._backdropElement = null; this._backdropClick = new Subject(); this._attachments = new Subject(); this._detachments = new Subject(); this._locationChanges = Subscription.EMPTY; this._backdropClickHandler = (event) => this._backdropClick.next(event); this._backdropTransitionendHandler = (event) => { this._disposeBackdrop(event.target); }; this._keydownEvents = new Subject(); this._outsidePointerEvents = new Subject(); if (_config.scrollStrategy) { this._scrollStrategy = _config.scrollStrategy; this._scrollStrategy.attach(this); } this._positionStrategy = _config.positionStrategy; } /** The overlay's HTML element */ get overlayElement() { return this._pane; } /** The overlay's backdrop HTML element. */ get backdropElement() { return this._backdropElement; } /** * Wrapper around the panel element. Can be used for advanced * positioning where a wrapper with specific styling is * required around the overlay pane. */ get hostElement() { return this._host; } /** * Attaches content, given via a Portal, to the overlay. * If the overlay is configured to have a backdrop, it will be created. * * @param portal Portal instance to which to attach the overlay. * @returns The portal attachment result. */ attach(portal) { if (!this._host.parentElement && this._previousHostParent) { this._previousHostParent.appendChild(this._host); } const attachResult = this._portalOutlet.attach(portal); if (this._positionStrategy) { this._positionStrategy.attach(this); } this._updateStackingOrder(); this._updateElementSize(); this._updateElementDirection(); if (this._scrollStrategy) { this._scrollStrategy.enable(); } this._ngZone.onStable.pipe(take(1)).subscribe(() => { if (this.hasAttached()) { this.updatePosition(); } }); this._togglePointerEvents(true); if (this._config.hasBackdrop) { this._attachBackdrop(); } if (this._config.panelClass) { this._toggleClasses(this._pane, this._config.panelClass, true); } this._attachments.next(); this._keyboardDispatcher.add(this); if (this._config.disposeOnNavigation) { this._locationChanges = this._location.subscribe(() => this.dispose()); } this._outsideClickDispatcher.add(this); if (typeof attachResult?.onDestroy === "function") { attachResult.onDestroy(() => { if (this.hasAttached()) { this._ngZone.runOutsideAngular(() => Promise.resolve().then(() => this.detach())); } }); } return attachResult; } /** * Detaches an overlay from a portal. * @returns The portal detachment result. */ detach() { if (!this.hasAttached()) { return; } this.detachBackdrop(); this._togglePointerEvents(false); if (this._positionStrategy && this._positionStrategy.detach) { this._positionStrategy.detach(); } if (this._scrollStrategy) { this._scrollStrategy.disable(); } const detachmentResult = this._portalOutlet.detach(); this._detachments.next(); this._keyboardDispatcher.remove(this); this._detachContentWhenStable(); this._locationChanges.unsubscribe(); this._outsideClickDispatcher.remove(this); return detachmentResult; } /** Cleans up the overlay from the DOM. */ dispose() { const isAttached = this.hasAttached(); if (this._positionStrategy) { this._positionStrategy.dispose(); } this._disposeScrollStrategy(); this._disposeBackdrop(this._backdropElement); this._locationChanges.unsubscribe(); this._keyboardDispatcher.remove(this); this._portalOutlet.dispose(); this._attachments.complete(); this._backdropClick.complete(); this._keydownEvents.complete(); this._outsidePointerEvents.complete(); this._outsideClickDispatcher.remove(this); this._host?.remove(); this._previousHostParent = this._pane = this._host = null; if (isAttached) { this._detachments.next(); } this._detachments.complete(); } /** Whether the overlay has attached content. */ hasAttached() { return this._portalOutlet.hasAttached(); } /** Gets an observable that emits when the backdrop has been clicked. */ backdropClick() { return this._backdropClick; } /** Gets an observable that emits when the overlay has been attached. */ attachments() { return this._attachments; } /** Gets an observable that emits when the overlay has been detached. */ detachments() { return this._detachments; } /** Gets an observable of keydown events targeted to this overlay. */ keydownEvents() { return this._keydownEvents; } /** Gets an observable of pointer events targeted outside this overlay. */ outsidePointerEvents() { return this._outsidePointerEvents; } /** Gets the current overlay configuration, which is immutable. */ getConfig() { return this._config; } /** Updates the position of the overlay based on the position strategy. */ updatePosition() { if (this._positionStrategy) { this._positionStrategy.apply(); } } /** Switches to a new position strategy and updates the overlay position. */ updatePositionStrategy(strategy) { if (strategy === this._positionStrategy) { return; } if (this._positionStrategy) { this._positionStrategy.dispose(); } this._positionStrategy = strategy; if (this.hasAttached()) { strategy.attach(this); this.updatePosition(); } } /** Update the size properties of the overlay. */ updateSize(sizeConfig) { this._config = __spreadValues(__spreadValues({}, this._config), sizeConfig); this._updateElementSize(); } /** Sets the LTR/RTL direction for the overlay. */ setDirection(dir) { this._config = __spreadProps(__spreadValues({}, this._config), { direction: dir }); this._updateElementDirection(); } /** Add a CSS class or an array of classes to the overlay pane. */ addPanelClass(classes) { if (this._pane) { this._toggleClasses(this._pane, classes, true); } } /** Remove a CSS class or an array of classes from the overlay pane. */ removePanelClass(classes) { if (this._pane) { this._toggleClasses(this._pane, classes, false); } } /** * Returns the layout direction of the overlay panel. */ getDirection() { const direction = this._config.direction; if (!direction) { return "ltr"; } return typeof direction === "string" ? direction : direction.value; } /** Switches to a new scroll strategy. */ updateScrollStrategy(strategy) { if (strategy === this._scrollStrategy) { return; } this._disposeScrollStrategy(); this._scrollStrategy = strategy; if (this.hasAttached()) { strategy.attach(this); strategy.enable(); } } /** Updates the text direction of the overlay panel. */ _updateElementDirection() { this._host.setAttribute("dir", this.getDirection()); } /** Updates the size of the overlay element based on the overlay config. */ _updateElementSize() { if (!this._pane) { return; } const style2 = this._pane.style; style2.width = coerceCssPixelValue(this._config.width); style2.height = coerceCssPixelValue(this._config.height); style2.minWidth = coerceCssPixelValue(this._config.minWidth); style2.minHeight = coerceCssPixelValue(this._config.minHeight); style2.maxWidth = coerceCssPixelValue(this._config.maxWidth); style2.maxHeight = coerceCssPixelValue(this._config.maxHeight); } /** Toggles the pointer events for the overlay pane element. */ _togglePointerEvents(enablePointer) { this._pane.style.pointerEvents = enablePointer ? "" : "none"; } /** Attaches a backdrop for this overlay. */ _attachBackdrop() { const showingClass = "cdk-overlay-backdrop-showing"; this._backdropElement = this._document.createElement("div"); this._backdropElement.classList.add("cdk-overlay-backdrop"); if (this._animationsDisabled) { this._backdropElement.classList.add("cdk-overlay-backdrop-noop-animation"); } if (this._config.backdropClass) { this._toggleClasses(this._backdropElement, this._config.backdropClass, true); } this._host.parentElement.insertBefore(this._backdropElement, this._host); this._backdropElement.addEventListener("click", this._backdropClickHandler); if (!this._animationsDisabled && typeof requestAnimationFrame !== "undefined") { this._ngZone.runOutsideAngular(() => { requestAnimationFrame(() => { if (this._backdropElement) { this._backdropElement.classList.add(showingClass); } }); }); } else { this._backdropElement.classList.add(showingClass); } } /** * Updates the stacking order of the element, moving it to the top if necessary. * This is required in cases where one overlay was detached, while another one, * that should be behind it, was destroyed. The next time both of them are opened, * the stacking will be wrong, because the detached element's pane will still be * in its original DOM position. */ _updateStackingOrder() { if (this._host.nextSibling) { this._host.parentNode.appendChild(this._host); } } /** Detaches the backdrop (if any) associated with the overlay. */ detachBackdrop() { const backdropToDetach = this._backdropElement; if (!backdropToDetach) { return; } if (this._animationsDisabled) { this._disposeBackdrop(backdropToDetach); return; } backdropToDetach.classList.remove("cdk-overlay-backdrop-showing"); this._ngZone.runOutsideAngular(() => { backdropToDetach.addEventListener("transitionend", this._backdropTransitionendHandler); }); backdropToDetach.style.pointerEvents = "none"; this._backdropTimeout = this._ngZone.runOutsideAngular(() => setTimeout(() => { this._disposeBackdrop(backdropToDetach); }, 500)); } /** Toggles a single CSS class or an array of classes on an element. */ _toggleClasses(element, cssClasses, isAdd) { const classes = coerceArray(cssClasses || []).filter((c) => !!c); if (classes.length) { isAdd ? element.classList.add(...classes) : element.classList.remove(...classes); } } /** Detaches the overlay content next time the zone stabilizes. */ _detachContentWhenStable() { this._ngZone.runOutsideAngular(() => { const subscription = this._ngZone.onStable.pipe(takeUntil(merge(this._attachments, this._detachments))).subscribe(() => { if (!this._pane || !this._host || this._pane.children.length === 0) { if (this._pane && this._config.panelClass) { this._toggleClasses(this._pane, this._config.panelClass, false); } if (this._host && this._host.parentElement) { this._previousHostParent = this._host.parentElement; this._host.remove(); } subscription.unsubscribe(); } }); }); } /** Disposes of a scroll strategy. */ _disposeScrollStrategy() { const scrollStrategy = this._scrollStrategy; if (scrollStrategy) { scrollStrategy.disable(); if (scrollStrategy.detach) { scrollStrategy.detach(); } } } /** Removes a backdrop element from the DOM. */ _disposeBackdrop(backdrop) { if (backdrop) { backdrop.removeEventListener("click", this._backdropClickHandler); backdrop.removeEventListener("transitionend", this._backdropTransitionendHandler); backdrop.remove(); if (this._backdropElement === backdrop) { this._backdropElement = null; } } if (this._backdropTimeout) { clearTimeout(this._backdropTimeout); this._backdropTimeout = void 0; } } }; var boundingBoxClass = "cdk-overlay-connected-position-bounding-box"; var cssUnitPattern = /([A-Za-z%]+)$/; var FlexibleConnectedPositionStrategy = class { /** Ordered list of preferred positions, from most to least desirable. */ get positions() { return this._preferredPositions; } constructor(connectedTo, _viewportRuler, _document, _platform, _overlayContainer) { this._viewportRuler = _viewportRuler; this._document = _document; this._platform = _platform; this._overlayContainer = _overlayContainer; this._lastBoundingBoxSize = { width: 0, height: 0 }; this._isPushed = false; this._canPush = true; this._growAfterOpen = false; this._hasFlexibleDimensions = true; this._positionLocked = false; this._viewportMargin = 0; this._scrollables = []; this._preferredPositions = []; this._positionChanges = new Subject(); this._resizeSubscription = Subscription.EMPTY; this._offsetX = 0; this._offsetY = 0; this._appliedPanelClasses = []; this.positionChanges = this._positionChanges; this.setOrigin(connectedTo); } /** Attaches this position strategy to an overlay. */ attach(overlayRef) { if (this._overlayRef && overlayRef !== this._overlayRef && (typeof ngDevMode === "undefined" || ngDevMode)) { throw Error("This position strategy is already attached to an overlay"); } this._validatePositions(); overlayRef.hostElement.classList.add(boundingBoxClass); this._overlayRef = overlayRef; this._boundingBox = overlayRef.hostElement; this._pane = overlayRef.overlayElement; this._isDisposed = false; this._isInitialRender = true; this._lastPosition = null; this._resizeSubscription.unsubscribe(); this._resizeSubscription = this._viewportRuler.change().subscribe(() => { this._isInitialRender = true; this.apply(); }); } /** * Updates the position of the overlay element, using whichever preferred position relative * to the origin best fits on-screen. * * The selection of a position goes as follows: * - If any positions fit completely within the viewport as-is, * choose the first position that does so. * - If flexible dimensions are enabled and at least one satisfies the given minimum width/height, * choose the position with the greatest available size modified by the positions' weight. * - If pushing is enabled, take the position that went off-screen the least and push it * on-screen. * - If none of the previous criteria were met, use the position that goes off-screen the least. * @docs-private */ apply() { if (this._isDisposed || !this._platform.isBrowser) { return; } if (!this._isInitialRender && this._positionLocked && this._lastPosition) { this.reapplyLastPosition(); return; } this._clearPanelClasses(); this._resetOverlayElementStyles(); this._resetBoundingBoxStyles(); this._viewportRect = this._getNarrowedViewportRect(); this._originRect = this._getOriginRect(); this._overlayRect = this._pane.getBoundingClientRect(); this._containerRect = this._overlayContainer.getContainerElement().getBoundingClientRect(); const originRect = this._originRect; const overlayRect = this._overlayRect; const viewportRect = this._viewportRect; const containerRect = this._containerRect; const flexibleFits = []; let fallback; for (let pos of this._preferredPositions) { let originPoint = this._getOriginPoint(originRect, containerRect, pos); let overlayPoint = this._getOverlayPoint(originPoint, overlayRect, pos); let overlayFit = this._getOverlayFit(overlayPoint, overlayRect, viewportRect, pos); if (overlayFit.isCompletelyWithinViewport) { this._isPushed = false; this._applyPosition(pos, originPoint); return; } if (this._canFitWithFlexibleDimensions(overlayFit, overlayPoint, viewportRect)) { flexibleFits.push({ position: pos, origin: originPoint, overlayRect, boundingBoxRect: this._calculateBoundingBoxRect(originPoint, pos) }); continue; } if (!fallback || fallback.overlayFit.visibleArea < overlayFit.visibleArea) { fallback = { overlayFit, overlayPoint, originPoint, position: pos, overlayRect }; } } if (flexibleFits.length) { let bestFit = null; let bestScore = -1; for (const fit of flexibleFits) { const score = fit.boundingBoxRect.width * fit.boundingBoxRect.height * (fit.position.weight || 1); if (score > bestScore) { bestScore = score; bestFit = fit; } } this._isPushed = false; this._applyPosition(bestFit.position, bestFit.origin); return; } if (this._canPush) { this._isPushed = true; this._applyPosition(fallback.position, fallback.originPoint); return; } this._applyPosition(fallback.position, fallback.originPoint); } detach() { this._clearPanelClasses(); this._lastPosition = null; this._previousPushAmount = null; this._resizeSubscription.unsubscribe(); } /** Cleanup after the element gets destroyed. */ dispose() { if (this._isDisposed) { return; } if (this._boundingBox) { extendStyles(this._boundingBox.style, { top: "", left: "", right: "", bottom: "", height: "", width: "", alignItems: "", justifyContent: "" }); } if (this._pane) { this._resetOverlayElementStyles(); } if (this._overlayRef) { this._overlayRef.hostElement.classList.remove(boundingBoxClass); } this.detach(); this._positionChanges.complete(); this._overlayRef = this._boundingBox = null; this._isDisposed = true; } /** * This re-aligns the overlay element with the trigger in its last calculated position, * even if a position higher in the "preferred positions" list would now fit. This * allows one to re-align the panel without changing the orientation of the panel. */ reapplyLastPosition() { if (this._isDisposed || !this._platform.isBrowser) { return; } const lastPosition = this._lastPosition; if (lastPosition) { this._originRect = this._getOriginRect(); this._overlayRect = this._pane.getBoundingClientRect(); this._viewportRect = this._getNarrowedViewportRect(); this._containerRect = this._overlayContainer.getContainerElement().getBoundingClientRect(); const originPoint = this._getOriginPoint(this._originRect, this._containerRect, lastPosition); this._applyPosition(lastPosition, originPoint); } else { this.apply(); } } /** * Sets the list of Scrollable containers that host the origin element so that * on reposition we can evaluate if it or the overlay has been clipped or outside view. Every * Scrollable must be an ancestor element of the strategy's origin element. */ withScrollableContainers(scrollables) { this._scrollables = scrollables; return this; } /** * Adds new preferred positions. * @param positions List of positions options for this overlay. */ withPositions(positions) { this._preferredPositions = positions; if (positions.indexOf(this._lastPosition) === -1) { this._lastPosition = null; } this._validatePositions(); return this; } /** * Sets a minimum distance the overlay may be positioned to the edge of the viewport. * @param margin Required margin between the overlay and the viewport edge in pixels. */ withViewportMargin(margin) { this._viewportMargin = margin; return this; } /** Sets whether the overlay's width and height can be constrained to fit within the viewport. */ withFlexibleDimensions(flexibleDimensions = true) { this._hasFlexibleDimensions = flexibleDimensions; return this; } /** Sets whether the overlay can grow after the initial open via flexible width/height. */ withGrowAfterOpen(growAfterOpen = true) { this._growAfterOpen = growAfterOpen; return this; } /** Sets whether the overlay can be pushed on-screen if none of the provided positions fit. */ withPush(canPush = true) { this._canPush = canPush; return this; } /** * Sets whether the overlay's position should be locked in after it is positioned * initially. When an overlay is locked in, it won't attempt to reposition itself * when the position is re-applied (e.g. when the user scrolls away). * @param isLocked Whether the overlay should locked in. */ withLockedPosition(isLocked = true) { this._positionLocked = isLocked; return this; } /** * Sets the origin, relative to which to position the overlay. * Using an element origin is useful for building components that need to be positioned * relatively to a trigger (e.g. dropdown menus or tooltips), whereas using a point can be * used for cases like contextual menus which open relative to the user's pointer. * @param origin Reference to the new origin. */ setOrigin(origin) { this._origin = origin; return this; } /** * Sets the default offset for the overlay's connection point on the x-axis. * @param offset New offset in the X axis. */ withDefaultOffsetX(offset) { this._offsetX = offset; return this; } /** * Sets the default offset for the overlay's connection point on the y-axis. * @param offset New offset in the Y axis. */ withDefaultOffsetY(offset) { this._offsetY = offset; return this; } /** * Configures that the position strategy should set a `transform-origin` on some elements * inside the overlay, depending on the current position that is being applied. This is * useful for the cases where the origin of an animation can change depending on the * alignment of the overlay. * @param selector CSS selector that will be used to find the target * elements onto which to set the transform origin. */ withTransformOriginOn(selector) { this._transformOriginSelector = selector; return this; } /** * Gets the (x, y) coordinate of a connection point on the origin based on a relative position. */ _getOriginPoint(originRect, containerRect, pos) { let x; if (pos.originX == "center") { x = originRect.left + originRect.width / 2; } else { const startX = this._isRtl() ? originRect.right : originRect.left; const endX = this._isRtl() ? originRect.left : originRect.right; x = pos.originX == "start" ? startX : endX; } if (containerRect.left < 0) { x -= containerRect.left; } let y; if (pos.originY == "center") { y = originRect.top + originRect.height / 2; } else { y = pos.originY == "top" ? originRect.top : originRect.bottom; } if (containerRect.top < 0) { y -= containerRect.top; } return { x, y }; } /** * Gets the (x, y) coordinate of the top-left corner of the overlay given a given position and * origin point to which the overlay should be connected. */ _getOverlayPoint(originPoint, overlayRect, pos) { let overlayStartX; if (pos.overlayX == "center") { overlayStartX = -overlayRect.width / 2; } else if (pos.overlayX === "start") { overlayStartX = this._isRtl() ? -overlayRect.width : 0; } else { overlayStartX = this._isRtl() ? 0 : -overlayRect.width; } let overlayStartY; if (pos.overlayY == "center") { overlayStartY = -overlayRect.height / 2; } else { overlayStartY = pos.overlayY == "top" ? 0 : -overlayRect.height; } return { x: originPoint.x + overlayStartX, y: originPoint.y + overlayStartY }; } /** Gets how well an overlay at the given point will fit within the viewport. */ _getOverlayFit(point, rawOverlayRect, viewport, position) { const overlay = getRoundedBoundingClientRect(rawOverlayRect); let { x, y } = point; let offsetX = this._getOffset(position, "x"); let offsetY = this._getOffset(position, "y"); if (offsetX) { x += offsetX; } if (offsetY) { y += offsetY; } let leftOverflow = 0 - x; let rightOverflow = x + overlay.width - viewport.width; let topOverflow = 0 - y; let bottomOverflow = y + overlay.height - viewport.height; let visibleWidth = this._subtractOverflows(overlay.width, leftOverflow, rightOverflow); let visibleHeight = this._subtractOverflows(overlay.height, topOverflow, bottomOverflow); let visibleArea = visibleWidth * visibleHeight; return { visibleArea, isCompletelyWithinViewport: overlay.width * overlay.height === visibleArea, fitsInViewportVertically: visibleHeight === overlay.height, fitsInViewportHorizontally: visibleWidth == overlay.width }; } /** * Whether the overlay can fit within the viewport when it may resize either its width or height. * @param fit How well the overlay fits in the viewport at some position. * @param point The (x, y) coordinates of the overlay at some position. * @param viewport The geometry of the viewport. */ _canFitWithFlexibleDimensions(fit, point, viewport) { if (this._hasFlexibleDimensions) { const availableHeight = viewport.bottom - point.y; const availableWidth = viewport.right - point.x; const minHeight = getPixelValue(this._overlayRef.getConfig().minHeight); const minWidth = getPixelValue(this._overlayRef.getConfig().minWidth); const verticalFit = fit.fitsInViewportVertically || minHeight != null && minHeight <= availableHeight; const horizontalFit = fit.fitsInViewportHorizontally || minWidth != null && minWidth <= availableWidth; return verticalFit && horizontalFit; } return false; } /** * Gets the point at which the overlay can be "pushed" on-screen. If the overlay is larger than * the viewport, the top-left corner will be pushed on-screen (with overflow occurring on the * right and bottom). * * @param start Starting point from which the overlay is pushed. * @param rawOverlayRect Dimensions of the overlay. * @param scrollPosition Current viewport scroll position. * @returns The point at which to position the overlay after pushing. This is effectively a new * originPoint. */ _pushOverlayOnScreen(start, rawOverlayRect, scrollPosition) { if (this._previousPushAmount && this._positionLocked) { return { x: start.x + this._previousPushAmount.x, y: start.y + this._previousPushAmount.y }; } const overlay = getRoundedBoundingClientRect(rawOverlayRect); const viewport = this._viewportRect; const overflowRight = Math.max(start.x + overlay.width - viewport.width, 0); const overflowBottom = Math.max(start.y + overlay.height - viewport.height, 0); const overflowTop = Math.max(viewport.top - scrollPosition.top - start.y, 0); const overflowLeft = Math.max(viewport.left - scrollPosition.left - start.x, 0); let pushX = 0; let pushY = 0; if (overlay.width <= viewport.width) { pushX = overflowLeft || -overflowRight; } else { pushX = start.x < this._viewportMargin ? viewport.left - scrollPosition.left - start.x : 0; } if (overlay.height <= viewport.height) { pushY = overflowTop || -overflowBottom; } else { pushY = start.y < this._viewportMargin ? viewport.top - scrollPosition.top - start.y : 0; } this._previousPushAmount = { x: pushX, y: pushY }; return { x: start.x + pushX, y: start.y + pushY }; } /** * Applies a computed position to the overlay and emits a position change. * @param position The position preference * @param originPoint The point on the origin element where the overlay is connected. */ _applyPosition(position, originPoint) { this._setTransformOrigin(position); this._setOverlayElementStyles(originPoint, position); this._setBoundingBoxStyles(originPoint, position); if (position.panelClass) { this._addPanelClasses(position.panelClass); } this._lastPosition = position; if (this._positionChanges.observers.length) { const scrollableViewProperties = this._getScrollVisibility(); const changeEvent = new ConnectedOverlayPositionChange(position, scrollableViewProperties); this._positionChanges.next(changeEvent); } this._isInitialRender = false; } /** Sets the transform origin based on the configured selector and the passed-in position. */ _setTransformOrigin(position) { if (!this._transformOriginSelector) { return; } const elements = this._boundingBox.querySelectorAll(this._transformOriginSelector); let xOrigin; let yOrigin = position.overlayY; if (position.overlayX === "center") { xOrigin = "center"; } else if (this._isRtl()) { xOrigin = position.overlayX === "start" ? "right" : "left"; } else { xOrigin = position.overlayX === "start" ? "left" : "right"; } for (let i = 0; i < elements.length; i++) { elements[i].style.transformOrigin = `${xOrigin} ${yOrigin}`; } } /** * Gets the position and size of the overlay's sizing container. * * This method does no measuring and applies no styles so that we can cheaply compute the * bounds for all positions and choose the best fit based on these results. */ _calculateBoundingBoxRect(origin, position) { const viewport = this._viewportRect; const isRtl = this._isRtl(); let height, top, bottom; if (position.overlayY === "top") { top = origin.y; height = viewport.height - top + this._viewportMargin; } else if (position.overlayY === "bottom") { bottom = viewport.height - origin.y + this._viewportMargin * 2; height = viewport.height - bottom + this._viewportMargin; } else { const smallestDistanceToViewportEdge = Math.min(viewport.bottom - origin.y + viewport.top, origin.y); const previousHeight = this._lastBoundingBoxSize.height; height = smallestDistanceToViewportEdge * 2; top = origin.y - smallestDistanceToViewportEdge; if (height > previousHeight && !this._isInitialRender && !this._growAfterOpen) { top = origin.y - previousHeight / 2; } } const isBoundedByRightViewportEdge = position.overlayX === "start" && !isRtl || position.overlayX === "end" && isRtl; const isBoundedByLeftViewportEdge = position.overlayX === "end" && !isRtl || position.overlayX === "start" && isRtl; let width, left, right; if (isBoundedByLeftViewportEdge) { right = viewport.width - origin.x + this._viewportMargin; width = origin.x - this._viewportMargin; } else if (isBoundedByRightViewportEdge) { left = origin.x; width = viewport.right - origin.x; } else { const smallestDistanceToViewportEdge = Math.min(viewport.right - origin.x + viewport.left, origin.x); const previousWidth = this._lastBoundingBoxSize.width; width = smallestDistanceToViewportEdge * 2; left = origin.x - smallestDistanceToViewportEdge; if (width > previousWidth && !this._isInitialRender && !this._growAfterOpen) { left = origin.x - previousWidth / 2; } } return { top, left, bottom, right, width, height }; } /** * Sets the position and size of the overlay's sizing wrapper. The wrapper is positioned on the * origin's connection point and stretches to the bounds of the viewport. * * @param origin The point on the origin element where the overlay is connected. * @param position The position preference */ _setBoundingBoxStyles(origin, position) { const boundingBoxRect = this._calculateBoundingBoxRect(origin, position); if (!this._isInitialRender && !this._growAfterOpen) { boundingBoxRect.height = Math.min(boundingBoxRect.height, this._lastBoundingBoxSize.height); boundingBoxRect.width = Math.min(boundingBoxRect.width, this._lastBoundingBoxSize.width); } const styles = {}; if (this._hasExactPosition()) { styles.top = styles.left = "0"; styles.bottom = styles.right = styles.maxHeight = styles.maxWidth = ""; styles.width = styles.height = "100%"; } else { const maxHeight = this._overlayRef.getConfig().maxHeight; const maxWidth = this._overlayRef.getConfig().maxWidth; styles.height = coerceCssPixelValue(boundingBoxRect.height); styles.top = coerceCssPixelValue(boundingBoxRect.top); styles.bottom = coerceCssPixelValue(boundingBoxRect.bottom); styles.width = coerceCssPixelValue(boundingBoxRect.width); styles.left = coerceCssPixelValue(boundingBoxRect.left); styles.right = coerceCssPixelValue(boundingBoxRect.right); if (position.overlayX === "center") { styles.alignItems = "center"; } else { styles.alignItems = position.overlayX === "end" ? "flex-end" : "flex-start"; } if (position.overlayY === "center") { styles.justifyContent = "center"; } else { styles.justifyContent = position.overlayY === "bottom" ? "flex-end" : "flex-start"; } if (maxHeight) { styles.maxHeight = coerceCssPixelValue(maxHeight); } if (maxWidth) { styles.maxWidth = coerceCssPixelValue(maxWidth); } } this._lastBoundingBoxSize = boundingBoxRect; extendStyles(this._boundingBox.style, styles); } /** Resets the styles for the bounding box so that a new positioning can be computed. */ _resetBoundingBoxStyles() { extendStyles(this._boundingBox.style, { top: "0", left: "0", right: "0", bottom: "0", height: "", width: "", alignItems: "", justifyContent: "" }); } /** Resets the styles for the overlay pane so that a new positioning can be computed. */ _resetOverlayElementStyles() { extendStyles(this._pane.style, { top: "", left: "", bottom: "", right: "", position: "", transform: "" }); } /** Sets positioning styles to the overlay element. */ _setOverlayElementStyles(originPoint, position) { const styles = {}; const hasExactPosition = this._hasExactPosition(); const hasFlexibleDimensions = this._hasFlexibleDimensions; const config = this._overlayRef.getConfig(); if (hasExactPosition) { const scrollPosition = this._viewportRuler.getViewportScrollPosition(); extendStyles(styles, this._getExactOverlayY(position, originPoint, scrollPosition)); extendStyles(styles, this._getExactOverlayX(position, originPoint, scrollPosition)); } else { styles.position = "static"; } let transformString = ""; let offsetX = this._getOffset(position, "x"); let offsetY = this._getOffset(position, "y"); if (offsetX) { transformString += `translateX(${offsetX}px) `; } if (offsetY) { transformString += `translateY(${offsetY}px)`; } styles.transform = transformString.trim(); if (config.maxHeight) { if (hasExactPosition) { styles.maxHeight = coerceCssPixelValue(config.maxHeight); } else if (hasFlexibleDimensions) { styles.maxHeight = ""; } } if (config.maxWidth) { if (hasExactPosition) { styles.maxWidth = coerceCssPixelValue(config.maxWidth); } else if (hasFlexibleDimensions) { styles.maxWidth = ""; } } extendStyles(this._pane.style, styles); } /** Gets the exact top/bottom for the overlay when not using flexible sizing or when pushing. */ _getExactOverlayY(position, originPoint, scrollPosition) { let styles = { top: "", bottom: "" }; let overlayPoint = this._getOverlayPoint(originPoint, this._overlayRect, position); if (this._isPushed) { overlayPoint = this._pushOverlayOnScreen(overlayPoint, this._overlayRect, scrollPosition); } if (position.overlayY === "bottom") { const documentHeight = this._document.documentElement.clientHeight; styles.bottom = `${documentHeight - (overlayPoint.y + this._overlayRect.height)}px`; } else { styles.top = coerceCssPixelValue(overlayPoint.y); } return styles; } /** Gets the exact left/right for the overlay when not using flexible sizing or when pushing. */ _getExactOverlayX(position, originPoint, scrollPosition) { let styles = { left: "", right: "" }; let overlayPoint = this._getOverlayPoint(originPoint, this._overlayRect, position); if (this._isPushed) { overlayPoint = this._pushOverlayOnScreen(overlayPoint, this._overlayRect, scrollPosition); } let horizontalStyleProperty; if (this._isRtl()) { horizontalStyleProperty = position.overlayX === "end" ? "left" : "right"; } else { horizontalStyleProperty = position.overlayX === "end" ? "right" : "left"; } if (horizontalStyleProperty === "right") { const documentWidth = this._document.documentElement.clientWidth; styles.right = `${documentWidth - (overlayPoint.x + this._overlayRect.width)}px`; } else { styles.left = coerceCssPixelValue(overlayPoint.x); } return styles; } /** * Gets the view properties of the trigger and overlay, including whether they are clipped * or completely outside the view of any of the strategy's scrollables. */ _getScrollVisibility() { const originBounds = this._getOriginRect(); const overlayBounds = this._pane.getBoundingClientRect(); const scrollContainerBounds = this._scrollables.map((scrollable) => { return scrollable.getElementRef().nativeElement.getBoundingClientRect(); }); return { isOriginClipped: isElementClippedByScrolling(originBounds, scrollContainerBounds), isOriginOutsideView: isElementScrolledOutsideView(originBounds, scrollContainerBounds), isOverlayClipped: isElementClippedByScrolling(overlayBounds, scrollContainerBounds), isOverlayOutsideView: isElementScrolledOutsideView(overlayBounds, scrollContainerBounds) }; } /** Subtracts the amount that an element is overflowing on an axis from its length. */ _subtractOverflows(length, ...overflows) { return overflows.reduce((currentValue, currentOverflow) => { return currentValue - Math.max(currentOverflow, 0); }, length); } /** Narrows the given viewport rect by the current _viewportMargin. */ _getNarrowedViewportRect() { const width = this._document.documentElement.clientWidth; const height = this._document.documentElement.clientHeight; const scrollPosition = this._viewportRuler.getViewportScrollPosition(); return { top: scrollPosition.top + this._viewportMargin, left: scrollPosition.left + this._viewportMargin, right: scrollPosition.left + width - this._viewportMargin, bottom: scrollPosition.top + height - this._viewportMargin, width: width - 2 * this._viewportMargin, height: height - 2 * this._viewportMargin }; } /** Whether the we're dealing with an RTL context */ _isRtl() { return this._overlayRef.getDirection() === "rtl"; } /** Determines whether the overlay uses exact or flexible positioning. */ _hasExactPosition() { return !this._hasFlexibleDimensions || this._isPushed; } /** Retrieves the offset of a position along the x or y axis. */ _getOffset(position, axis) { if (axis === "x") { return position.offsetX == null ? this._offsetX : position.offsetX; } return position.offsetY == null ? this._offsetY : position.offsetY; } /** Validates that the current position match the expected values. */ _validatePositions() { if (typeof ngDevMode === "undefined" || ngDevMode) { if (!this._preferredPositions.length) { throw Error("FlexibleConnectedPositionStrategy: At least one position is required."); } this._preferredPositions.forEach((pair) => { validateHorizontalPosition("originX", pair.originX); validateVerticalPosition("originY", pair.originY); validateHorizontalPosition("overlayX", pair.overlayX); validateVerticalPosition("overlayY", pair.overlayY); }); } } /** Adds a single CSS class or an array of classes on the overlay panel. */ _addPanelClasses(cssClasses) { if (this._pane) { coerceArray(cssClasses).forEach((cssClass) => { if (cssClass !== "" && this._appliedPanelClasses.indexOf(cssClass) === -1) { this._appliedPanelClasses.push(cssClass); this._pane.classList.add(cssClass); } }); } } /** Clears the classes that the position strategy has applied from the overlay panel. */ _clearPanelClasses() { if (this._pane) { this._appliedPanelClasses.forEach((cssClass) => { this._pane.classList.remove(cssClass); }); this._appliedPanelClasses = []; } } /** Returns the ClientRect of the current origin. */ _getOriginRect() { const origin = this._origin; if (origin instanceof ElementRef) { return origin.nativeElement.getBoundingClientRect(); } if (origin instanceof Element) { return origin.getBoundingClientRect(); } const width = origin.width || 0; const height = origin.height || 0; return { top: origin.y, bottom: origin.y + height, left: origin.x, right: origin.x + width, height, width }; } }; function extendStyles(destination, source) { for (let key in source) { if (source.hasOwnProperty(key)) { destination[key] = source[key]; } } return destination; } function getPixelValue(input) { if (typeof input !== "number" && input != null) { const [value, units] = input.split(cssUnitPattern); return !units || units === "px" ? parseFloat(value) : null; } return input || null; } function getRoundedBoundingClientRect(clientRect) { return { top: Math.floor(clientRect.top), right: Math.floor(clientRect.right), bottom: Math.floor(clientRect.bottom), left: Math.floor(clientRect.left), width: Math.floor(clientRect.width), height: Math.floor(clientRect.height) }; } var wrapperClass = "cdk-global-overlay-wrapper"; var GlobalPositionStrategy = class { constructor() { this._cssPosition = "static"; this._topOffset = ""; this._bottomOffset = ""; this._alignItems = ""; this._xPosition = ""; this._xOffset = ""; this._width = ""; this._height = ""; this._isDisposed = false; } attach(overlayRef) { const config = overlayRef.getConfig(); this._overlayRef = overlayRef; if (this._width && !config.width) { overlayRef.updateSize({ width: this._width }); } if (this._height && !config.height) { overlayRef.updateSize({ height: this._height }); } overlayRef.hostElement.classList.add(wrapperClass); this._isDisposed = false; } /** * Sets the top position of the overlay. Clears any previously set vertical position. * @param value New top offset. */ top(value = "") { this._bottomOffset = ""; this._topOffset = value; this._alignItems = "flex-start"; return this; } /** * Sets the left position of the overlay. Clears any previously set horizontal position. * @param value New left offset. */ left(value = "") { this._xOffset = value; this._xPosition = "left"; return this; } /** * Sets the bottom position of the overlay. Clears any previously set vertical position. * @param value New bottom offset. */ bottom(value = "") { this._topOffset = ""; this._bottomOffset = value; this._alignItems = "flex-end"; return this; } /** * Sets the right position of the overlay. Clears any previously set horizontal position. * @param value New right offset. */ right(value = "") { this._xOffset = value; this._xPosition = "right"; return this; } /** * Sets the overlay to the start of the viewport, depending on the overlay direction. * This will be to the left in LTR layouts and to the right in RTL. * @param offset Offset from the edge of the screen. */ start(value = "") { this._xOffset = value; this._xPosition = "start"; return this; } /** * Sets the overlay to the end of the viewport, depending on the overlay direction. * This will be to the right in LTR layouts and to the left in RTL. * @param offset Offset from the edge of the screen. */ end(value = "") { this._xOffset = value; this._xPosition = "end"; return this; } /** * Sets the overlay width and clears any previously set width. * @param value New width for the overlay * @deprecated Pass the `width` through the `OverlayConfig`. * @breaking-change 8.0.0 */ width(value = "") { if (this._overlayRef) { this._overlayRef.updateSize({ width: value }); } else { this._width = value; } return this; } /** * Sets the overlay height and clears any previously set height. * @param value New height for the overlay * @deprecated Pass the `height` through the `OverlayConfig`. * @breaking-change 8.0.0 */ height(value = "") { if (this._overlayRef) { this._overlayRef.updateSize({ height: value }); } else { this._height = value; } return this; } /** * Centers the overlay horizontally with an optional offset. * Clears any previously set horizontal position. * * @param offset Overlay offset from the horizontal center. */ centerHorizontally(offset = "") { this.left(offset); this._xPosition = "center"; return this; } /** * Centers the overlay vertically with an optional offset. * Clears any previously set vertical position. * * @param offset Overlay offset from the vertical center. */ centerVertically(offset = "") { this.top(offset); this._alignItems = "center"; return this; } /** * Apply the position to the element. * @docs-private */ apply() { if (!this._overlayRef || !this._overlayRef.hasAttached()) { return; } const styles = this._overlayRef.overlayElement.style; const parentStyles = this._overlayRef.hostElement.style; const config = this._overlayRef.getConfig(); const { width, height, maxWidth, maxHeight } = config; const shouldBeFlushHorizontally = (width === "100%" || width === "100vw") && (!maxWidth || maxWidth === "100%" || maxWidth === "100vw"); const shouldBeFlushVertically = (height === "100%" || height === "100vh") && (!maxHeight || maxHeight === "100%" || maxHeight === "100vh"); const xPosition = this._xPosition; const xOffset = this._xOffset; const isRtl = this._overlayRef.getConfig().direction === "rtl"; let marginLeft = ""; let marginRight = ""; let justifyContent = ""; if (shouldBeFlushHorizontally) { justifyContent = "flex-start"; } else if (xPosition === "center") { justifyContent = "center"; if (isRtl) { marginRight = xOffset; } else { marginLeft = xOffset; } } else if (isRtl) { if (xPosition === "left" || xPosition === "end") { justifyContent = "flex-end"; marginLeft = xOffset; } else if (xPosition === "right" || xPosition === "start") { justifyContent = "flex-start"; marginRight = xOffset; } } else if (xPosition === "left" || xPosition === "start") { justifyContent = "flex-start"; marginLeft = xOffset; } else if (xPosition === "right" || xPosition === "end") { justifyContent = "flex-end"; marginRight = xOffset; } styles.position = this._cssPosition; styles.marginLeft = shouldBeFlushHorizontally ? "0" : marginLeft; styles.marginTop = shouldBeFlushVertically ? "0" : this._topOffset; styles.marginBottom = this._bottomOffset; styles.marginRight = shouldBeFlushHorizontally ? "0" : marginRight; parentStyles.justifyContent = justifyContent; parentStyles.alignItems = shouldBeFlushVertically ? "flex-start" : this._alignItems; } /** * Cleans up the DOM changes from the position strategy. * @docs-private */ dispose() { if (this._isDisposed || !this._overlayRef) { return; } const styles = this._overlayRef.overlayElement.style; const parent = this._overlayRef.hostElement; const parentStyles = parent.style; parent.classList.remove(wrapperClass); parentStyles.justifyContent = parentStyles.alignItems = styles.marginTop = styles.marginBottom = styles.marginLeft = styles.marginRight = styles.position = ""; this._overlayRef = null; this._isDisposed = true; } }; var _OverlayPositionBuilder = class _OverlayPositionBuilder { constructor(_viewportRuler, _document, _platform, _overlayContainer) { this._viewportRuler = _viewportRuler; this._document = _document; this._platform = _platform; this._overlayContainer = _overlayContainer; } /** * Creates a global position strategy. */ global() { return new GlobalPositionStrategy(); } /** * Creates a flexible position strategy. * @param origin Origin relative to which to position the overlay. */ flexibleConnectedTo(origin) { return new FlexibleConnectedPositionStrategy(origin, this._viewportRuler, this._document, this._platform, this._overlayContainer); } }; _OverlayPositionBuilder.ɵfac = function OverlayPositionBuilder_Factory(t) { return new (t || _OverlayPositionBuilder)(ɵɵinject(ViewportRuler), ɵɵinject(DOCUMENT), ɵɵinject(Platform), ɵɵinject(OverlayContainer)); }; _OverlayPositionBuilder.ɵprov = ɵɵdefineInjectable({ token: _OverlayPositionBuilder, factory: _OverlayPositionBuilder.ɵfac, providedIn: "root" }); var OverlayPositionBuilder = _OverlayPositionBuilder; (() => { (typeof ngDevMode === "undefined" || ngDevMode) && setClassMetadata(OverlayPositionBuilder, [{ type: Injectable, args: [{ providedIn: "root" }] }], () => [{ type: ViewportRuler }, { type: void 0, decorators: [{ type: Inject, args: [DOCUMENT] }] }, { type: Platform }, { type: OverlayContainer }], null); })(); var nextUniqueId = 0; var _Overlay = class _Overlay { constructor(scrollStrategies, _overlayContainer, _componentFactoryResolver, _positionBuilder, _keyboardDispatcher, _injector, _ngZone, _document, _directionality, _location, _outsideClickDispatcher, _animationsModuleType) { this.scrollStrategies = scrollStrategies; this._overlayContainer = _overlayContainer; this._componentFactoryResolver = _componentFactoryResolver; this._positionBuilder = _positionBuilder; this._keyboardDispatcher = _keyboardDispatcher; this._injector = _injector; this._ngZone = _ngZone; this._document = _document; this._directionality = _directionality; this._location = _location; this._outsideClickDispatcher = _outsideClickDispatcher; this._animationsModuleType = _animationsModuleType; } /** * Creates an overlay. * @param config Configuration applied to the overlay. * @returns Reference to the created overlay. */ create(config) { const host = this._createHostElement(); const pane = this._createPaneElement(host); const portalOutlet = this._createPortalOutlet(pane); const overlayConfig = new OverlayConfig(config); overlayConfig.direction = overlayConfig.direction || this._directionality.value; return new OverlayRef(portalOutlet, host, pane, overlayConfig, this._ngZone, this._keyboardDispatcher, this._document, this._location, this._outsideClickDispatcher, this._animationsModuleType === "NoopAnimations"); } /** * Gets a position builder that can be used, via fluent API, * to construct and configure a position strategy. * @returns An overlay position builder. */ position() { return this._positionBuilder; } /** * Creates the DOM element for an overlay and appends it to the overlay container. * @returns Newly-created pane element */ _createPaneElement(host) { const pane = this._document.createElement("div"); pane.id = `cdk-overlay-${nextUniqueId++}`; pane.classList.add("cdk-overlay-pane"); host.appendChild(pane); return pane; } /** * Creates the host element that wraps around an overlay * and can be used for advanced positioning. * @returns Newly-create host element. */ _createHostElement() { const host = this._document.createElement("div"); this._overlayContainer.getContainerElement().appendChild(host); return host; } /** * Create a DomPortalOutlet into which the overlay content can be loaded. * @param pane The DOM element to turn into a portal outlet. * @returns A portal outlet for the given DOM element. */ _createPortalOutlet(pane) { if (!this._appRef) { this._appRef = this._injector.get(ApplicationRef); } return new DomPortalOutlet(pane, this._componentFactoryResolver, this._appRef, this._injector, this._document); } }; _Overlay.ɵfac = function Overlay_Factory(t) { return new (t || _Overlay)(ɵɵinject(ScrollStrategyOptions), ɵɵinject(OverlayContainer), ɵɵinject(ComponentFactoryResolver$1), ɵɵinject(OverlayPositionBuilder), ɵɵinject(OverlayKeyboardDispatcher), ɵɵinject(Injector), ɵɵinject(NgZone), ɵɵinject(DOCUMENT), ɵɵinject(Directionality), ɵɵinject(Location), ɵɵinject(OverlayOutsideClickDispatcher), ɵɵinject(ANIMATION_MODULE_TYPE, 8)); }; _Overlay.ɵprov = ɵɵdefineInjectable({ token: _Overlay, factory: _Overlay.ɵfac, providedIn: "root" }); var Overlay = _Overlay; (() => { (typeof ngDevMode === "undefined" || ngDevMode) && setClassMetadata(Overlay, [{ type: Injectable, args: [{ providedIn: "root" }] }], () => [{ type: ScrollStrategyOptions }, { type: OverlayContainer }, { type: ComponentFactoryResolver$1 }, { type: OverlayPositionBuilder }, { type: OverlayKeyboardDispatcher }, { type: Injector }, { type: NgZone }, { type: void 0, decorators: [{ type: Inject, args: [DOCUMENT] }] }, { type: Directionality }, { type: Location }, { type: OverlayOutsideClickDispatcher }, { type: void 0, decorators: [{ type: Inject, args: [ANIMATION_MODULE_TYPE] }, { type: Optional }] }], null); })(); var defaultPositionList = [{ originX: "start", originY: "bottom", overlayX: "start", overlayY: "top" }, { originX: "start", originY: "top", overlayX: "start", overlayY: "bottom" }, { originX: "end", originY: "top", overlayX: "end", overlayY: "bottom" }, { originX: "end", originY: "bottom", overlayX: "end", overlayY: "top" }]; var CDK_CONNECTED_OVERLAY_SCROLL_STRATEGY = new InjectionToken("cdk-connected-overlay-scroll-strategy", { providedIn: "root", factory: () => { const overlay = inject(Overlay); return () => overlay.scrollStrategies.reposition(); } }); var _CdkOverlayOrigin = class _CdkOverlayOrigin { constructor(elementRef) { this.elementRef = elementRef; } }; _CdkOverlayOrigin.ɵfac = function CdkOverlayOrigin_Factory(t) { return new (t || _CdkOverlayOrigin)(ɵɵdirectiveInject(ElementRef)); }; _CdkOverlayOrigin.ɵdir = ɵɵdefineDirective({ type: _CdkOverlayOrigin, selectors: [["", "cdk-overlay-origin", ""], ["", "overlay-origin", ""], ["", "cdkOverlayOrigin", ""]], exportAs: ["cdkOverlayOrigin"], standalone: true }); var CdkOverlayOrigin = _CdkOverlayOrigin; (() => { (typeof ngDevMode === "undefined" || ngDevMode) && setClassMetadata(CdkOverlayOrigin, [{ type: Directive, args: [{ selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: "cdkOverlayOrigin", standalone: true }] }], () => [{ type: ElementRef }], null); })(); var _CdkConnectedOverlay = class _CdkConnectedOverlay { /** The offset in pixels for the overlay connection point on the x-axis */ get offsetX() { return this._offsetX; } set offsetX(offsetX) { this._offsetX = offsetX; if (this._position) { this._updatePositionStrategy(this._position); } } /** The offset in pixels for the overlay connection point on the y-axis */ get offsetY() { return this._offsetY; } set offsetY(offsetY) { this._offsetY = offsetY; if (this._position) { this._updatePositionStrategy(this._position); } } /** Whether the overlay should be disposed of when the user goes backwards/forwards in history. */ get disposeOnNavigation() { return this._disposeOnNavigation; } set disposeOnNavigation(value) { this._disposeOnNavigation = value; } // TODO(jelbourn): inputs for size, scroll behavior, animation, etc. constructor(_overlay, templateRef, viewContainerRef, scrollStrategyFactory, _dir) { this._overlay = _overlay; this._dir = _dir; this._backdropSubscription = Subscription.EMPTY; this._attachSubscription = Subscription.EMPTY; this._detachSubscription = Subscription.EMPTY; this._positionSubscription = Subscription.EMPTY; this._disposeOnNavigation = false; this.viewportMargin = 0; this.open = false; this.disableClose = false; this.hasBackdrop = false; this.lockPosition = false; this.flexibleDimensions = false; this.growAfterOpen = false; this.push = false; this.backdropClick = new EventEmitter(); this.positionChange = new EventEmitter(); this.attach = new EventEmitter(); this.detach = new EventEmitter(); this.overlayKeydown = new EventEmitter(); this.overlayOutsideClick = new EventEmitter(); this._templatePortal = new TemplatePortal(templateRef, viewContainerRef); this._scrollStrategyFactory = scrollStrategyFactory; this.scrollStrategy = this._scrollStrategyFactory(); } /** The associated overlay reference. */ get overlayRef() { return this._overlayRef; } /** The element's layout direction. */ get dir() { return this._dir ? this._dir.value : "ltr"; } ngOnDestroy() { this._attachSubscription.unsubscribe(); this._detachSubscription.unsubscribe(); this._backdropSubscription.unsubscribe(); this._positionSubscription.unsubscribe(); if (this._overlayRef) { this._overlayRef.dispose(); } } ngOnChanges(changes) { if (this._position) { this._updatePositionStrategy(this._position); this._overlayRef.updateSize({ width: this.width, minWidth: this.minWidth, height: this.height, minHeight: this.minHeight }); if (changes["origin"] && this.open) { this._position.apply(); } } if (changes["open"]) { this.open ? this._attachOverlay() : this._detachOverlay(); } } /** Creates an overlay */ _createOverlay() { if (!this.positions || !this.positions.length) { this.positions = defaultPositionList; } const overlayRef = this._overlayRef = this._overlay.create(this._buildConfig()); this._attachSubscription = overlayRef.attachments().subscribe(() => this.attach.emit()); this._detachSubscription = overlayRef.detachments().subscribe(() => this.detach.emit()); overlayRef.keydownEvents().subscribe((event) => { this.overlayKeydown.next(event); if (event.keyCode === ESCAPE && !this.disableClose && !hasModifierKey(event)) { event.preventDefault(); this._detachOverlay(); } }); this._overlayRef.outsidePointerEvents().subscribe((event) => { this.overlayOutsideClick.next(event); }); } /** Builds the overlay config based on the directive's inputs */ _buildConfig() { const positionStrategy = this._position = this.positionStrategy || this._createPositionStrategy(); const overlayConfig = new OverlayConfig({ direction: this._dir, positionStrategy, scrollStrategy: this.scrollStrategy, hasBackdrop: this.hasBackdrop, disposeOnNavigation: this.disposeOnNavigation }); if (this.width || this.width === 0) { overlayConfig.width = this.width; } if (this.height || this.height === 0) { overlayConfig.height = this.height; } if (this.minWidth || this.minWidth === 0) { overlayConfig.minWidth = this.minWidth; } if (this.minHeight || this.minHeight === 0) { overlayConfig.minHeight = this.minHeight; } if (this.backdropClass) { overlayConfig.backdropClass = this.backdropClass; } if (this.panelClass) { overlayConfig.panelClass = this.panelClass; } return overlayConfig; } /** Updates the state of a position strategy, based on the values of the directive inputs. */ _updatePositionStrategy(positionStrategy) { const positions = this.positions.map((currentPosition) => ({ originX: currentPosition.originX, originY: currentPosition.originY, overlayX: currentPosition.overlayX, overlayY: currentPosition.overlayY, offsetX: currentPosition.offsetX || this.offsetX, offsetY: currentPosition.offsetY || this.offsetY, panelClass: currentPosition.panelClass || void 0 })); return positionStrategy.setOrigin(this._getFlexibleConnectedPositionStrategyOrigin()).withPositions(positions).withFlexibleDimensions(this.flexibleDimensions).withPush(this.push).withGrowAfterOpen(this.growAfterOpen).withViewportMargin(this.viewportMargin).withLockedPosition(this.lockPosition).withTransformOriginOn(this.transformOriginSelector); } /** Returns the position strategy of the overlay to be set on the overlay config */ _createPositionStrategy() { const strategy = this._overlay.position().flexibleConnectedTo(this._getFlexibleConnectedPositionStrategyOrigin()); this._updatePositionStrategy(strategy); return strategy; } _getFlexibleConnectedPositionStrategyOrigin() { if (this.origin instanceof CdkOverlayOrigin) { return this.origin.elementRef; } else { return this.origin; } } /** Attaches the overlay and subscribes to backdrop clicks if backdrop exists */ _attachOverlay() { if (!this._overlayRef) { this._createOverlay(); } else { this._overlayRef.getConfig().hasBackdrop = this.hasBackdrop; } if (!this._overlayRef.hasAttached()) { this._overlayRef.attach(this._templatePortal); } if (this.hasBackdrop) { this._backdropSubscription = this._overlayRef.backdropClick().subscribe((event) => { this.backdropClick.emit(event); }); } else { this._backdropSubscription.unsubscribe(); } this._positionSubscription.unsubscribe(); if (this.positionChange.observers.length > 0) { this._positionSubscription = this._position.positionChanges.pipe(takeWhile(() => this.positionChange.observers.length > 0)).subscribe((position) => { this.positionChange.emit(position); if (this.positionChange.observers.length === 0) { this._positionSubscription.unsubscribe(); } }); } } /** Detaches the overlay and unsubscribes to backdrop clicks if backdrop exists */ _detachOverlay() { if (this._overlayRef) { this._overlayRef.detach(); } this._backdropSubscription.unsubscribe(); this._positionSubscription.unsubscribe(); } }; _CdkConnectedOverlay.ɵfac = function CdkConnectedOverlay_Factory(t) { return new (t || _CdkConnectedOverlay)(ɵɵdirectiveInject(Overlay), ɵɵdirectiveInject(TemplateRef), ɵɵdirectiveInject(ViewContainerRef), ɵɵdirectiveInject(CDK_CONNECTED_OVERLAY_SCROLL_STRATEGY), ɵɵdirectiveInject(Directionality, 8)); }; _CdkConnectedOverlay.ɵdir = ɵɵdefineDirective({ type: _CdkConnectedOverlay, selectors: [["", "cdk-connected-overlay", ""], ["", "connected-overlay", ""], ["", "cdkConnectedOverlay", ""]], inputs: { origin: ["cdkConnectedOverlayOrigin", "origin"], positions: ["cdkConnectedOverlayPositions", "positions"], positionStrategy: ["cdkConnectedOverlayPositionStrategy", "positionStrategy"], offsetX: ["cdkConnectedOverlayOffsetX", "offsetX"], offsetY: ["cdkConnectedOverlayOffsetY", "offsetY"], width: ["cdkConnectedOverlayWidth", "width"], height: ["cdkConnectedOverlayHeight", "height"], minWidth: ["cdkConnectedOverlayMinWidth", "minWidth"], minHeight: ["cdkConnectedOverlayMinHeight", "minHeight"], backdropClass: ["cdkConnectedOverlayBackdropClass", "backdropClass"], panelClass: ["cdkConnectedOverlayPanelClass", "panelClass"], viewportMargin: ["cdkConnectedOverlayViewportMargin", "viewportMargin"], scrollStrategy: ["cdkConnectedOverlayScrollStrategy", "scrollStrategy"], open: ["cdkConnectedOverlayOpen", "open"], disableClose: ["cdkConnectedOverlayDisableClose", "disableClose"], transformOriginSelector: ["cdkConnectedOverlayTransformOriginOn", "transformOriginSelector"], hasBackdrop: ["cdkConnectedOverlayHasBackdrop", "hasBackdrop", booleanAttribute], lockPosition: ["cdkConnectedOverlayLockPosition", "lockPosition", booleanAttribute], flexibleDimensions: ["cdkConnectedOverlayFlexibleDimensions", "flexibleDimensions", booleanAttribute], growAfterOpen: ["cdkConnectedOverlayGrowAfterOpen", "growAfterOpen", booleanAttribute], push: ["cdkConnectedOverlayPush", "push", booleanAttribute], disposeOnNavigation: ["cdkConnectedOverlayDisposeOnNavigation", "disposeOnNavigation", booleanAttribute] }, outputs: { backdropClick: "backdropClick", positionChange: "positionChange", attach: "attach", detach: "detach", overlayKeydown: "overlayKeydown", overlayOutsideClick: "overlayOutsideClick" }, exportAs: ["cdkConnectedOverlay"], standalone: true, features: [ɵɵInputTransformsFeature, ɵɵNgOnChangesFeature] }); var CdkConnectedOverlay = _CdkConnectedOverlay; (() => { (typeof ngDevMode === "undefined" || ngDevMode) && setClassMetadata(CdkConnectedOverlay, [{ type: Directive, args: [{ selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", exportAs: "cdkConnectedOverlay", standalone: true }] }], () => [{ type: Overlay }, { type: TemplateRef }, { type: ViewContainerRef }, { type: void 0, decorators: [{ type: Inject, args: [CDK_CONNECTED_OVERLAY_SCROLL_STRATEGY] }] }, { type: Directionality, decorators: [{ type: Optional }] }], { origin: [{ type: Input, args: ["cdkConnectedOverlayOrigin"] }], positions: [{ type: Input, args: ["cdkConnectedOverlayPositions"] }], positionStrategy: [{ type: Input, args: ["cdkConnectedOverlayPositionStrategy"] }], offsetX: [{ type: Input, args: ["cdkConnectedOverlayOffsetX"] }], offsetY: [{ type: Input, args: ["cdkConnectedOverlayOffsetY"] }], width: [{ type: Input, args: ["cdkConnectedOverlayWidth"] }], height: [{ type: Input, args: ["cdkConnectedOverlayHeight"] }], minWidth: [{ type: Input, args: ["cdkConnectedOverlayMinWidth"] }], minHeight: [{ type: Input, args: ["cdkConnectedOverlayMinHeight"] }], backdropClass: [{ type: Input, args: ["cdkConnectedOverlayBackdropClass"] }], panelClass: [{ type: Input, args: ["cdkConnectedOverlayPanelClass"] }], viewportMargin: [{ type: Input, args: ["cdkConnectedOverlayViewportMargin"] }], scrollStrategy: [{ type: Input, args: ["cdkConnectedOverlayScrollStrategy"] }], open: [{ type: Input, args: ["cdkConnectedOverlayOpen"] }], disableClose: [{ type: Input, args: ["cdkConnectedOverlayDisableClose"] }], transformOriginSelector: [{ type: Input, args: ["cdkConnectedOverlayTransformOriginOn"] }], hasBackdrop: [{ type: Input, args: [{ alias: "cdkConnectedOverlayHasBackdrop", transform: booleanAttribute }] }], lockPosition: [{ type: Input, args: [{ alias: "cdkConnectedOverlayLockPosition", transform: booleanAttribute }] }], flexibleDimensions: [{ type: Input, args: [{ alias: "cdkConnectedOverlayFlexibleDimensions", transform: booleanAttribute }] }], growAfterOpen: [{ type: Input, args: [{ alias: "cdkConnectedOverlayGrowAfterOpen", transform: booleanAttribute }] }], push: [{ type: Input, args: [{ alias: "cdkConnectedOverlayPush", transform: booleanAttribute }] }], disposeOnNavigation: [{ type: Input, args: [{ alias: "cdkConnectedOverlayDisposeOnNavigation", transform: booleanAttribute }] }], backdropClick: [{ type: Output }], positionChange: [{ type: Output }], attach: [{ type: Output }], detach: [{ type: Output }], overlayKeydown: [{ type: Output }], overlayOutsideClick: [{ type: Output }] }); })(); function CDK_CONNECTED_OVERLAY_SCROLL_STRATEGY_PROVIDER_FACTORY(overlay) { return () => overlay.scrollStrategies.reposition(); } var CDK_CONNECTED_OVERLAY_SCROLL_STRATEGY_PROVIDER = { provide: CDK_CONNECTED_OVERLAY_SCROLL_STRATEGY, deps: [Overlay], useFactory: CDK_CONNECTED_OVERLAY_SCROLL_STRATEGY_PROVIDER_FACTORY }; var _OverlayModule = class _OverlayModule { }; _OverlayModule.ɵfac = function OverlayModule_Factory(t) { return new (t || _OverlayModule)(); }; _OverlayModule.ɵmod = ɵɵdefineNgModule({ type: _OverlayModule, imports: [BidiModule, PortalModule, ScrollingModule, CdkConnectedOverlay, CdkOverlayOrigin], exports: [CdkConnectedOverlay, CdkOverlayOrigin, ScrollingModule] }); _OverlayModule.ɵinj = ɵɵdefineInjector({ providers: [Overlay, CDK_CONNECTED_OVERLAY_SCROLL_STRATEGY_PROVIDER], imports: [BidiModule, PortalModule, ScrollingModule, ScrollingModule] }); var OverlayModule = _OverlayModule; (() => { (typeof ngDevMode === "undefined" || ngDevMode) && setClassMetadata(OverlayModule, [{ type: NgModule, args: [{ imports: [BidiModule, PortalModule, ScrollingModule, CdkConnectedOverlay, CdkOverlayOrigin], exports: [CdkConnectedOverlay, CdkOverlayOrigin, ScrollingModule], providers: [Overlay, CDK_CONNECTED_OVERLAY_SCROLL_STRATEGY_PROVIDER] }] }], null, null); })(); var _FullscreenOverlayContainer = class _FullscreenOverlayContainer extends OverlayContainer { constructor(_document, platform) { super(_document, platform); } ngOnDestroy() { super.ngOnDestroy(); if (this._fullScreenEventName && this._fullScreenListener) { this._document.removeEventListener(this._fullScreenEventName, this._fullScreenListener); } } _createContainer() { super._createContainer(); this._adjustParentForFullscreenChange(); this._addFullscreenChangeListener(() => this._adjustParentForFullscreenChange()); } _adjustParentForFullscreenChange() { if (!this._containerElement) { return; } const fullscreenElement = this.getFullscreenElement(); const parent = fullscreenElement || this._document.body; parent.appendChild(this._containerElement); } _addFullscreenChangeListener(fn) { const eventName = this._getEventName(); if (eventName) { if (this._fullScreenListener) { this._document.removeEventListener(eventName, this._fullScreenListener); } this._document.addEventListener(eventName, fn); this._fullScreenListener = fn; } } _getEventName() { if (!this._fullScreenEventName) { const _document = this._document; if (_document.fullscreenEnabled) { this._fullScreenEventName = "fullscreenchange"; } else if (_document.webkitFullscreenEnabled) { this._fullScreenEventName = "webkitfullscreenchange"; } else if (_document.mozFullScreenEnabled) { this._fullScreenEventName = "mozfullscreenchange"; } else if (_document.msFullscreenEnabled) { this._fullScreenEventName = "MSFullscreenChange"; } } return this._fullScreenEventName; } /** * When the page is put into fullscreen mode, a specific element is specified. * Only that element and its children are visible when in fullscreen mode. */ getFullscreenElement() { const _document = this._document; return _document.fullscreenElement || _document.webkitFullscreenElement || _document.mozFullScreenElement || _document.msFullscreenElement || null; } }; _FullscreenOverlayContainer.ɵfac = function FullscreenOverlayContainer_Factory(t) { return new (t || _FullscreenOverlayContainer)(ɵɵinject(DOCUMENT), ɵɵinject(Platform)); }; _FullscreenOverlayContainer.ɵprov = ɵɵdefineInjectable({ token: _FullscreenOverlayContainer, factory: _FullscreenOverlayContainer.ɵfac, providedIn: "root" }); var FullscreenOverlayContainer = _FullscreenOverlayContainer; (() => { (typeof ngDevMode === "undefined" || ngDevMode) && setClassMetadata(FullscreenOverlayContainer, [{ type: Injectable, args: [{ providedIn: "root" }] }], () => [{ type: void 0, decorators: [{ type: Inject, args: [DOCUMENT] }] }, { type: Platform }], null); })(); export { ComponentPortal, helpMotion, moveUpMotion, zoomBigMotion, ConnectionPositionPair, Overlay, CdkOverlayOrigin, CdkConnectedOverlay, OverlayModule }; //# sourceMappingURL=chunk-QI6CCAQD.js.map