`\n // and attach a portal programmatically in the parent component. When Angular does the first CD\n // round, it will fire the setter with empty string, causing the user's content to be cleared.\n if (this.hasAttached() && !portal && !this._isInitialized) {\n return;\n }\n if (this.hasAttached()) {\n super.detach();\n }\n if (portal) {\n super.attach(portal);\n }\n this._attachedPortal = portal;\n }\n /** Component or view reference that is attached to the portal. */\n get attachedRef() {\n return this._attachedRef;\n }\n ngOnInit() {\n this._isInitialized = true;\n }\n ngOnDestroy() {\n super.dispose();\n this._attachedPortal = null;\n this._attachedRef = null;\n }\n /**\n * Attach the given ComponentPortal to this PortalOutlet using the ComponentFactoryResolver.\n *\n * @param portal Portal to be attached to the portal outlet.\n * @returns Reference to the created component.\n */\n attachComponentPortal(portal) {\n portal.setAttachedHost(this);\n // If the portal specifies an origin, use that as the logical location of the component\n // in the application tree. Otherwise use the location of this PortalOutlet.\n const viewContainerRef = portal.viewContainerRef != null ?\n portal.viewContainerRef :\n this._viewContainerRef;\n const resolver = portal.componentFactoryResolver || this._componentFactoryResolver;\n const componentFactory = resolver.resolveComponentFactory(portal.component);\n const ref = viewContainerRef.createComponent(componentFactory, viewContainerRef.length, portal.injector || viewContainerRef.injector);\n // If we're using a view container that's different from the injected one (e.g. when the portal\n // specifies its own) we need to move the component into the outlet, otherwise it'll be rendered\n // inside of the alternate view container.\n if (viewContainerRef !== this._viewContainerRef) {\n this._getRootNode().appendChild(ref.hostView.rootNodes[0]);\n }\n super.setDisposeFn(() => ref.destroy());\n this._attachedPortal = portal;\n this._attachedRef = ref;\n this.attached.emit(ref);\n return ref;\n }\n /**\n * Attach the given TemplatePortal to this PortalHost as an embedded View.\n * @param portal Portal to be attached.\n * @returns Reference to the created embedded view.\n */\n attachTemplatePortal(portal) {\n portal.setAttachedHost(this);\n const viewRef = this._viewContainerRef.createEmbeddedView(portal.templateRef, portal.context);\n super.setDisposeFn(() => this._viewContainerRef.clear());\n this._attachedPortal = portal;\n this._attachedRef = viewRef;\n this.attached.emit(viewRef);\n return viewRef;\n }\n /** Gets the root node of the portal outlet. */\n _getRootNode() {\n const nativeElement = this._viewContainerRef.element.nativeElement;\n // The directive could be set on a template which will result in a comment\n // node being the root. Use the comment's parent node if that is the case.\n return (nativeElement.nodeType === nativeElement.ELEMENT_NODE ?\n nativeElement : nativeElement.parentNode);\n }\n}\nCdkPortalOutlet.ɵfac = function CdkPortalOutlet_Factory(t) { return new (t || CdkPortalOutlet)(ɵngcc0.ɵɵdirectiveInject(ɵngcc0.ComponentFactoryResolver), ɵngcc0.ɵɵdirectiveInject(ɵngcc0.ViewContainerRef), ɵngcc0.ɵɵdirectiveInject(DOCUMENT)); };\nCdkPortalOutlet.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: CdkPortalOutlet, selectors: [[\"\", \"cdkPortalOutlet\", \"\"]], inputs: { portal: [\"cdkPortalOutlet\", \"portal\"] }, outputs: { attached: \"attached\" }, exportAs: [\"cdkPortalOutlet\"], features: [ɵngcc0.ɵɵInheritDefinitionFeature] });\nCdkPortalOutlet.ctorParameters = () => [\n { type: ComponentFactoryResolver },\n { type: ViewContainerRef },\n { type: undefined, decorators: [{ type: Inject, args: [DOCUMENT,] }] }\n];\nCdkPortalOutlet.propDecorators = {\n attached: [{ type: Output }]\n};\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(CdkPortalOutlet, [{\n type: Directive,\n args: [{\n selector: '[cdkPortalOutlet]',\n exportAs: 'cdkPortalOutlet',\n inputs: ['portal: cdkPortalOutlet']\n }]\n }], function () { return [{ type: ɵngcc0.ComponentFactoryResolver }, { type: ɵngcc0.ViewContainerRef }, { type: undefined, decorators: [{\n type: Inject,\n args: [DOCUMENT]\n }] }]; }, { attached: [{\n type: Output\n }] }); })();\n/**\n * @deprecated Use `CdkPortalOutlet` instead.\n * @breaking-change 9.0.0\n */\nclass PortalHostDirective extends CdkPortalOutlet {\n}\nPortalHostDirective.ɵfac = /*@__PURE__*/ function () { let ɵPortalHostDirective_BaseFactory; return function PortalHostDirective_Factory(t) { return (ɵPortalHostDirective_BaseFactory || (ɵPortalHostDirective_BaseFactory = ɵngcc0.ɵɵgetInheritedFactory(PortalHostDirective)))(t || PortalHostDirective); }; }();\nPortalHostDirective.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: PortalHostDirective, selectors: [[\"\", \"cdkPortalHost\", \"\"], [\"\", \"portalHost\", \"\"]], inputs: { portal: [\"cdkPortalHost\", \"portal\"] }, exportAs: [\"cdkPortalHost\"], features: [ɵngcc0.ɵɵProvidersFeature([{\n provide: CdkPortalOutlet,\n useExisting: PortalHostDirective\n }]), ɵngcc0.ɵɵInheritDefinitionFeature] });\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(PortalHostDirective, [{\n type: Directive,\n args: [{\n selector: '[cdkPortalHost], [portalHost]',\n exportAs: 'cdkPortalHost',\n inputs: ['portal: cdkPortalHost'],\n providers: [{\n provide: CdkPortalOutlet,\n useExisting: PortalHostDirective\n }]\n }]\n }], null, null); })();\nclass PortalModule {\n}\nPortalModule.ɵfac = function PortalModule_Factory(t) { return new (t || PortalModule)(); };\nPortalModule.ɵmod = /*@__PURE__*/ ɵngcc0.ɵɵdefineNgModule({ type: PortalModule });\nPortalModule.ɵinj = /*@__PURE__*/ ɵngcc0.ɵɵdefineInjector({});\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(PortalModule, [{\n type: NgModule,\n args: [{\n exports: [CdkPortal, CdkPortalOutlet, TemplatePortalDirective, PortalHostDirective],\n declarations: [CdkPortal, CdkPortalOutlet, TemplatePortalDirective, PortalHostDirective]\n }]\n }], null, null); })();\n(function () { (typeof ngJitMode === \"undefined\" || ngJitMode) && ɵngcc0.ɵɵsetNgModuleScope(PortalModule, { declarations: [CdkPortal, CdkPortalOutlet, TemplatePortalDirective, PortalHostDirective], exports: [CdkPortal, CdkPortalOutlet, TemplatePortalDirective, PortalHostDirective] }); })();\n\n/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n/**\n * Custom injector to be used when providing custom\n * injection tokens to components inside a portal.\n * @docs-private\n * @deprecated Use `Injector.create` instead.\n * @breaking-change 11.0.0\n */\nclass PortalInjector {\n constructor(_parentInjector, _customTokens) {\n this._parentInjector = _parentInjector;\n this._customTokens = _customTokens;\n }\n get(token, notFoundValue) {\n const value = this._customTokens.get(token);\n if (typeof value !== 'undefined') {\n return value;\n }\n return this._parentInjector.get(token, notFoundValue);\n }\n}\n\n/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n\n/**\n * Generated bundle index. Do not edit.\n */\n\nexport { BasePortalHost, BasePortalOutlet, CdkPortal, CdkPortalOutlet, ComponentPortal, DomPortal, DomPortalHost, DomPortalOutlet, Portal, PortalHostDirective, PortalInjector, PortalModule, TemplatePortal, TemplatePortalDirective };\n\n","import { coerceNumberProperty, coerceElement, coerceBooleanProperty } from '@angular/cdk/coercion';\nimport * as i0 from '@angular/core';\nimport { InjectionToken, Directive, forwardRef, Input, Injectable, NgZone, Optional, Inject, ElementRef, Component, ViewEncapsulation, ChangeDetectionStrategy, ChangeDetectorRef, Output, ViewChild, ViewContainerRef, TemplateRef, IterableDiffers, SkipSelf, NgModule } from '@angular/core';\nimport { Subject, of, Observable, fromEvent, animationFrameScheduler, asapScheduler, Subscription, isObservable } from 'rxjs';\nimport { distinctUntilChanged, auditTime, filter, takeUntil, startWith, pairwise, switchMap, shareReplay } from 'rxjs/operators';\nimport * as i1 from '@angular/cdk/platform';\nimport { Platform, getRtlScrollAxisType, supportsScrollBehavior, PlatformModule } from '@angular/cdk/platform';\nimport * as i2 from '@angular/common';\nimport { DOCUMENT } from '@angular/common';\nimport { Directionality, BidiModule } from '@angular/cdk/bidi';\nimport { isDataSource, ArrayDataSource, _VIEW_REPEATER_STRATEGY, _RecycleViewRepeaterStrategy } from '@angular/cdk/collections';\n\n/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n/** The injection token used to specify the virtual scrolling strategy. */\nimport * as ɵngcc0 from '@angular/core';\nimport * as ɵngcc1 from '@angular/cdk/platform';\nimport * as ɵngcc2 from '@angular/cdk/bidi';\nimport * as ɵngcc3 from '@angular/cdk/collections';\n\nconst _c0 = [\"contentWrapper\"];\nconst _c1 = [\"*\"];\nconst VIRTUAL_SCROLL_STRATEGY = new InjectionToken('VIRTUAL_SCROLL_STRATEGY');\n\n/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n/** Virtual scrolling strategy for lists with items of known fixed size. */\nclass FixedSizeVirtualScrollStrategy {\n /**\n * @param itemSize The size of the items in the virtually scrolling list.\n * @param minBufferPx The minimum amount of buffer (in pixels) before needing to render more\n * @param maxBufferPx The amount of buffer (in pixels) to render when rendering more.\n */\n constructor(itemSize, minBufferPx, maxBufferPx) {\n this._scrolledIndexChange = new Subject();\n /** @docs-private Implemented as part of VirtualScrollStrategy. */\n this.scrolledIndexChange = this._scrolledIndexChange.pipe(distinctUntilChanged());\n /** The attached viewport. */\n this._viewport = null;\n this._itemSize = itemSize;\n this._minBufferPx = minBufferPx;\n this._maxBufferPx = maxBufferPx;\n }\n /**\n * Attaches this scroll strategy to a viewport.\n * @param viewport The viewport to attach this strategy to.\n */\n attach(viewport) {\n this._viewport = viewport;\n this._updateTotalContentSize();\n this._updateRenderedRange();\n }\n /** Detaches this scroll strategy from the currently attached viewport. */\n detach() {\n this._scrolledIndexChange.complete();\n this._viewport = null;\n }\n /**\n * Update the item size and buffer size.\n * @param itemSize The size of the items in the virtually scrolling list.\n * @param minBufferPx The minimum amount of buffer (in pixels) before needing to render more\n * @param maxBufferPx The amount of buffer (in pixels) to render when rendering more.\n */\n updateItemAndBufferSize(itemSize, minBufferPx, maxBufferPx) {\n if (maxBufferPx < minBufferPx && (typeof ngDevMode === 'undefined' || ngDevMode)) {\n throw Error('CDK virtual scroll: maxBufferPx must be greater than or equal to minBufferPx');\n }\n this._itemSize = itemSize;\n this._minBufferPx = minBufferPx;\n this._maxBufferPx = maxBufferPx;\n this._updateTotalContentSize();\n this._updateRenderedRange();\n }\n /** @docs-private Implemented as part of VirtualScrollStrategy. */\n onContentScrolled() {\n this._updateRenderedRange();\n }\n /** @docs-private Implemented as part of VirtualScrollStrategy. */\n onDataLengthChanged() {\n this._updateTotalContentSize();\n this._updateRenderedRange();\n }\n /** @docs-private Implemented as part of VirtualScrollStrategy. */\n onContentRendered() { }\n /** @docs-private Implemented as part of VirtualScrollStrategy. */\n onRenderedOffsetChanged() { }\n /**\n * Scroll to the offset for the given index.\n * @param index The index of the element to scroll to.\n * @param behavior The ScrollBehavior to use when scrolling.\n */\n scrollToIndex(index, behavior) {\n if (this._viewport) {\n this._viewport.scrollToOffset(index * this._itemSize, behavior);\n }\n }\n /** Update the viewport's total content size. */\n _updateTotalContentSize() {\n if (!this._viewport) {\n return;\n }\n this._viewport.setTotalContentSize(this._viewport.getDataLength() * this._itemSize);\n }\n /** Update the viewport's rendered range. */\n _updateRenderedRange() {\n if (!this._viewport) {\n return;\n }\n const renderedRange = this._viewport.getRenderedRange();\n const newRange = { start: renderedRange.start, end: renderedRange.end };\n const viewportSize = this._viewport.getViewportSize();\n const dataLength = this._viewport.getDataLength();\n let scrollOffset = this._viewport.measureScrollOffset();\n // Prevent NaN as result when dividing by zero.\n let firstVisibleIndex = (this._itemSize > 0) ? scrollOffset / this._itemSize : 0;\n // If user scrolls to the bottom of the list and data changes to a smaller list\n if (newRange.end > dataLength) {\n // We have to recalculate the first visible index based on new data length and viewport size.\n const maxVisibleItems = Math.ceil(viewportSize / this._itemSize);\n const newVisibleIndex = Math.max(0, Math.min(firstVisibleIndex, dataLength - maxVisibleItems));\n // If first visible index changed we must update scroll offset to handle start/end buffers\n // Current range must also be adjusted to cover the new position (bottom of new list).\n if (firstVisibleIndex != newVisibleIndex) {\n firstVisibleIndex = newVisibleIndex;\n scrollOffset = newVisibleIndex * this._itemSize;\n newRange.start = Math.floor(firstVisibleIndex);\n }\n newRange.end = Math.max(0, Math.min(dataLength, newRange.start + maxVisibleItems));\n }\n const startBuffer = scrollOffset - newRange.start * this._itemSize;\n if (startBuffer < this._minBufferPx && newRange.start != 0) {\n const expandStart = Math.ceil((this._maxBufferPx - startBuffer) / this._itemSize);\n newRange.start = Math.max(0, newRange.start - expandStart);\n newRange.end = Math.min(dataLength, Math.ceil(firstVisibleIndex + (viewportSize + this._minBufferPx) / this._itemSize));\n }\n else {\n const endBuffer = newRange.end * this._itemSize - (scrollOffset + viewportSize);\n if (endBuffer < this._minBufferPx && newRange.end != dataLength) {\n const expandEnd = Math.ceil((this._maxBufferPx - endBuffer) / this._itemSize);\n if (expandEnd > 0) {\n newRange.end = Math.min(dataLength, newRange.end + expandEnd);\n newRange.start = Math.max(0, Math.floor(firstVisibleIndex - this._minBufferPx / this._itemSize));\n }\n }\n }\n this._viewport.setRenderedRange(newRange);\n this._viewport.setRenderedContentOffset(this._itemSize * newRange.start);\n this._scrolledIndexChange.next(Math.floor(firstVisibleIndex));\n }\n}\n/**\n * Provider factory for `FixedSizeVirtualScrollStrategy` that simply extracts the already created\n * `FixedSizeVirtualScrollStrategy` from the given directive.\n * @param fixedSizeDir The instance of `CdkFixedSizeVirtualScroll` to extract the\n * `FixedSizeVirtualScrollStrategy` from.\n */\nfunction _fixedSizeVirtualScrollStrategyFactory(fixedSizeDir) {\n return fixedSizeDir._scrollStrategy;\n}\n/** A virtual scroll strategy that supports fixed-size items. */\nclass CdkFixedSizeVirtualScroll {\n constructor() {\n this._itemSize = 20;\n this._minBufferPx = 100;\n this._maxBufferPx = 200;\n /** The scroll strategy used by this directive. */\n this._scrollStrategy = new FixedSizeVirtualScrollStrategy(this.itemSize, this.minBufferPx, this.maxBufferPx);\n }\n /** The size of the items in the list (in pixels). */\n get itemSize() { return this._itemSize; }\n set itemSize(value) { this._itemSize = coerceNumberProperty(value); }\n /**\n * The minimum amount of buffer rendered beyond the viewport (in pixels).\n * If the amount of buffer dips below this number, more items will be rendered. Defaults to 100px.\n */\n get minBufferPx() { return this._minBufferPx; }\n set minBufferPx(value) { this._minBufferPx = coerceNumberProperty(value); }\n /**\n * The number of pixels worth of buffer to render for when rendering new items. Defaults to 200px.\n */\n get maxBufferPx() { return this._maxBufferPx; }\n set maxBufferPx(value) { this._maxBufferPx = coerceNumberProperty(value); }\n ngOnChanges() {\n this._scrollStrategy.updateItemAndBufferSize(this.itemSize, this.minBufferPx, this.maxBufferPx);\n }\n}\nCdkFixedSizeVirtualScroll.ɵfac = function CdkFixedSizeVirtualScroll_Factory(t) { return new (t || CdkFixedSizeVirtualScroll)(); };\nCdkFixedSizeVirtualScroll.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: CdkFixedSizeVirtualScroll, selectors: [[\"cdk-virtual-scroll-viewport\", \"itemSize\", \"\"]], inputs: { itemSize: \"itemSize\", minBufferPx: \"minBufferPx\", maxBufferPx: \"maxBufferPx\" }, features: [ɵngcc0.ɵɵProvidersFeature([{\n provide: VIRTUAL_SCROLL_STRATEGY,\n useFactory: _fixedSizeVirtualScrollStrategyFactory,\n deps: [forwardRef(() => CdkFixedSizeVirtualScroll)]\n }]), ɵngcc0.ɵɵNgOnChangesFeature] });\nCdkFixedSizeVirtualScroll.propDecorators = {\n itemSize: [{ type: Input }],\n minBufferPx: [{ type: Input }],\n maxBufferPx: [{ type: Input }]\n};\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(CdkFixedSizeVirtualScroll, [{\n type: Directive,\n args: [{\n selector: 'cdk-virtual-scroll-viewport[itemSize]',\n providers: [{\n provide: VIRTUAL_SCROLL_STRATEGY,\n useFactory: _fixedSizeVirtualScrollStrategyFactory,\n deps: [forwardRef(() => CdkFixedSizeVirtualScroll)]\n }]\n }]\n }], function () { return []; }, { itemSize: [{\n type: Input\n }], minBufferPx: [{\n type: Input\n }], maxBufferPx: [{\n type: Input\n }] }); })();\n\n/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n/** Time in ms to throttle the scrolling events by default. */\nconst DEFAULT_SCROLL_TIME = 20;\n/**\n * Service contained all registered Scrollable references and emits an event when any one of the\n * Scrollable references emit a scrolled event.\n */\nclass ScrollDispatcher {\n constructor(_ngZone, _platform, document) {\n this._ngZone = _ngZone;\n this._platform = _platform;\n /** Subject for notifying that a registered scrollable reference element has been scrolled. */\n this._scrolled = new Subject();\n /** Keeps track of the global `scroll` and `resize` subscriptions. */\n this._globalSubscription = null;\n /** Keeps track of the amount of subscriptions to `scrolled`. Used for cleaning up afterwards. */\n this._scrolledCount = 0;\n /**\n * Map of all the scrollable references that are registered with the service and their\n * scroll event subscriptions.\n */\n this.scrollContainers = new Map();\n this._document = document;\n }\n /**\n * Registers a scrollable instance with the service and listens for its scrolled events. When the\n * scrollable is scrolled, the service emits the event to its scrolled observable.\n * @param scrollable Scrollable instance to be registered.\n */\n register(scrollable) {\n if (!this.scrollContainers.has(scrollable)) {\n this.scrollContainers.set(scrollable, scrollable.elementScrolled()\n .subscribe(() => this._scrolled.next(scrollable)));\n }\n }\n /**\n * Deregisters a Scrollable reference and unsubscribes from its scroll event observable.\n * @param scrollable Scrollable instance to be deregistered.\n */\n deregister(scrollable) {\n const scrollableReference = this.scrollContainers.get(scrollable);\n if (scrollableReference) {\n scrollableReference.unsubscribe();\n this.scrollContainers.delete(scrollable);\n }\n }\n /**\n * Returns an observable that emits an event whenever any of the registered Scrollable\n * references (or window, document, or body) fire a scrolled event. Can provide a time in ms\n * to override the default \"throttle\" time.\n *\n * **Note:** in order to avoid hitting change detection for every scroll event,\n * all of the events emitted from this stream will be run outside the Angular zone.\n * If you need to update any data bindings as a result of a scroll event, you have\n * to run the callback using `NgZone.run`.\n */\n scrolled(auditTimeInMs = DEFAULT_SCROLL_TIME) {\n if (!this._platform.isBrowser) {\n return of();\n }\n return new Observable((observer) => {\n if (!this._globalSubscription) {\n this._addGlobalListener();\n }\n // In the case of a 0ms delay, use an observable without auditTime\n // since it does add a perceptible delay in processing overhead.\n const subscription = auditTimeInMs > 0 ?\n this._scrolled.pipe(auditTime(auditTimeInMs)).subscribe(observer) :\n this._scrolled.subscribe(observer);\n this._scrolledCount++;\n return () => {\n subscription.unsubscribe();\n this._scrolledCount--;\n if (!this._scrolledCount) {\n this._removeGlobalListener();\n }\n };\n });\n }\n ngOnDestroy() {\n this._removeGlobalListener();\n this.scrollContainers.forEach((_, container) => this.deregister(container));\n this._scrolled.complete();\n }\n /**\n * Returns an observable that emits whenever any of the\n * scrollable ancestors of an element are scrolled.\n * @param elementOrElementRef Element whose ancestors to listen for.\n * @param auditTimeInMs Time to throttle the scroll events.\n */\n ancestorScrolled(elementOrElementRef, auditTimeInMs) {\n const ancestors = this.getAncestorScrollContainers(elementOrElementRef);\n return this.scrolled(auditTimeInMs).pipe(filter(target => {\n return !target || ancestors.indexOf(target) > -1;\n }));\n }\n /** Returns all registered Scrollables that contain the provided element. */\n getAncestorScrollContainers(elementOrElementRef) {\n const scrollingContainers = [];\n this.scrollContainers.forEach((_subscription, scrollable) => {\n if (this._scrollableContainsElement(scrollable, elementOrElementRef)) {\n scrollingContainers.push(scrollable);\n }\n });\n return scrollingContainers;\n }\n /** Use defaultView of injected document if available or fallback to global window reference */\n _getWindow() {\n return this._document.defaultView || window;\n }\n /** Returns true if the element is contained within the provided Scrollable. */\n _scrollableContainsElement(scrollable, elementOrElementRef) {\n let element = coerceElement(elementOrElementRef);\n let scrollableElement = scrollable.getElementRef().nativeElement;\n // Traverse through the element parents until we reach null, checking if any of the elements\n // are the scrollable's element.\n do {\n if (element == scrollableElement) {\n return true;\n }\n } while (element = element.parentElement);\n return false;\n }\n /** Sets up the global scroll listeners. */\n _addGlobalListener() {\n this._globalSubscription = this._ngZone.runOutsideAngular(() => {\n const window = this._getWindow();\n return fromEvent(window.document, 'scroll').subscribe(() => this._scrolled.next());\n });\n }\n /** Cleans up the global scroll listener. */\n _removeGlobalListener() {\n if (this._globalSubscription) {\n this._globalSubscription.unsubscribe();\n this._globalSubscription = null;\n }\n }\n}\nScrollDispatcher.ɵfac = function ScrollDispatcher_Factory(t) { return new (t || ScrollDispatcher)(ɵngcc0.ɵɵinject(ɵngcc0.NgZone), ɵngcc0.ɵɵinject(ɵngcc1.Platform), ɵngcc0.ɵɵinject(DOCUMENT, 8)); };\nScrollDispatcher.ɵprov = i0.ɵɵdefineInjectable({ factory: function ScrollDispatcher_Factory() { return new ScrollDispatcher(i0.ɵɵinject(i0.NgZone), i0.ɵɵinject(i1.Platform), i0.ɵɵinject(i2.DOCUMENT, 8)); }, token: ScrollDispatcher, providedIn: \"root\" });\nScrollDispatcher.ctorParameters = () => [\n { type: NgZone },\n { type: Platform },\n { type: undefined, decorators: [{ type: Optional }, { type: Inject, args: [DOCUMENT,] }] }\n];\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(ScrollDispatcher, [{\n type: Injectable,\n args: [{ providedIn: 'root' }]\n }], function () { return [{ type: ɵngcc0.NgZone }, { type: ɵngcc1.Platform }, { type: undefined, decorators: [{\n type: Optional\n }, {\n type: Inject,\n args: [DOCUMENT]\n }] }]; }, null); })();\n\n/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n/**\n * Sends an event when the directive's element is scrolled. Registers itself with the\n * ScrollDispatcher service to include itself as part of its collection of scrolling events that it\n * can be listened to through the service.\n */\nclass CdkScrollable {\n constructor(elementRef, scrollDispatcher, ngZone, dir) {\n this.elementRef = elementRef;\n this.scrollDispatcher = scrollDispatcher;\n this.ngZone = ngZone;\n this.dir = dir;\n this._destroyed = new Subject();\n this._elementScrolled = new Observable((observer) => this.ngZone.runOutsideAngular(() => fromEvent(this.elementRef.nativeElement, 'scroll').pipe(takeUntil(this._destroyed))\n .subscribe(observer)));\n }\n ngOnInit() {\n this.scrollDispatcher.register(this);\n }\n ngOnDestroy() {\n this.scrollDispatcher.deregister(this);\n this._destroyed.next();\n this._destroyed.complete();\n }\n /** Returns observable that emits when a scroll event is fired on the host element. */\n elementScrolled() {\n return this._elementScrolled;\n }\n /** Gets the ElementRef for the viewport. */\n getElementRef() {\n return this.elementRef;\n }\n /**\n * Scrolls to the specified offsets. This is a normalized version of the browser's native scrollTo\n * method, since browsers are not consistent about what scrollLeft means in RTL. For this method\n * left and right always refer to the left and right side of the scrolling container irrespective\n * of the layout direction. start and end refer to left and right in an LTR context and vice-versa\n * in an RTL context.\n * @param options specified the offsets to scroll to.\n */\n scrollTo(options) {\n const el = this.elementRef.nativeElement;\n const isRtl = this.dir && this.dir.value == 'rtl';\n // Rewrite start & end offsets as right or left offsets.\n if (options.left == null) {\n options.left = isRtl ? options.end : options.start;\n }\n if (options.right == null) {\n options.right = isRtl ? options.start : options.end;\n }\n // Rewrite the bottom offset as a top offset.\n if (options.bottom != null) {\n options.top =\n el.scrollHeight - el.clientHeight - options.bottom;\n }\n // Rewrite the right offset as a left offset.\n if (isRtl && getRtlScrollAxisType() != 0 /* NORMAL */) {\n if (options.left != null) {\n options.right =\n el.scrollWidth - el.clientWidth - options.left;\n }\n if (getRtlScrollAxisType() == 2 /* INVERTED */) {\n options.left = options.right;\n }\n else if (getRtlScrollAxisType() == 1 /* NEGATED */) {\n options.left = options.right ? -options.right : options.right;\n }\n }\n else {\n if (options.right != null) {\n options.left =\n el.scrollWidth - el.clientWidth - options.right;\n }\n }\n this._applyScrollToOptions(options);\n }\n _applyScrollToOptions(options) {\n const el = this.elementRef.nativeElement;\n if (supportsScrollBehavior()) {\n el.scrollTo(options);\n }\n else {\n if (options.top != null) {\n el.scrollTop = options.top;\n }\n if (options.left != null) {\n el.scrollLeft = options.left;\n }\n }\n }\n /**\n * Measures the scroll offset relative to the specified edge of the viewport. This method can be\n * used instead of directly checking scrollLeft or scrollTop, since browsers are not consistent\n * about what scrollLeft means in RTL. The values returned by this method are normalized such that\n * left and right always refer to the left and right side of the scrolling container irrespective\n * of the layout direction. start and end refer to left and right in an LTR context and vice-versa\n * in an RTL context.\n * @param from The edge to measure from.\n */\n measureScrollOffset(from) {\n const LEFT = 'left';\n const RIGHT = 'right';\n const el = this.elementRef.nativeElement;\n if (from == 'top') {\n return el.scrollTop;\n }\n if (from == 'bottom') {\n return el.scrollHeight - el.clientHeight - el.scrollTop;\n }\n // Rewrite start & end as left or right offsets.\n const isRtl = this.dir && this.dir.value == 'rtl';\n if (from == 'start') {\n from = isRtl ? RIGHT : LEFT;\n }\n else if (from == 'end') {\n from = isRtl ? LEFT : RIGHT;\n }\n if (isRtl && getRtlScrollAxisType() == 2 /* INVERTED */) {\n // For INVERTED, scrollLeft is (scrollWidth - clientWidth) when scrolled all the way left and\n // 0 when scrolled all the way right.\n if (from == LEFT) {\n return el.scrollWidth - el.clientWidth - el.scrollLeft;\n }\n else {\n return el.scrollLeft;\n }\n }\n else if (isRtl && getRtlScrollAxisType() == 1 /* NEGATED */) {\n // For NEGATED, scrollLeft is -(scrollWidth - clientWidth) when scrolled all the way left and\n // 0 when scrolled all the way right.\n if (from == LEFT) {\n return el.scrollLeft + el.scrollWidth - el.clientWidth;\n }\n else {\n return -el.scrollLeft;\n }\n }\n else {\n // For NORMAL, as well as non-RTL contexts, scrollLeft is 0 when scrolled all the way left and\n // (scrollWidth - clientWidth) when scrolled all the way right.\n if (from == LEFT) {\n return el.scrollLeft;\n }\n else {\n return el.scrollWidth - el.clientWidth - el.scrollLeft;\n }\n }\n }\n}\nCdkScrollable.ɵfac = function CdkScrollable_Factory(t) { return new (t || CdkScrollable)(ɵngcc0.ɵɵdirectiveInject(ɵngcc0.ElementRef), ɵngcc0.ɵɵdirectiveInject(ScrollDispatcher), ɵngcc0.ɵɵdirectiveInject(ɵngcc0.NgZone), ɵngcc0.ɵɵdirectiveInject(ɵngcc2.Directionality, 8)); };\nCdkScrollable.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: CdkScrollable, selectors: [[\"\", \"cdk-scrollable\", \"\"], [\"\", \"cdkScrollable\", \"\"]] });\nCdkScrollable.ctorParameters = () => [\n { type: ElementRef },\n { type: ScrollDispatcher },\n { type: NgZone },\n { type: Directionality, decorators: [{ type: Optional }] }\n];\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(CdkScrollable, [{\n type: Directive,\n args: [{\n selector: '[cdk-scrollable], [cdkScrollable]'\n }]\n }], function () { return [{ type: ɵngcc0.ElementRef }, { type: ScrollDispatcher }, { type: ɵngcc0.NgZone }, { type: ɵngcc2.Directionality, decorators: [{\n type: Optional\n }] }]; }, null); })();\n\n/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n/** Time in ms to throttle the resize events by default. */\nconst DEFAULT_RESIZE_TIME = 20;\n/**\n * Simple utility for getting the bounds of the browser viewport.\n * @docs-private\n */\nclass ViewportRuler {\n constructor(_platform, ngZone, document) {\n this._platform = _platform;\n /** Stream of viewport change events. */\n this._change = new Subject();\n /** Event listener that will be used to handle the viewport change events. */\n this._changeListener = (event) => {\n this._change.next(event);\n };\n this._document = document;\n ngZone.runOutsideAngular(() => {\n if (_platform.isBrowser) {\n const window = this._getWindow();\n // Note that bind the events ourselves, rather than going through something like RxJS's\n // `fromEvent` so that we can ensure that they're bound outside of the NgZone.\n window.addEventListener('resize', this._changeListener);\n window.addEventListener('orientationchange', this._changeListener);\n }\n // Clear the cached position so that the viewport is re-measured next time it is required.\n // We don't need to keep track of the subscription, because it is completed on destroy.\n this.change().subscribe(() => this._viewportSize = null);\n });\n }\n ngOnDestroy() {\n if (this._platform.isBrowser) {\n const window = this._getWindow();\n window.removeEventListener('resize', this._changeListener);\n window.removeEventListener('orientationchange', this._changeListener);\n }\n this._change.complete();\n }\n /** Returns the viewport's width and height. */\n getViewportSize() {\n if (!this._viewportSize) {\n this._updateViewportSize();\n }\n const output = { width: this._viewportSize.width, height: this._viewportSize.height };\n // If we're not on a browser, don't cache the size since it'll be mocked out anyway.\n if (!this._platform.isBrowser) {\n this._viewportSize = null;\n }\n return output;\n }\n /** Gets a ClientRect for the viewport's bounds. */\n getViewportRect() {\n // Use the document element's bounding rect rather than the window scroll properties\n // (e.g. pageYOffset, scrollY) due to in issue in Chrome and IE where window scroll\n // properties and client coordinates (boundingClientRect, clientX/Y, etc.) are in different\n // conceptual viewports. Under most circumstances these viewports are equivalent, but they\n // can disagree when the page is pinch-zoomed (on devices that support touch).\n // See https://bugs.chromium.org/p/chromium/issues/detail?id=489206#c4\n // We use the documentElement instead of the body because, by default (without a css reset)\n // browsers typically give the document body an 8px margin, which is not included in\n // getBoundingClientRect().\n const scrollPosition = this.getViewportScrollPosition();\n const { width, height } = this.getViewportSize();\n return {\n top: scrollPosition.top,\n left: scrollPosition.left,\n bottom: scrollPosition.top + height,\n right: scrollPosition.left + width,\n height,\n width,\n };\n }\n /** Gets the (top, left) scroll position of the viewport. */\n getViewportScrollPosition() {\n // While we can get a reference to the fake document\n // during SSR, it doesn't have getBoundingClientRect.\n if (!this._platform.isBrowser) {\n return { top: 0, left: 0 };\n }\n // The top-left-corner of the viewport is determined by the scroll position of the document\n // body, normally just (scrollLeft, scrollTop). However, Chrome and Firefox disagree about\n // whether `document.body` or `document.documentElement` is the scrolled element, so reading\n // `scrollTop` and `scrollLeft` is inconsistent. However, using the bounding rect of\n // `document.documentElement` works consistently, where the `top` and `left` values will\n // equal negative the scroll position.\n const document = this._document;\n const window = this._getWindow();\n const documentElement = document.documentElement;\n const documentRect = documentElement.getBoundingClientRect();\n const top = -documentRect.top || document.body.scrollTop || window.scrollY ||\n documentElement.scrollTop || 0;\n const left = -documentRect.left || document.body.scrollLeft || window.scrollX ||\n documentElement.scrollLeft || 0;\n return { top, left };\n }\n /**\n * Returns a stream that emits whenever the size of the viewport changes.\n * This stream emits outside of the Angular zone.\n * @param throttleTime Time in milliseconds to throttle the stream.\n */\n change(throttleTime = DEFAULT_RESIZE_TIME) {\n return throttleTime > 0 ? this._change.pipe(auditTime(throttleTime)) : this._change;\n }\n /** Use defaultView of injected document if available or fallback to global window reference */\n _getWindow() {\n return this._document.defaultView || window;\n }\n /** Updates the cached viewport size. */\n _updateViewportSize() {\n const window = this._getWindow();\n this._viewportSize = this._platform.isBrowser ?\n { width: window.innerWidth, height: window.innerHeight } :\n { width: 0, height: 0 };\n }\n}\nViewportRuler.ɵfac = function ViewportRuler_Factory(t) { return new (t || ViewportRuler)(ɵngcc0.ɵɵinject(ɵngcc1.Platform), ɵngcc0.ɵɵinject(ɵngcc0.NgZone), ɵngcc0.ɵɵinject(DOCUMENT, 8)); };\nViewportRuler.ɵprov = i0.ɵɵdefineInjectable({ factory: function ViewportRuler_Factory() { return new ViewportRuler(i0.ɵɵinject(i1.Platform), i0.ɵɵinject(i0.NgZone), i0.ɵɵinject(i2.DOCUMENT, 8)); }, token: ViewportRuler, providedIn: \"root\" });\nViewportRuler.ctorParameters = () => [\n { type: Platform },\n { type: NgZone },\n { type: undefined, decorators: [{ type: Optional }, { type: Inject, args: [DOCUMENT,] }] }\n];\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(ViewportRuler, [{\n type: Injectable,\n args: [{ providedIn: 'root' }]\n }], function () { return [{ type: ɵngcc1.Platform }, { type: ɵngcc0.NgZone }, { type: undefined, decorators: [{\n type: Optional\n }, {\n type: Inject,\n args: [DOCUMENT]\n }] }]; }, null); })();\n\n/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n/** Checks if the given ranges are equal. */\nfunction rangesEqual(r1, r2) {\n return r1.start == r2.start && r1.end == r2.end;\n}\n/**\n * Scheduler to be used for scroll events. Needs to fall back to\n * something that doesn't rely on requestAnimationFrame on environments\n * that don't support it (e.g. server-side rendering).\n */\nconst SCROLL_SCHEDULER = typeof requestAnimationFrame !== 'undefined' ? animationFrameScheduler : asapScheduler;\n/** A viewport that virtualizes its scrolling with the help of `CdkVirtualForOf`. */\nclass CdkVirtualScrollViewport extends CdkScrollable {\n constructor(elementRef, _changeDetectorRef, ngZone, _scrollStrategy, dir, scrollDispatcher, viewportRuler) {\n super(elementRef, scrollDispatcher, ngZone, dir);\n this.elementRef = elementRef;\n this._changeDetectorRef = _changeDetectorRef;\n this._scrollStrategy = _scrollStrategy;\n /** Emits when the viewport is detached from a CdkVirtualForOf. */\n this._detachedSubject = new Subject();\n /** Emits when the rendered range changes. */\n this._renderedRangeSubject = new Subject();\n this._orientation = 'vertical';\n this._appendOnly = false;\n // Note: we don't use the typical EventEmitter here because we need to subscribe to the scroll\n // strategy lazily (i.e. only if the user is actually listening to the events). We do this because\n // depending on how the strategy calculates the scrolled index, it may come at a cost to\n // performance.\n /** Emits when the index of the first element visible in the viewport changes. */\n this.scrolledIndexChange = new Observable((observer) => this._scrollStrategy.scrolledIndexChange.subscribe(index => Promise.resolve().then(() => this.ngZone.run(() => observer.next(index)))));\n /** A stream that emits whenever the rendered range changes. */\n this.renderedRangeStream = this._renderedRangeSubject;\n /**\n * The total size of all content (in pixels), including content that is not currently rendered.\n */\n this._totalContentSize = 0;\n /** A string representing the `style.width` property value to be used for the spacer element. */\n this._totalContentWidth = '';\n /** A string representing the `style.height` property value to be used for the spacer element. */\n this._totalContentHeight = '';\n /** The currently rendered range of indices. */\n this._renderedRange = { start: 0, end: 0 };\n /** The length of the data bound to this viewport (in number of items). */\n this._dataLength = 0;\n /** The size of the viewport (in pixels). */\n this._viewportSize = 0;\n /** The last rendered content offset that was set. */\n this._renderedContentOffset = 0;\n /**\n * Whether the last rendered content offset was to the end of the content (and therefore needs to\n * be rewritten as an offset to the start of the content).\n */\n this._renderedContentOffsetNeedsRewrite = false;\n /** Whether there is a pending change detection cycle. */\n this._isChangeDetectionPending = false;\n /** A list of functions to run after the next change detection cycle. */\n this._runAfterChangeDetection = [];\n /** Subscription to changes in the viewport size. */\n this._viewportChanges = Subscription.EMPTY;\n if (!_scrollStrategy && (typeof ngDevMode === 'undefined' || ngDevMode)) {\n throw Error('Error: cdk-virtual-scroll-viewport requires the \"itemSize\" property to be set.');\n }\n this._viewportChanges = viewportRuler.change().subscribe(() => {\n this.checkViewportSize();\n });\n }\n /** The direction the viewport scrolls. */\n get orientation() {\n return this._orientation;\n }\n set orientation(orientation) {\n if (this._orientation !== orientation) {\n this._orientation = orientation;\n this._calculateSpacerSize();\n }\n }\n /**\n * Whether rendered items should persist in the DOM after scrolling out of view. By default, items\n * will be removed.\n */\n get appendOnly() {\n return this._appendOnly;\n }\n set appendOnly(value) {\n this._appendOnly = coerceBooleanProperty(value);\n }\n ngOnInit() {\n super.ngOnInit();\n // It's still too early to measure the viewport at this point. Deferring with a promise allows\n // the Viewport to be rendered with the correct size before we measure. We run this outside the\n // zone to avoid causing more change detection cycles. We handle the change detection loop\n // ourselves instead.\n this.ngZone.runOutsideAngular(() => Promise.resolve().then(() => {\n this._measureViewportSize();\n this._scrollStrategy.attach(this);\n this.elementScrolled()\n .pipe(\n // Start off with a fake scroll event so we properly detect our initial position.\n startWith(null), \n // Collect multiple events into one until the next animation frame. This way if\n // there are multiple scroll events in the same frame we only need to recheck\n // our layout once.\n auditTime(0, SCROLL_SCHEDULER))\n .subscribe(() => this._scrollStrategy.onContentScrolled());\n this._markChangeDetectionNeeded();\n }));\n }\n ngOnDestroy() {\n this.detach();\n this._scrollStrategy.detach();\n // Complete all subjects\n this._renderedRangeSubject.complete();\n this._detachedSubject.complete();\n this._viewportChanges.unsubscribe();\n super.ngOnDestroy();\n }\n /** Attaches a `CdkVirtualScrollRepeater` to this viewport. */\n attach(forOf) {\n if (this._forOf && (typeof ngDevMode === 'undefined' || ngDevMode)) {\n throw Error('CdkVirtualScrollViewport is already attached.');\n }\n // Subscribe to the data stream of the CdkVirtualForOf to keep track of when the data length\n // changes. Run outside the zone to avoid triggering change detection, since we're managing the\n // change detection loop ourselves.\n this.ngZone.runOutsideAngular(() => {\n this._forOf = forOf;\n this._forOf.dataStream.pipe(takeUntil(this._detachedSubject)).subscribe(data => {\n const newLength = data.length;\n if (newLength !== this._dataLength) {\n this._dataLength = newLength;\n this._scrollStrategy.onDataLengthChanged();\n }\n this._doChangeDetection();\n });\n });\n }\n /** Detaches the current `CdkVirtualForOf`. */\n detach() {\n this._forOf = null;\n this._detachedSubject.next();\n }\n /** Gets the length of the data bound to this viewport (in number of items). */\n getDataLength() {\n return this._dataLength;\n }\n /** Gets the size of the viewport (in pixels). */\n getViewportSize() {\n return this._viewportSize;\n }\n // TODO(mmalerba): This is technically out of sync with what's really rendered until a render\n // cycle happens. I'm being careful to only call it after the render cycle is complete and before\n // setting it to something else, but its error prone and should probably be split into\n // `pendingRange` and `renderedRange`, the latter reflecting whats actually in the DOM.\n /** Get the current rendered range of items. */\n getRenderedRange() {\n return this._renderedRange;\n }\n /**\n * Sets the total size of all content (in pixels), including content that is not currently\n * rendered.\n */\n setTotalContentSize(size) {\n if (this._totalContentSize !== size) {\n this._totalContentSize = size;\n this._calculateSpacerSize();\n this._markChangeDetectionNeeded();\n }\n }\n /** Sets the currently rendered range of indices. */\n setRenderedRange(range) {\n if (!rangesEqual(this._renderedRange, range)) {\n if (this.appendOnly) {\n range = { start: 0, end: Math.max(this._renderedRange.end, range.end) };\n }\n this._renderedRangeSubject.next(this._renderedRange = range);\n this._markChangeDetectionNeeded(() => this._scrollStrategy.onContentRendered());\n }\n }\n /**\n * Gets the offset from the start of the viewport to the start of the rendered data (in pixels).\n */\n getOffsetToRenderedContentStart() {\n return this._renderedContentOffsetNeedsRewrite ? null : this._renderedContentOffset;\n }\n /**\n * Sets the offset from the start of the viewport to either the start or end of the rendered data\n * (in pixels).\n */\n setRenderedContentOffset(offset, to = 'to-start') {\n // For a horizontal viewport in a right-to-left language we need to translate along the x-axis\n // in the negative direction.\n const isRtl = this.dir && this.dir.value == 'rtl';\n const isHorizontal = this.orientation == 'horizontal';\n const axis = isHorizontal ? 'X' : 'Y';\n const axisDirection = isHorizontal && isRtl ? -1 : 1;\n let transform = `translate${axis}(${Number(axisDirection * offset)}px)`;\n this._renderedContentOffset = offset;\n if (to === 'to-end') {\n transform += ` translate${axis}(-100%)`;\n // The viewport should rewrite this as a `to-start` offset on the next render cycle. Otherwise\n // elements will appear to expand in the wrong direction (e.g. `mat-expansion-panel` would\n // expand upward).\n this._renderedContentOffsetNeedsRewrite = true;\n }\n if (this._renderedContentTransform != transform) {\n // We know this value is safe because we parse `offset` with `Number()` before passing it\n // into the string.\n this._renderedContentTransform = transform;\n this._markChangeDetectionNeeded(() => {\n if (this._renderedContentOffsetNeedsRewrite) {\n this._renderedContentOffset -= this.measureRenderedContentSize();\n this._renderedContentOffsetNeedsRewrite = false;\n this.setRenderedContentOffset(this._renderedContentOffset);\n }\n else {\n this._scrollStrategy.onRenderedOffsetChanged();\n }\n });\n }\n }\n /**\n * Scrolls to the given offset from the start of the viewport. Please note that this is not always\n * the same as setting `scrollTop` or `scrollLeft`. In a horizontal viewport with right-to-left\n * direction, this would be the equivalent of setting a fictional `scrollRight` property.\n * @param offset The offset to scroll to.\n * @param behavior The ScrollBehavior to use when scrolling. Default is behavior is `auto`.\n */\n scrollToOffset(offset, behavior = 'auto') {\n const options = { behavior };\n if (this.orientation === 'horizontal') {\n options.start = offset;\n }\n else {\n options.top = offset;\n }\n this.scrollTo(options);\n }\n /**\n * Scrolls to the offset for the given index.\n * @param index The index of the element to scroll to.\n * @param behavior The ScrollBehavior to use when scrolling. Default is behavior is `auto`.\n */\n scrollToIndex(index, behavior = 'auto') {\n this._scrollStrategy.scrollToIndex(index, behavior);\n }\n /**\n * Gets the current scroll offset from the start of the viewport (in pixels).\n * @param from The edge to measure the offset from. Defaults to 'top' in vertical mode and 'start'\n * in horizontal mode.\n */\n measureScrollOffset(from) {\n return from ?\n super.measureScrollOffset(from) :\n super.measureScrollOffset(this.orientation === 'horizontal' ? 'start' : 'top');\n }\n /** Measure the combined size of all of the rendered items. */\n measureRenderedContentSize() {\n const contentEl = this._contentWrapper.nativeElement;\n return this.orientation === 'horizontal' ? contentEl.offsetWidth : contentEl.offsetHeight;\n }\n /**\n * Measure the total combined size of the given range. Throws if the range includes items that are\n * not rendered.\n */\n measureRangeSize(range) {\n if (!this._forOf) {\n return 0;\n }\n return this._forOf.measureRangeSize(range, this.orientation);\n }\n /** Update the viewport dimensions and re-render. */\n checkViewportSize() {\n // TODO: Cleanup later when add logic for handling content resize\n this._measureViewportSize();\n this._scrollStrategy.onDataLengthChanged();\n }\n /** Measure the viewport size. */\n _measureViewportSize() {\n const viewportEl = this.elementRef.nativeElement;\n this._viewportSize = this.orientation === 'horizontal' ?\n viewportEl.clientWidth : viewportEl.clientHeight;\n }\n /** Queue up change detection to run. */\n _markChangeDetectionNeeded(runAfter) {\n if (runAfter) {\n this._runAfterChangeDetection.push(runAfter);\n }\n // Use a Promise to batch together calls to `_doChangeDetection`. This way if we set a bunch of\n // properties sequentially we only have to run `_doChangeDetection` once at the end.\n if (!this._isChangeDetectionPending) {\n this._isChangeDetectionPending = true;\n this.ngZone.runOutsideAngular(() => Promise.resolve().then(() => {\n this._doChangeDetection();\n }));\n }\n }\n /** Run change detection. */\n _doChangeDetection() {\n this._isChangeDetectionPending = false;\n // Apply the content transform. The transform can't be set via an Angular binding because\n // bypassSecurityTrustStyle is banned in Google. However the value is safe, it's composed of\n // string literals, a variable that can only be 'X' or 'Y', and user input that is run through\n // the `Number` function first to coerce it to a numeric value.\n this._contentWrapper.nativeElement.style.transform = this._renderedContentTransform;\n // Apply changes to Angular bindings. Note: We must call `markForCheck` to run change detection\n // from the root, since the repeated items are content projected in. Calling `detectChanges`\n // instead does not properly check the projected content.\n this.ngZone.run(() => this._changeDetectorRef.markForCheck());\n const runAfterChangeDetection = this._runAfterChangeDetection;\n this._runAfterChangeDetection = [];\n for (const fn of runAfterChangeDetection) {\n fn();\n }\n }\n /** Calculates the `style.width` and `style.height` for the spacer element. */\n _calculateSpacerSize() {\n this._totalContentHeight =\n this.orientation === 'horizontal' ? '' : `${this._totalContentSize}px`;\n this._totalContentWidth =\n this.orientation === 'horizontal' ? `${this._totalContentSize}px` : '';\n }\n}\nCdkVirtualScrollViewport.ɵfac = function CdkVirtualScrollViewport_Factory(t) { return new (t || CdkVirtualScrollViewport)(ɵngcc0.ɵɵdirectiveInject(ɵngcc0.ElementRef), ɵngcc0.ɵɵdirectiveInject(ɵngcc0.ChangeDetectorRef), ɵngcc0.ɵɵdirectiveInject(ɵngcc0.NgZone), ɵngcc0.ɵɵdirectiveInject(VIRTUAL_SCROLL_STRATEGY, 8), ɵngcc0.ɵɵdirectiveInject(ɵngcc2.Directionality, 8), ɵngcc0.ɵɵdirectiveInject(ScrollDispatcher), ɵngcc0.ɵɵdirectiveInject(ViewportRuler)); };\nCdkVirtualScrollViewport.ɵcmp = /*@__PURE__*/ ɵngcc0.ɵɵdefineComponent({ type: CdkVirtualScrollViewport, selectors: [[\"cdk-virtual-scroll-viewport\"]], viewQuery: function CdkVirtualScrollViewport_Query(rf, ctx) { if (rf & 1) {\n ɵngcc0.ɵɵviewQuery(_c0, 7);\n } if (rf & 2) {\n let _t;\n ɵngcc0.ɵɵqueryRefresh(_t = ɵngcc0.ɵɵloadQuery()) && (ctx._contentWrapper = _t.first);\n } }, hostAttrs: [1, \"cdk-virtual-scroll-viewport\"], hostVars: 4, hostBindings: function CdkVirtualScrollViewport_HostBindings(rf, ctx) { if (rf & 2) {\n ɵngcc0.ɵɵclassProp(\"cdk-virtual-scroll-orientation-horizontal\", ctx.orientation === \"horizontal\")(\"cdk-virtual-scroll-orientation-vertical\", ctx.orientation !== \"horizontal\");\n } }, inputs: { orientation: \"orientation\", appendOnly: \"appendOnly\" }, outputs: { scrolledIndexChange: \"scrolledIndexChange\" }, features: [ɵngcc0.ɵɵProvidersFeature([{\n provide: CdkScrollable,\n useExisting: CdkVirtualScrollViewport\n }]), ɵngcc0.ɵɵInheritDefinitionFeature], 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) {\n ɵngcc0.ɵɵprojectionDef();\n ɵngcc0.ɵɵelementStart(0, \"div\", 0, 1);\n ɵngcc0.ɵɵprojection(2);\n ɵngcc0.ɵɵelementEnd();\n ɵngcc0.ɵɵelement(3, \"div\", 2);\n } if (rf & 2) {\n ɵngcc0.ɵɵadvance(3);\n ɵngcc0.ɵɵstyleProp(\"width\", ctx._totalContentWidth)(\"height\", ctx._totalContentHeight);\n } }, styles: [\"cdk-virtual-scroll-viewport{display:block;position:relative;overflow:auto;contain:strict;transform:translateZ(0);will-change:scroll-position;-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{position:absolute;top:0;left:0;height:1px;width:1px;transform-origin:0 0}[dir=rtl] .cdk-virtual-scroll-spacer{right:0;left:auto;transform-origin:100% 0}\\n\"], encapsulation: 2, changeDetection: 0 });\nCdkVirtualScrollViewport.ctorParameters = () => [\n { type: ElementRef },\n { type: ChangeDetectorRef },\n { type: NgZone },\n { type: undefined, decorators: [{ type: Optional }, { type: Inject, args: [VIRTUAL_SCROLL_STRATEGY,] }] },\n { type: Directionality, decorators: [{ type: Optional }] },\n { type: ScrollDispatcher },\n { type: ViewportRuler }\n];\nCdkVirtualScrollViewport.propDecorators = {\n orientation: [{ type: Input }],\n appendOnly: [{ type: Input }],\n scrolledIndexChange: [{ type: Output }],\n _contentWrapper: [{ type: ViewChild, args: ['contentWrapper', { static: true },] }]\n};\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(CdkVirtualScrollViewport, [{\n type: Component,\n args: [{\n selector: 'cdk-virtual-scroll-viewport',\n template: \"\\n
\\n \\n
\\n\\n
\\n\",\n host: {\n 'class': 'cdk-virtual-scroll-viewport',\n '[class.cdk-virtual-scroll-orientation-horizontal]': 'orientation === \"horizontal\"',\n '[class.cdk-virtual-scroll-orientation-vertical]': 'orientation !== \"horizontal\"'\n },\n encapsulation: ViewEncapsulation.None,\n changeDetection: ChangeDetectionStrategy.OnPush,\n providers: [{\n provide: CdkScrollable,\n useExisting: CdkVirtualScrollViewport\n }],\n styles: [\"cdk-virtual-scroll-viewport{display:block;position:relative;overflow:auto;contain:strict;transform:translateZ(0);will-change:scroll-position;-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{position:absolute;top:0;left:0;height:1px;width:1px;transform-origin:0 0}[dir=rtl] .cdk-virtual-scroll-spacer{right:0;left:auto;transform-origin:100% 0}\\n\"]\n }]\n }], function () { return [{ type: ɵngcc0.ElementRef }, { type: ɵngcc0.ChangeDetectorRef }, { type: ɵngcc0.NgZone }, { type: undefined, decorators: [{\n type: Optional\n }, {\n type: Inject,\n args: [VIRTUAL_SCROLL_STRATEGY]\n }] }, { type: ɵngcc2.Directionality, decorators: [{\n type: Optional\n }] }, { type: ScrollDispatcher }, { type: ViewportRuler }]; }, { scrolledIndexChange: [{\n type: Output\n }], orientation: [{\n type: Input\n }], appendOnly: [{\n type: Input\n }], _contentWrapper: [{\n type: ViewChild,\n args: ['contentWrapper', { static: true }]\n }] }); })();\n\n/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n/** Helper to extract the offset of a DOM Node in a certain direction. */\nfunction getOffset(orientation, direction, node) {\n const el = node;\n if (!el.getBoundingClientRect) {\n return 0;\n }\n const rect = el.getBoundingClientRect();\n if (orientation === 'horizontal') {\n return direction === 'start' ? rect.left : rect.right;\n }\n return direction === 'start' ? rect.top : rect.bottom;\n}\n/**\n * A directive similar to `ngForOf` to be used for rendering data inside a virtual scrolling\n * container.\n */\nclass CdkVirtualForOf {\n constructor(\n /** The view container to add items to. */\n _viewContainerRef, \n /** The template to use when stamping out new items. */\n _template, \n /** The set of available differs. */\n _differs, \n /** The strategy used to render items in the virtual scroll viewport. */\n _viewRepeater, \n /** The virtual scrolling viewport that these items are being rendered in. */\n _viewport, ngZone) {\n this._viewContainerRef = _viewContainerRef;\n this._template = _template;\n this._differs = _differs;\n this._viewRepeater = _viewRepeater;\n this._viewport = _viewport;\n /** Emits when the rendered view of the data changes. */\n this.viewChange = new Subject();\n /** Subject that emits when a new DataSource instance is given. */\n this._dataSourceChanges = new Subject();\n /** Emits whenever the data in the current DataSource changes. */\n this.dataStream = this._dataSourceChanges\n .pipe(\n // Start off with null `DataSource`.\n startWith(null), \n // Bundle up the previous and current data sources so we can work with both.\n pairwise(), \n // Use `_changeDataSource` to disconnect from the previous data source and connect to the\n // new one, passing back a stream of data changes which we run through `switchMap` to give\n // us a data stream that emits the latest data from whatever the current `DataSource` is.\n switchMap(([prev, cur]) => this._changeDataSource(prev, cur)), \n // Replay the last emitted data when someone subscribes.\n shareReplay(1));\n /** The differ used to calculate changes to the data. */\n this._differ = null;\n /** Whether the rendered data should be updated during the next ngDoCheck cycle. */\n this._needsUpdate = false;\n this._destroyed = new Subject();\n this.dataStream.subscribe(data => {\n this._data = data;\n this._onRenderedDataChange();\n });\n this._viewport.renderedRangeStream.pipe(takeUntil(this._destroyed)).subscribe(range => {\n this._renderedRange = range;\n ngZone.run(() => this.viewChange.next(this._renderedRange));\n this._onRenderedDataChange();\n });\n this._viewport.attach(this);\n }\n /** The DataSource to display. */\n get cdkVirtualForOf() {\n return this._cdkVirtualForOf;\n }\n set cdkVirtualForOf(value) {\n this._cdkVirtualForOf = value;\n if (isDataSource(value)) {\n this._dataSourceChanges.next(value);\n }\n else {\n // If value is an an NgIterable, convert it to an array.\n this._dataSourceChanges.next(new ArrayDataSource(isObservable(value) ? value : Array.from(value || [])));\n }\n }\n /**\n * The `TrackByFunction` to use for tracking changes. The `TrackByFunction` takes the index and\n * the item and produces a value to be used as the item's identity when tracking changes.\n */\n get cdkVirtualForTrackBy() {\n return this._cdkVirtualForTrackBy;\n }\n set cdkVirtualForTrackBy(fn) {\n this._needsUpdate = true;\n this._cdkVirtualForTrackBy = fn ?\n (index, item) => fn(index + (this._renderedRange ? this._renderedRange.start : 0), item) :\n undefined;\n }\n /** The template used to stamp out new elements. */\n set cdkVirtualForTemplate(value) {\n if (value) {\n this._needsUpdate = true;\n this._template = value;\n }\n }\n /**\n * The size of the cache used to store templates that are not being used for re-use later.\n * Setting the cache size to `0` will disable caching. Defaults to 20 templates.\n */\n get cdkVirtualForTemplateCacheSize() {\n return this._viewRepeater.viewCacheSize;\n }\n set cdkVirtualForTemplateCacheSize(size) {\n this._viewRepeater.viewCacheSize = coerceNumberProperty(size);\n }\n /**\n * Measures the combined size (width for horizontal orientation, height for vertical) of all items\n * in the specified range. Throws an error if the range includes items that are not currently\n * rendered.\n */\n measureRangeSize(range, orientation) {\n if (range.start >= range.end) {\n return 0;\n }\n if ((range.start < this._renderedRange.start || range.end > this._renderedRange.end) &&\n (typeof ngDevMode === 'undefined' || ngDevMode)) {\n throw Error(`Error: attempted to measure an item that isn't rendered.`);\n }\n // The index into the list of rendered views for the first item in the range.\n const renderedStartIndex = range.start - this._renderedRange.start;\n // The length of the range we're measuring.\n const rangeLen = range.end - range.start;\n // Loop over all the views, find the first and land node and compute the size by subtracting\n // the top of the first node from the bottom of the last one.\n let firstNode;\n let lastNode;\n // Find the first node by starting from the beginning and going forwards.\n for (let i = 0; i < rangeLen; i++) {\n const view = this._viewContainerRef.get(i + renderedStartIndex);\n if (view && view.rootNodes.length) {\n firstNode = lastNode = view.rootNodes[0];\n break;\n }\n }\n // Find the last node by starting from the end and going backwards.\n for (let i = rangeLen - 1; i > -1; i--) {\n const view = this._viewContainerRef.get(i + renderedStartIndex);\n if (view && view.rootNodes.length) {\n lastNode = view.rootNodes[view.rootNodes.length - 1];\n break;\n }\n }\n return firstNode && lastNode ?\n getOffset(orientation, 'end', lastNode) - getOffset(orientation, 'start', firstNode) : 0;\n }\n ngDoCheck() {\n if (this._differ && this._needsUpdate) {\n // TODO(mmalerba): We should differentiate needs update due to scrolling and a new portion of\n // this list being rendered (can use simpler algorithm) vs needs update due to data actually\n // changing (need to do this diff).\n const changes = this._differ.diff(this._renderedItems);\n if (!changes) {\n this._updateContext();\n }\n else {\n this._applyChanges(changes);\n }\n this._needsUpdate = false;\n }\n }\n ngOnDestroy() {\n this._viewport.detach();\n this._dataSourceChanges.next(undefined);\n this._dataSourceChanges.complete();\n this.viewChange.complete();\n this._destroyed.next();\n this._destroyed.complete();\n this._viewRepeater.detach();\n }\n /** React to scroll state changes in the viewport. */\n _onRenderedDataChange() {\n if (!this._renderedRange) {\n return;\n }\n this._renderedItems = this._data.slice(this._renderedRange.start, this._renderedRange.end);\n if (!this._differ) {\n // Use a wrapper function for the `trackBy` so any new values are\n // picked up automatically without having to recreate the differ.\n this._differ = this._differs.find(this._renderedItems).create((index, item) => {\n return this.cdkVirtualForTrackBy ? this.cdkVirtualForTrackBy(index, item) : item;\n });\n }\n this._needsUpdate = true;\n }\n /** Swap out one `DataSource` for another. */\n _changeDataSource(oldDs, newDs) {\n if (oldDs) {\n oldDs.disconnect(this);\n }\n this._needsUpdate = true;\n return newDs ? newDs.connect(this) : of();\n }\n /** Update the `CdkVirtualForOfContext` for all views. */\n _updateContext() {\n const count = this._data.length;\n let i = this._viewContainerRef.length;\n while (i--) {\n const view = this._viewContainerRef.get(i);\n view.context.index = this._renderedRange.start + i;\n view.context.count = count;\n this._updateComputedContextProperties(view.context);\n view.detectChanges();\n }\n }\n /** Apply changes to the DOM. */\n _applyChanges(changes) {\n this._viewRepeater.applyChanges(changes, this._viewContainerRef, (record, _adjustedPreviousIndex, currentIndex) => this._getEmbeddedViewArgs(record, currentIndex), (record) => record.item);\n // Update $implicit for any items that had an identity change.\n changes.forEachIdentityChange((record) => {\n const view = this._viewContainerRef.get(record.currentIndex);\n view.context.$implicit = record.item;\n });\n // Update the context variables on all items.\n const count = this._data.length;\n let i = this._viewContainerRef.length;\n while (i--) {\n const view = this._viewContainerRef.get(i);\n view.context.index = this._renderedRange.start + i;\n view.context.count = count;\n this._updateComputedContextProperties(view.context);\n }\n }\n /** Update the computed properties on the `CdkVirtualForOfContext`. */\n _updateComputedContextProperties(context) {\n context.first = context.index === 0;\n context.last = context.index === context.count - 1;\n context.even = context.index % 2 === 0;\n context.odd = !context.even;\n }\n _getEmbeddedViewArgs(record, index) {\n // Note that it's important that we insert the item directly at the proper index,\n // rather than inserting it and the moving it in place, because if there's a directive\n // on the same node that injects the `ViewContainerRef`, Angular will insert another\n // comment node which can throw off the move when it's being repeated for all items.\n return {\n templateRef: this._template,\n context: {\n $implicit: record.item,\n // It's guaranteed that the iterable is not \"undefined\" or \"null\" because we only\n // generate views for elements if the \"cdkVirtualForOf\" iterable has elements.\n cdkVirtualForOf: this._cdkVirtualForOf,\n index: -1,\n count: -1,\n first: false,\n last: false,\n odd: false,\n even: false\n },\n index,\n };\n }\n}\nCdkVirtualForOf.ɵfac = function CdkVirtualForOf_Factory(t) { return new (t || CdkVirtualForOf)(ɵngcc0.ɵɵdirectiveInject(ɵngcc0.ViewContainerRef), ɵngcc0.ɵɵdirectiveInject(ɵngcc0.TemplateRef), ɵngcc0.ɵɵdirectiveInject(ɵngcc0.IterableDiffers), ɵngcc0.ɵɵdirectiveInject(_VIEW_REPEATER_STRATEGY), ɵngcc0.ɵɵdirectiveInject(CdkVirtualScrollViewport, 4), ɵngcc0.ɵɵdirectiveInject(ɵngcc0.NgZone)); };\nCdkVirtualForOf.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: CdkVirtualForOf, selectors: [[\"\", \"cdkVirtualFor\", \"\", \"cdkVirtualForOf\", \"\"]], inputs: { cdkVirtualForOf: \"cdkVirtualForOf\", cdkVirtualForTrackBy: \"cdkVirtualForTrackBy\", cdkVirtualForTemplate: \"cdkVirtualForTemplate\", cdkVirtualForTemplateCacheSize: \"cdkVirtualForTemplateCacheSize\" }, features: [ɵngcc0.ɵɵProvidersFeature([\n { provide: _VIEW_REPEATER_STRATEGY, useClass: _RecycleViewRepeaterStrategy },\n ])] });\nCdkVirtualForOf.ctorParameters = () => [\n { type: ViewContainerRef },\n { type: TemplateRef },\n { type: IterableDiffers },\n { type: _RecycleViewRepeaterStrategy, decorators: [{ type: Inject, args: [_VIEW_REPEATER_STRATEGY,] }] },\n { type: CdkVirtualScrollViewport, decorators: [{ type: SkipSelf }] },\n { type: NgZone }\n];\nCdkVirtualForOf.propDecorators = {\n cdkVirtualForOf: [{ type: Input }],\n cdkVirtualForTrackBy: [{ type: Input }],\n cdkVirtualForTemplate: [{ type: Input }],\n cdkVirtualForTemplateCacheSize: [{ type: Input }]\n};\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(CdkVirtualForOf, [{\n type: Directive,\n args: [{\n selector: '[cdkVirtualFor][cdkVirtualForOf]',\n providers: [\n { provide: _VIEW_REPEATER_STRATEGY, useClass: _RecycleViewRepeaterStrategy },\n ]\n }]\n }], function () { return [{ type: ɵngcc0.ViewContainerRef }, { type: ɵngcc0.TemplateRef }, { type: ɵngcc0.IterableDiffers }, { type: ɵngcc3._RecycleViewRepeaterStrategy, decorators: [{\n type: Inject,\n args: [_VIEW_REPEATER_STRATEGY]\n }] }, { type: CdkVirtualScrollViewport, decorators: [{\n type: SkipSelf\n }] }, { type: ɵngcc0.NgZone }]; }, { cdkVirtualForOf: [{\n type: Input\n }], cdkVirtualForTrackBy: [{\n type: Input\n }], cdkVirtualForTemplate: [{\n type: Input\n }], cdkVirtualForTemplateCacheSize: [{\n type: Input\n }] }); })();\n\n/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\nclass CdkScrollableModule {\n}\nCdkScrollableModule.ɵfac = function CdkScrollableModule_Factory(t) { return new (t || CdkScrollableModule)(); };\nCdkScrollableModule.ɵmod = /*@__PURE__*/ ɵngcc0.ɵɵdefineNgModule({ type: CdkScrollableModule });\nCdkScrollableModule.ɵinj = /*@__PURE__*/ ɵngcc0.ɵɵdefineInjector({});\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(CdkScrollableModule, [{\n type: NgModule,\n args: [{\n exports: [CdkScrollable],\n declarations: [CdkScrollable]\n }]\n }], null, null); })();\n(function () { (typeof ngJitMode === \"undefined\" || ngJitMode) && ɵngcc0.ɵɵsetNgModuleScope(CdkScrollableModule, { declarations: [CdkScrollable], exports: [CdkScrollable] }); })();\n/**\n * @docs-primary-export\n */\nclass ScrollingModule {\n}\nScrollingModule.ɵfac = function ScrollingModule_Factory(t) { return new (t || ScrollingModule)(); };\nScrollingModule.ɵmod = /*@__PURE__*/ ɵngcc0.ɵɵdefineNgModule({ type: ScrollingModule });\nScrollingModule.ɵinj = /*@__PURE__*/ ɵngcc0.ɵɵdefineInjector({ imports: [[\n BidiModule,\n PlatformModule,\n CdkScrollableModule\n ], BidiModule, CdkScrollableModule] });\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(ScrollingModule, [{\n type: NgModule,\n args: [{\n imports: [\n BidiModule,\n PlatformModule,\n CdkScrollableModule\n ],\n exports: [\n BidiModule,\n CdkScrollableModule,\n CdkFixedSizeVirtualScroll,\n CdkVirtualForOf,\n CdkVirtualScrollViewport,\n ],\n declarations: [\n CdkFixedSizeVirtualScroll,\n CdkVirtualForOf,\n CdkVirtualScrollViewport,\n ]\n }]\n }], null, null); })();\n(function () { (typeof ngJitMode === \"undefined\" || ngJitMode) && ɵngcc0.ɵɵsetNgModuleScope(ScrollingModule, { declarations: function () { return [CdkFixedSizeVirtualScroll, CdkVirtualForOf, CdkVirtualScrollViewport]; }, imports: function () { return [BidiModule,\n PlatformModule, CdkScrollableModule]; }, exports: function () { return [BidiModule, CdkScrollableModule, CdkFixedSizeVirtualScroll, CdkVirtualForOf, CdkVirtualScrollViewport]; } }); })();\n\n/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n\n/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n\n/**\n * Generated bundle index. Do not edit.\n */\n\nexport { CdkFixedSizeVirtualScroll, CdkScrollable, CdkScrollableModule, CdkVirtualForOf, CdkVirtualScrollViewport, DEFAULT_RESIZE_TIME, DEFAULT_SCROLL_TIME, FixedSizeVirtualScrollStrategy, ScrollDispatcher, ScrollingModule, VIRTUAL_SCROLL_STRATEGY, ViewportRuler, _fixedSizeVirtualScrollStrategyFactory };\n\n","import { ElementRef } from '@angular/core';\n\n/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n/** Coerces a data-bound value (typically a string) to a boolean. */\nfunction coerceBooleanProperty(value) {\n return value != null && `${value}` !== 'false';\n}\n\n/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\nfunction coerceNumberProperty(value, fallbackValue = 0) {\n return _isNumberValue(value) ? Number(value) : fallbackValue;\n}\n/**\n * Whether the provided value is considered a number.\n * @docs-private\n */\nfunction _isNumberValue(value) {\n // parseFloat(value) handles most of the cases we're interested in (it treats null, empty string,\n // and other non-number values as NaN, where Number just uses 0) but it considers the string\n // '123hello' to be a valid number. Therefore we also check if Number(value) is NaN.\n return !isNaN(parseFloat(value)) && !isNaN(Number(value));\n}\n\n/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\nfunction coerceArray(value) {\n return Array.isArray(value) ? value : [value];\n}\n\n/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n/** Coerces a value to a CSS pixel value. */\nfunction coerceCssPixelValue(value) {\n if (value == null) {\n return '';\n }\n return typeof value === 'string' ? value : `${value}px`;\n}\n\n/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n/**\n * Coerces an ElementRef or an Element into an element.\n * Useful for APIs that can accept either a ref or the native element itself.\n */\nfunction coerceElement(elementOrRef) {\n return elementOrRef instanceof ElementRef ? elementOrRef.nativeElement : elementOrRef;\n}\n\n/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n/**\n * Coerces a value to an array of trimmed non-empty strings.\n * Any input that is not an array, `null` or `undefined` will be turned into a string\n * via `toString()` and subsequently split with the given separator.\n * `null` and `undefined` will result in an empty array.\n * This results in the following outcomes:\n * - `null` -> `[]`\n * - `[null]` -> `[\"null\"]`\n * - `[\"a\", \"b \", \" \"]` -> `[\"a\", \"b\"]`\n * - `[1, [2, 3]]` -> `[\"1\", \"2,3\"]`\n * - `[{ a: 0 }]` -> `[\"[object Object]\"]`\n * - `{ a: 0 }` -> `[\"[object\", \"Object]\"]`\n *\n * Useful for defining CSS classes or table columns.\n * @param value the value to coerce into an array of strings\n * @param separator split-separator if value isn't an array\n */\nfunction coerceStringArray(value, separator = /\\s+/) {\n const result = [];\n if (value != null) {\n const sourceValues = Array.isArray(value) ? value : `${value}`.split(separator);\n for (const sourceValue of sourceValues) {\n const trimmedString = `${sourceValue}`.trim();\n if (trimmedString) {\n result.push(trimmedString);\n }\n }\n }\n return result;\n}\n\n/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n\n/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n\nexport { _isNumberValue, coerceArray, coerceBooleanProperty, coerceCssPixelValue, coerceElement, coerceNumberProperty, coerceStringArray };\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\nimport { APP_BOOTSTRAP_LISTENER, PLATFORM_ID, NgModule, Injectable, InjectionToken, Inject, inject, NgZone, ɵɵdefineInjectable, ɵɵinject } from '@angular/core';\nimport { DOCUMENT, isPlatformBrowser, isPlatformServer } from '@angular/common';\nimport { Subject, BehaviorSubject, Observable, merge, asapScheduler, of, fromEvent } from 'rxjs';\nimport { filter, debounceTime, map, switchMap, takeUntil, take, tap } from 'rxjs/operators';\n\n/**\n * @fileoverview added by tsickle\n * Generated from: core/browser-provider.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n/**\n * Find all of the server-generated stylings, if any, and remove them\n * This will be in the form of inline classes and the style block in the\n * head of the DOM\n * @param {?} _document\n * @param {?} platformId\n * @return {?}\n */\nimport * as ɵngcc0 from '@angular/core';\nfunction removeStyles(_document, platformId) {\n return (/**\n * @return {?}\n */\n () => {\n if (isPlatformBrowser(platformId)) {\n /** @type {?} */\n const elements = Array.from(_document.querySelectorAll(`[class*=${CLASS_NAME}]`));\n // RegExp constructor should only be used if passing a variable to the constructor.\n // When using static regular expression it is more performant to use reg exp literal.\n // This is also needed to provide Safari 9 compatibility, please see\n // https://stackoverflow.com/questions/37919802 for more discussion.\n /** @type {?} */\n const classRegex = /\\bflex-layout-.+?\\b/g;\n elements.forEach((/**\n * @param {?} el\n * @return {?}\n */\n el => {\n el.classList.contains(`${CLASS_NAME}ssr`) && el.parentNode ?\n el.parentNode.removeChild(el) : el.className.replace(classRegex, '');\n }));\n }\n });\n}\n/**\n * Provider to remove SSR styles on the browser\n * @type {?}\n */\nconst BROWSER_PROVIDER = {\n provide: (/** @type {?} */ (APP_BOOTSTRAP_LISTENER)),\n useFactory: removeStyles,\n deps: [DOCUMENT, PLATFORM_ID],\n multi: true\n};\n/** @type {?} */\nconst CLASS_NAME = 'flex-layout-';\n\n/**\n * @fileoverview added by tsickle\n * Generated from: core/module.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n/**\n * *****************************************************************\n * Define module for common Angular Layout utilities\n * *****************************************************************\n */\nclass CoreModule {\n}\nCoreModule.ɵfac = function CoreModule_Factory(t) { return new (t || CoreModule)(); };\nCoreModule.ɵmod = /*@__PURE__*/ ɵngcc0.ɵɵdefineNgModule({ type: CoreModule });\nCoreModule.ɵinj = /*@__PURE__*/ ɵngcc0.ɵɵdefineInjector({ providers: [BROWSER_PROVIDER] });\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(CoreModule, [{\n type: NgModule,\n args: [{\n providers: [BROWSER_PROVIDER]\n }]\n }], null, null); })();\n\n/**\n * @fileoverview added by tsickle\n * Generated from: core/media-change.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n/**\n * Class instances emitted [to observers] for each mql notification\n */\nclass MediaChange {\n /**\n * @param {?=} matches whether the mediaQuery is currently activated\n * @param {?=} mediaQuery e.g. (min-width: 600px) and (max-width: 959px)\n * @param {?=} mqAlias e.g. gt-sm, md, gt-lg\n * @param {?=} suffix e.g. GtSM, Md, GtLg\n * @param {?=} priority the priority of activation for the given breakpoint\n */\n constructor(matches = false, mediaQuery = 'all', mqAlias = '', suffix = '', priority = 0) {\n this.matches = matches;\n this.mediaQuery = mediaQuery;\n this.mqAlias = mqAlias;\n this.suffix = suffix;\n this.priority = priority;\n this.property = '';\n }\n /**\n * Create an exact copy of the MediaChange\n * @return {?}\n */\n clone() {\n return new MediaChange(this.matches, this.mediaQuery, this.mqAlias, this.suffix);\n }\n}\n\n/**\n * @fileoverview added by tsickle\n * Generated from: core/stylesheet-map/stylesheet-map.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n/**\n * Utility to emulate a CSS stylesheet\n *\n * This utility class stores all of the styles for a given HTML element\n * as a readonly `stylesheet` map.\n */\nclass StylesheetMap {\n constructor() {\n this.stylesheet = new Map();\n }\n /**\n * Add an individual style to an HTML element\n * @param {?} element\n * @param {?} style\n * @param {?} value\n * @return {?}\n */\n addStyleToElement(element, style, value) {\n /** @type {?} */\n const stylesheet = this.stylesheet.get(element);\n if (stylesheet) {\n stylesheet.set(style, value);\n }\n else {\n this.stylesheet.set(element, new Map([[style, value]]));\n }\n }\n /**\n * Clear the virtual stylesheet\n * @return {?}\n */\n clearStyles() {\n this.stylesheet.clear();\n }\n /**\n * Retrieve a given style for an HTML element\n * @param {?} el\n * @param {?} styleName\n * @return {?}\n */\n getStyleForElement(el, styleName) {\n /** @type {?} */\n const styles = this.stylesheet.get(el);\n /** @type {?} */\n let value = '';\n if (styles) {\n /** @type {?} */\n const style = styles.get(styleName);\n if (typeof style === 'number' || typeof style === 'string') {\n value = style + '';\n }\n }\n return value;\n }\n}\nStylesheetMap.ɵfac = function StylesheetMap_Factory(t) { return new (t || StylesheetMap)(); };\n/** @nocollapse */ StylesheetMap.ɵprov = ɵɵdefineInjectable({ factory: function StylesheetMap_Factory() { return new StylesheetMap(); }, token: StylesheetMap, providedIn: \"root\" });\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(StylesheetMap, [{\n type: Injectable,\n args: [{ providedIn: 'root' }]\n }], function () { return []; }, null); })();\n\n/**\n * @fileoverview added by tsickle\n * Generated from: core/stylesheet-map/index.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n\n/**\n * @fileoverview added by tsickle\n * Generated from: core/tokens/library-config.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n/** @type {?} */\nconst DEFAULT_CONFIG = {\n addFlexToParent: true,\n addOrientationBps: false,\n disableDefaultBps: false,\n disableVendorPrefixes: false,\n serverLoaded: false,\n useColumnBasisZero: true,\n printWithBreakpoints: [],\n mediaTriggerAutoRestore: true,\n ssrObserveBreakpoints: [],\n};\n/** @type {?} */\nconst LAYOUT_CONFIG = new InjectionToken('Flex Layout token, config options for the library', {\n providedIn: 'root',\n factory: (/**\n * @return {?}\n */\n () => DEFAULT_CONFIG)\n});\n\n/**\n * @fileoverview added by tsickle\n * Generated from: core/tokens/server-token.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n/**\n * Token that is provided to tell whether the FlexLayoutServerModule\n * has been included in the bundle\n *\n * NOTE: This can be manually provided to disable styles when using SSR\n * @type {?}\n */\nconst SERVER_TOKEN = new InjectionToken('FlexLayoutServerLoaded', {\n providedIn: 'root',\n factory: (/**\n * @return {?}\n */\n () => false)\n});\n\n/**\n * @fileoverview added by tsickle\n * Generated from: core/tokens/breakpoint-token.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n/** @type {?} */\nconst BREAKPOINT = new InjectionToken('Flex Layout token, collect all breakpoints into one provider', {\n providedIn: 'root',\n factory: (/**\n * @return {?}\n */\n () => null)\n});\n\n/**\n * @fileoverview added by tsickle\n * Generated from: core/tokens/index.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n\n/**\n * @fileoverview added by tsickle\n * Generated from: core/add-alias.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n/**\n * For the specified MediaChange, make sure it contains the breakpoint alias\n * and suffix (if available).\n * @param {?} dest\n * @param {?} source\n * @return {?}\n */\nfunction mergeAlias(dest, source) {\n dest = dest ? dest.clone() : new MediaChange();\n if (source) {\n dest.mqAlias = source.alias;\n dest.mediaQuery = source.mediaQuery;\n dest.suffix = (/** @type {?} */ (source.suffix));\n dest.priority = (/** @type {?} */ (source.priority));\n }\n return dest;\n}\n\n/**\n * @fileoverview added by tsickle\n * Generated from: utils/layout-validator.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n * @type {?}\n */\nconst INLINE = 'inline';\n/** @type {?} */\nconst LAYOUT_VALUES = ['row', 'column', 'row-reverse', 'column-reverse'];\n/**\n * Validate the direction|'direction wrap' value and then update the host's inline flexbox styles\n * @param {?} value\n * @return {?}\n */\nfunction buildLayoutCSS(value) {\n let [direction, wrap, isInline] = validateValue(value);\n return buildCSS(direction, wrap, isInline);\n}\n/**\n * Validate the value to be one of the acceptable value options\n * Use default fallback of 'row'\n * @param {?} value\n * @return {?}\n */\nfunction validateValue(value) {\n value = value ? value.toLowerCase() : '';\n let [direction, wrap, inline] = value.split(' ');\n // First value must be the `flex-direction`\n if (!LAYOUT_VALUES.find((/**\n * @param {?} x\n * @return {?}\n */\n x => x === direction))) {\n direction = LAYOUT_VALUES[0];\n }\n if (wrap === INLINE) {\n wrap = (inline !== INLINE) ? inline : '';\n inline = INLINE;\n }\n return [direction, validateWrapValue(wrap), !!inline];\n}\n/**\n * Convert layout-wrap='
' to expected flex-wrap style\n * @param {?} value\n * @return {?}\n */\nfunction validateWrapValue(value) {\n if (!!value) {\n switch (value.toLowerCase()) {\n case 'reverse':\n case 'wrap-reverse':\n case 'reverse-wrap':\n value = 'wrap-reverse';\n break;\n case 'no':\n case 'none':\n case 'nowrap':\n value = 'nowrap';\n break;\n // All other values fallback to 'wrap'\n default:\n value = 'wrap';\n break;\n }\n }\n return value;\n}\n/**\n * Build the CSS that should be assigned to the element instance\n * BUG:\n * 1) min-height on a column flex container won’t apply to its flex item children in IE 10-11.\n * Use height instead if possible; height : vh;\n *\n * This way any padding or border specified on the child elements are\n * laid out and drawn inside that element's specified width and height.\n * @param {?} direction\n * @param {?=} wrap\n * @param {?=} inline\n * @return {?}\n */\nfunction buildCSS(direction, wrap = null, inline = false) {\n return {\n 'display': inline ? 'inline-flex' : 'flex',\n 'box-sizing': 'border-box',\n 'flex-direction': direction,\n 'flex-wrap': !!wrap ? wrap : null\n };\n}\n\n/**\n * @fileoverview added by tsickle\n * Generated from: core/base/base2.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n/**\n * @abstract\n */\nclass BaseDirective2 {\n /**\n * @protected\n * @param {?} elementRef\n * @param {?} styleBuilder\n * @param {?} styler\n * @param {?} marshal\n */\n constructor(elementRef, styleBuilder, styler, marshal) {\n this.elementRef = elementRef;\n this.styleBuilder = styleBuilder;\n this.styler = styler;\n this.marshal = marshal;\n this.DIRECTIVE_KEY = '';\n this.inputs = [];\n /**\n * The most recently used styles for the builder\n */\n this.mru = {};\n this.destroySubject = new Subject();\n /**\n * Cache map for style computation\n */\n this.styleCache = new Map();\n }\n /**\n * Access to host element's parent DOM node\n * @protected\n * @return {?}\n */\n get parentElement() {\n return this.elementRef.nativeElement.parentElement;\n }\n /**\n * Access to the HTMLElement for the directive\n * @protected\n * @return {?}\n */\n get nativeElement() {\n return this.elementRef.nativeElement;\n }\n /**\n * Access to the activated value for the directive\n * @return {?}\n */\n get activatedValue() {\n return this.marshal.getValue(this.nativeElement, this.DIRECTIVE_KEY);\n }\n /**\n * @param {?} value\n * @return {?}\n */\n set activatedValue(value) {\n this.marshal.setValue(this.nativeElement, this.DIRECTIVE_KEY, value, this.marshal.activatedAlias);\n }\n /**\n * For \\@Input changes\n * @param {?} changes\n * @return {?}\n */\n ngOnChanges(changes) {\n Object.keys(changes).forEach((/**\n * @param {?} key\n * @return {?}\n */\n key => {\n if (this.inputs.indexOf(key) !== -1) {\n /** @type {?} */\n const bp = key.split('.').slice(1).join('.');\n /** @type {?} */\n const val = changes[key].currentValue;\n this.setValue(val, bp);\n }\n }));\n }\n /**\n * @return {?}\n */\n ngOnDestroy() {\n this.destroySubject.next();\n this.destroySubject.complete();\n this.marshal.releaseElement(this.nativeElement);\n }\n /**\n * Register with central marshaller service\n * @protected\n * @param {?=} extraTriggers\n * @return {?}\n */\n init(extraTriggers = []) {\n this.marshal.init(this.elementRef.nativeElement, this.DIRECTIVE_KEY, this.updateWithValue.bind(this), this.clearStyles.bind(this), extraTriggers);\n }\n /**\n * Add styles to the element using predefined style builder\n * @protected\n * @param {?} input\n * @param {?=} parent\n * @return {?}\n */\n addStyles(input, parent) {\n /** @type {?} */\n const builder = this.styleBuilder;\n /** @type {?} */\n const useCache = builder.shouldCache;\n /** @type {?} */\n let genStyles = this.styleCache.get(input);\n if (!genStyles || !useCache) {\n genStyles = builder.buildStyles(input, parent);\n if (useCache) {\n this.styleCache.set(input, genStyles);\n }\n }\n this.mru = Object.assign({}, genStyles);\n this.applyStyleToElement(genStyles);\n builder.sideEffect(input, genStyles, parent);\n }\n /**\n * Remove generated styles from an element using predefined style builder\n * @protected\n * @return {?}\n */\n clearStyles() {\n Object.keys(this.mru).forEach((/**\n * @param {?} k\n * @return {?}\n */\n k => {\n this.mru[k] = '';\n }));\n this.applyStyleToElement(this.mru);\n this.mru = {};\n }\n /**\n * Force trigger style updates on DOM element\n * @protected\n * @return {?}\n */\n triggerUpdate() {\n this.marshal.triggerUpdate(this.nativeElement, this.DIRECTIVE_KEY);\n }\n /**\n * Determine the DOM element's Flexbox flow (flex-direction).\n *\n * Check inline style first then check computed (stylesheet) style.\n * And optionally add the flow value to element's inline style.\n * @protected\n * @param {?} target\n * @param {?=} addIfMissing\n * @return {?}\n */\n getFlexFlowDirection(target, addIfMissing = false) {\n if (target) {\n const [value, hasInlineValue] = this.styler.getFlowDirection(target);\n if (!hasInlineValue && addIfMissing) {\n /** @type {?} */\n const style = buildLayoutCSS(value);\n /** @type {?} */\n const elements = [target];\n this.styler.applyStyleToElements(style, elements);\n }\n return value.trim();\n }\n return 'row';\n }\n /**\n * @protected\n * @param {?} target\n * @return {?}\n */\n hasWrap(target) {\n return this.styler.hasWrap(target);\n }\n /**\n * Applies styles given via string pair or object map to the directive element\n * @protected\n * @param {?} style\n * @param {?=} value\n * @param {?=} element\n * @return {?}\n */\n applyStyleToElement(style, value, element = this.nativeElement) {\n this.styler.applyStyleToElement(element, style, value);\n }\n /**\n * @protected\n * @param {?} val\n * @param {?} bp\n * @return {?}\n */\n setValue(val, bp) {\n this.marshal.setValue(this.nativeElement, this.DIRECTIVE_KEY, val, bp);\n }\n /**\n * @protected\n * @param {?} input\n * @return {?}\n */\n updateWithValue(input) {\n if (this.currentValue !== input) {\n this.addStyles(input);\n this.currentValue = input;\n }\n }\n}\nBaseDirective2.ɵfac = function BaseDirective2_Factory(t) { ɵngcc0.ɵɵinvalidFactory(); };\nBaseDirective2.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: BaseDirective2, features: [ɵngcc0.ɵɵNgOnChangesFeature] });\n\n\n/**\n * @fileoverview added by tsickle\n * Generated from: core/base/index.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n\n/**\n * @fileoverview added by tsickle\n * Generated from: core/breakpoints/data/break-points.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n/**\n * NOTE: Smaller ranges have HIGHER priority since the match is more specific\n * @type {?}\n */\nconst DEFAULT_BREAKPOINTS = [\n {\n alias: 'xs',\n mediaQuery: 'screen and (min-width: 0px) and (max-width: 599.98px)',\n priority: 1000,\n },\n {\n alias: 'sm',\n mediaQuery: 'screen and (min-width: 600px) and (max-width: 959.98px)',\n priority: 900,\n },\n {\n alias: 'md',\n mediaQuery: 'screen and (min-width: 960px) and (max-width: 1279.98px)',\n priority: 800,\n },\n {\n alias: 'lg',\n mediaQuery: 'screen and (min-width: 1280px) and (max-width: 1919.98px)',\n priority: 700,\n },\n {\n alias: 'xl',\n mediaQuery: 'screen and (min-width: 1920px) and (max-width: 4999.98px)',\n priority: 600,\n },\n {\n alias: 'lt-sm',\n overlapping: true,\n mediaQuery: 'screen and (max-width: 599.98px)',\n priority: 950,\n },\n {\n alias: 'lt-md',\n overlapping: true,\n mediaQuery: 'screen and (max-width: 959.98px)',\n priority: 850,\n },\n {\n alias: 'lt-lg',\n overlapping: true,\n mediaQuery: 'screen and (max-width: 1279.98px)',\n priority: 750,\n },\n {\n alias: 'lt-xl',\n overlapping: true,\n priority: 650,\n mediaQuery: 'screen and (max-width: 1919.98px)',\n },\n {\n alias: 'gt-xs',\n overlapping: true,\n mediaQuery: 'screen and (min-width: 600px)',\n priority: -950,\n },\n {\n alias: 'gt-sm',\n overlapping: true,\n mediaQuery: 'screen and (min-width: 960px)',\n priority: -850,\n }, {\n alias: 'gt-md',\n overlapping: true,\n mediaQuery: 'screen and (min-width: 1280px)',\n priority: -750,\n },\n {\n alias: 'gt-lg',\n overlapping: true,\n mediaQuery: 'screen and (min-width: 1920px)',\n priority: -650,\n }\n];\n\n/**\n * @fileoverview added by tsickle\n * Generated from: core/breakpoints/data/orientation-break-points.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n\n/* tslint:disable */\n/** @type {?} */\nconst HANDSET_PORTRAIT = '(orientation: portrait) and (max-width: 599.98px)';\n/** @type {?} */\nconst HANDSET_LANDSCAPE = '(orientation: landscape) and (max-width: 959.98px)';\n/** @type {?} */\nconst TABLET_PORTRAIT = '(orientation: portrait) and (min-width: 600px) and (max-width: 839.98px)';\n/** @type {?} */\nconst TABLET_LANDSCAPE = '(orientation: landscape) and (min-width: 960px) and (max-width: 1279.98px)';\n/** @type {?} */\nconst WEB_PORTRAIT = '(orientation: portrait) and (min-width: 840px)';\n/** @type {?} */\nconst WEB_LANDSCAPE = '(orientation: landscape) and (min-width: 1280px)';\n/** @type {?} */\nconst ScreenTypes = {\n 'HANDSET': `${HANDSET_PORTRAIT}, ${HANDSET_LANDSCAPE}`,\n 'TABLET': `${TABLET_PORTRAIT} , ${TABLET_LANDSCAPE}`,\n 'WEB': `${WEB_PORTRAIT}, ${WEB_LANDSCAPE} `,\n 'HANDSET_PORTRAIT': `${HANDSET_PORTRAIT}`,\n 'TABLET_PORTRAIT': `${TABLET_PORTRAIT} `,\n 'WEB_PORTRAIT': `${WEB_PORTRAIT}`,\n 'HANDSET_LANDSCAPE': `${HANDSET_LANDSCAPE}`,\n 'TABLET_LANDSCAPE': `${TABLET_LANDSCAPE}`,\n 'WEB_LANDSCAPE': `${WEB_LANDSCAPE}`\n};\n/**\n * Extended Breakpoints for handset/tablets with landscape or portrait orientations\n * @type {?}\n */\nconst ORIENTATION_BREAKPOINTS = [\n { 'alias': 'handset', priority: 2000, 'mediaQuery': ScreenTypes.HANDSET },\n { 'alias': 'handset.landscape', priority: 2000, 'mediaQuery': ScreenTypes.HANDSET_LANDSCAPE },\n { 'alias': 'handset.portrait', priority: 2000, 'mediaQuery': ScreenTypes.HANDSET_PORTRAIT },\n { 'alias': 'tablet', priority: 2100, 'mediaQuery': ScreenTypes.TABLET },\n { 'alias': 'tablet.landscape', priority: 2100, 'mediaQuery': ScreenTypes.TABLET_LANDSCAPE },\n { 'alias': 'tablet.portrait', priority: 2100, 'mediaQuery': ScreenTypes.TABLET_PORTRAIT },\n { 'alias': 'web', priority: 2200, 'mediaQuery': ScreenTypes.WEB, overlapping: true },\n { 'alias': 'web.landscape', priority: 2200, 'mediaQuery': ScreenTypes.WEB_LANDSCAPE, overlapping: true },\n { 'alias': 'web.portrait', priority: 2200, 'mediaQuery': ScreenTypes.WEB_PORTRAIT, overlapping: true }\n];\n\n/**\n * @fileoverview added by tsickle\n * Generated from: core/breakpoints/break-point.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n\n/**\n * @fileoverview added by tsickle\n * Generated from: utils/object-extend.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n\n/**\n * Extends an object with the *enumerable* and *own* properties of one or more source objects,\n * similar to Object.assign.\n *\n * @param {?} dest The object which will have properties copied to it.\n * @param {...?} sources The source objects from which properties will be copied.\n * @return {?}\n */\nfunction extendObject(dest, ...sources) {\n if (dest == null) {\n throw TypeError('Cannot convert undefined or null to object');\n }\n for (let source of sources) {\n if (source != null) {\n for (let key in source) {\n if (source.hasOwnProperty(key)) {\n dest[key] = source[key];\n }\n }\n }\n }\n return dest;\n}\n\n/**\n * @fileoverview added by tsickle\n * Generated from: core/breakpoints/breakpoint-tools.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n/** @type {?} */\nconst ALIAS_DELIMITERS = /(\\.|-|_)/g;\n/**\n * @param {?} part\n * @return {?}\n */\nfunction firstUpperCase(part) {\n /** @type {?} */\n let first = part.length > 0 ? part.charAt(0) : '';\n /** @type {?} */\n let remainder = (part.length > 1) ? part.slice(1) : '';\n return first.toUpperCase() + remainder;\n}\n/**\n * Converts snake-case to SnakeCase.\n * @param {?} name Text to UpperCamelCase\n * @return {?}\n */\nfunction camelCase(name) {\n return name\n .replace(ALIAS_DELIMITERS, '|')\n .split('|')\n .map(firstUpperCase)\n .join('');\n}\n/**\n * For each breakpoint, ensure that a Suffix is defined;\n * fallback to UpperCamelCase the unique Alias value\n * @param {?} list\n * @return {?}\n */\nfunction validateSuffixes(list) {\n list.forEach((/**\n * @param {?} bp\n * @return {?}\n */\n (bp) => {\n if (!bp.suffix) {\n bp.suffix = camelCase(bp.alias); // create Suffix value based on alias\n bp.overlapping = !!bp.overlapping; // ensure default value\n }\n }));\n return list;\n}\n/**\n * Merge a custom breakpoint list with the default list based on unique alias values\n * - Items are added if the alias is not in the default list\n * - Items are merged with the custom override if the alias exists in the default list\n * @param {?} defaults\n * @param {?=} custom\n * @return {?}\n */\nfunction mergeByAlias(defaults, custom = []) {\n /** @type {?} */\n const dict = {};\n defaults.forEach((/**\n * @param {?} bp\n * @return {?}\n */\n bp => {\n dict[bp.alias] = bp;\n }));\n // Merge custom breakpoints\n custom.forEach((/**\n * @param {?} bp\n * @return {?}\n */\n (bp) => {\n if (dict[bp.alias]) {\n extendObject(dict[bp.alias], bp);\n }\n else {\n dict[bp.alias] = bp;\n }\n }));\n return validateSuffixes(Object.keys(dict).map((/**\n * @param {?} k\n * @return {?}\n */\n k => dict[k])));\n}\n\n/**\n * @fileoverview added by tsickle\n * Generated from: core/breakpoints/break-points-token.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n/**\n * Injection token unique to the flex-layout library.\n * Use this token when build a custom provider (see below).\n * @type {?}\n */\nconst BREAKPOINTS = new InjectionToken('Token (@angular/flex-layout) Breakpoints', {\n providedIn: 'root',\n factory: (/**\n * @return {?}\n */\n () => {\n /** @type {?} */\n const breakpoints = inject(BREAKPOINT);\n /** @type {?} */\n const layoutConfig = inject(LAYOUT_CONFIG);\n /** @type {?} */\n const bpFlattenArray = [].concat.apply([], (breakpoints || [])\n .map((/**\n * @param {?} v\n * @return {?}\n */\n (v) => Array.isArray(v) ? v : [v])));\n /** @type {?} */\n const builtIns = (layoutConfig.disableDefaultBps ? [] : DEFAULT_BREAKPOINTS)\n .concat(layoutConfig.addOrientationBps ? ORIENTATION_BREAKPOINTS : []);\n return mergeByAlias(builtIns, bpFlattenArray);\n })\n});\n\n/**\n * @fileoverview added by tsickle\n * Generated from: core/utils/sort.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n/**\n * HOF to sort the breakpoints by descending priority\n * @template T\n * @param {?} a\n * @param {?} b\n * @return {?}\n */\nfunction sortDescendingPriority(a, b) {\n /** @type {?} */\n const priorityA = a ? a.priority || 0 : 0;\n /** @type {?} */\n const priorityB = b ? b.priority || 0 : 0;\n return priorityB - priorityA;\n}\n/**\n * HOF to sort the breakpoints by ascending priority\n * @template T\n * @param {?} a\n * @param {?} b\n * @return {?}\n */\nfunction sortAscendingPriority(a, b) {\n /** @type {?} */\n const pA = a.priority || 0;\n /** @type {?} */\n const pB = b.priority || 0;\n return pA - pB;\n}\n\n/**\n * @fileoverview added by tsickle\n * Generated from: core/breakpoints/break-point-registry.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n/**\n * Registry of 1..n MediaQuery breakpoint ranges\n * This is published as a provider and may be overridden from custom, application-specific ranges\n *\n */\nclass BreakPointRegistry {\n /**\n * @param {?} list\n */\n constructor(list) {\n /**\n * Memoized BreakPoint Lookups\n */\n this.findByMap = new Map();\n this.items = [...list].sort(sortAscendingPriority);\n }\n /**\n * Search breakpoints by alias (e.g. gt-xs)\n * @param {?} alias\n * @return {?}\n */\n findByAlias(alias) {\n return !alias ? null : this.findWithPredicate(alias, (/**\n * @param {?} bp\n * @return {?}\n */\n (bp) => bp.alias == alias));\n }\n /**\n * @param {?} query\n * @return {?}\n */\n findByQuery(query) {\n return this.findWithPredicate(query, (/**\n * @param {?} bp\n * @return {?}\n */\n (bp) => bp.mediaQuery == query));\n }\n /**\n * Get all the breakpoints whose ranges could overlapping `normal` ranges;\n * e.g. gt-sm overlaps md, lg, and xl\n * @return {?}\n */\n get overlappings() {\n return this.items.filter((/**\n * @param {?} it\n * @return {?}\n */\n it => it.overlapping == true));\n }\n /**\n * Get list of all registered (non-empty) breakpoint aliases\n * @return {?}\n */\n get aliases() {\n return this.items.map((/**\n * @param {?} it\n * @return {?}\n */\n it => it.alias));\n }\n /**\n * Aliases are mapped to properties using suffixes\n * e.g. 'gt-sm' for property 'layout' uses suffix 'GtSm'\n * for property layoutGtSM.\n * @return {?}\n */\n get suffixes() {\n return this.items.map((/**\n * @param {?} it\n * @return {?}\n */\n it => !!it.suffix ? it.suffix : ''));\n }\n /**\n * Memoized lookup using custom predicate function\n * @private\n * @param {?} key\n * @param {?} searchFn\n * @return {?}\n */\n findWithPredicate(key, searchFn) {\n /** @type {?} */\n let response = this.findByMap.get(key);\n if (!response) {\n response = this.items.find(searchFn) || null;\n this.findByMap.set(key, response);\n }\n return response || null;\n }\n}\nBreakPointRegistry.ɵfac = function BreakPointRegistry_Factory(t) { return new (t || BreakPointRegistry)(ɵngcc0.ɵɵinject(BREAKPOINTS)); };\n/** @nocollapse */ BreakPointRegistry.ɵprov = ɵɵdefineInjectable({ factory: function BreakPointRegistry_Factory() { return new BreakPointRegistry(ɵɵinject(BREAKPOINTS)); }, token: BreakPointRegistry, providedIn: \"root\" });\n/** @nocollapse */\nBreakPointRegistry.ctorParameters = () => [\n { type: Array, decorators: [{ type: Inject, args: [BREAKPOINTS,] }] }\n];\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(BreakPointRegistry, [{\n type: Injectable,\n args: [{ providedIn: 'root' }]\n }], function () { return [{ type: Array, decorators: [{\n type: Inject,\n args: [BREAKPOINTS]\n }] }]; }, null); })();\n\n/**\n * @fileoverview added by tsickle\n * Generated from: core/breakpoints/index.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n\n/**\n * @fileoverview added by tsickle\n * Generated from: core/match-media/match-media.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n/**\n * MediaMonitor configures listeners to mediaQuery changes and publishes an Observable facade to\n * convert mediaQuery change callbacks to subscriber notifications. These notifications will be\n * performed within the ng Zone to trigger change detections and component updates.\n *\n * NOTE: both mediaQuery activations and de-activations are announced in notifications\n */\nclass MatchMedia {\n /**\n * @param {?} _zone\n * @param {?} _platformId\n * @param {?} _document\n */\n constructor(_zone, _platformId, _document) {\n this._zone = _zone;\n this._platformId = _platformId;\n this._document = _document;\n /**\n * Initialize source with 'all' so all non-responsive APIs trigger style updates\n */\n this.source = new BehaviorSubject(new MediaChange(true));\n this.registry = new Map();\n this.pendingRemoveListenerFns = [];\n this._observable$ = this.source.asObservable();\n }\n /**\n * Publish list of all current activations\n * @return {?}\n */\n get activations() {\n /** @type {?} */\n const results = [];\n this.registry.forEach((/**\n * @param {?} mql\n * @param {?} key\n * @return {?}\n */\n (mql, key) => {\n if (mql.matches) {\n results.push(key);\n }\n }));\n return results;\n }\n /**\n * For the specified mediaQuery?\n * @param {?} mediaQuery\n * @return {?}\n */\n isActive(mediaQuery) {\n /** @type {?} */\n const mql = this.registry.get(mediaQuery);\n return !!mql ? mql.matches : this.registerQuery(mediaQuery).some((/**\n * @param {?} m\n * @return {?}\n */\n m => m.matches));\n }\n /**\n * External observers can watch for all (or a specific) mql changes.\n * Typically used by the MediaQueryAdaptor; optionally available to components\n * who wish to use the MediaMonitor as mediaMonitor$ observable service.\n *\n * Use deferred registration process to register breakpoints only on subscription\n * This logic also enforces logic to register all mediaQueries BEFORE notify\n * subscribers of notifications.\n * @param {?=} mqList\n * @param {?=} filterOthers\n * @return {?}\n */\n observe(mqList, filterOthers = false) {\n if (mqList && mqList.length) {\n /** @type {?} */\n const matchMedia$ = this._observable$.pipe(filter((/**\n * @param {?} change\n * @return {?}\n */\n (change) => !filterOthers ? true : (mqList.indexOf(change.mediaQuery) > -1))));\n /** @type {?} */\n const registration$ = new Observable((/**\n * @param {?} observer\n * @return {?}\n */\n (observer) => {\n // tslint:disable-line:max-line-length\n /** @type {?} */\n const matches = this.registerQuery(mqList);\n if (matches.length) {\n /** @type {?} */\n const lastChange = (/** @type {?} */ (matches.pop()));\n matches.forEach((/**\n * @param {?} e\n * @return {?}\n */\n (e) => {\n observer.next(e);\n }));\n this.source.next(lastChange); // last match is cached\n }\n observer.complete();\n }));\n return merge(registration$, matchMedia$);\n }\n return this._observable$;\n }\n /**\n * Based on the BreakPointRegistry provider, register internal listeners for each unique\n * mediaQuery. Each listener emits specific MediaChange data to observers\n * @param {?} mediaQuery\n * @return {?}\n */\n registerQuery(mediaQuery) {\n /** @type {?} */\n const list = Array.isArray(mediaQuery) ? mediaQuery : [mediaQuery];\n /** @type {?} */\n const matches = [];\n buildQueryCss(list, this._document);\n list.forEach((/**\n * @param {?} query\n * @return {?}\n */\n (query) => {\n /** @type {?} */\n const onMQLEvent = (/**\n * @param {?} e\n * @return {?}\n */\n (e) => {\n this._zone.run((/**\n * @return {?}\n */\n () => this.source.next(new MediaChange(e.matches, query))));\n });\n /** @type {?} */\n let mql = this.registry.get(query);\n if (!mql) {\n mql = this.buildMQL(query);\n mql.addListener(onMQLEvent);\n this.pendingRemoveListenerFns.push((/**\n * @return {?}\n */\n () => (/** @type {?} */ (mql)).removeListener(onMQLEvent)));\n this.registry.set(query, mql);\n }\n if (mql.matches) {\n matches.push(new MediaChange(true, query));\n }\n }));\n return matches;\n }\n /**\n * @return {?}\n */\n ngOnDestroy() {\n /** @type {?} */\n let fn;\n while (fn = this.pendingRemoveListenerFns.pop()) {\n fn();\n }\n }\n /**\n * Call window.matchMedia() to build a MediaQueryList; which\n * supports 0..n listeners for activation/deactivation\n * @protected\n * @param {?} query\n * @return {?}\n */\n buildMQL(query) {\n return constructMql(query, isPlatformBrowser(this._platformId));\n }\n}\nMatchMedia.ɵfac = function MatchMedia_Factory(t) { return new (t || MatchMedia)(ɵngcc0.ɵɵinject(ɵngcc0.NgZone), ɵngcc0.ɵɵinject(PLATFORM_ID), ɵngcc0.ɵɵinject(DOCUMENT)); };\n/** @nocollapse */ MatchMedia.ɵprov = ɵɵdefineInjectable({ factory: function MatchMedia_Factory() { return new MatchMedia(ɵɵinject(NgZone), ɵɵinject(PLATFORM_ID), ɵɵinject(DOCUMENT)); }, token: MatchMedia, providedIn: \"root\" });\n/** @nocollapse */\nMatchMedia.ctorParameters = () => [\n { type: NgZone },\n { type: Object, decorators: [{ type: Inject, args: [PLATFORM_ID,] }] },\n { type: undefined, decorators: [{ type: Inject, args: [DOCUMENT,] }] }\n];\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(MatchMedia, [{\n type: Injectable,\n args: [{ providedIn: 'root' }]\n }], function () { return [{ type: ɵngcc0.NgZone }, { type: Object, decorators: [{\n type: Inject,\n args: [PLATFORM_ID]\n }] }, { type: undefined, decorators: [{\n type: Inject,\n args: [DOCUMENT]\n }] }]; }, null); })();\n/**\n * Private global registry for all dynamically-created, injected style tags\n * @see prepare(query)\n * @type {?}\n */\nconst ALL_STYLES = {};\n/**\n * For Webkit engines that only trigger the MediaQueryList Listener\n * when there is at least one CSS selector for the respective media query.\n *\n * @param {?} mediaQueries\n * @param {?} _document\n * @return {?}\n */\nfunction buildQueryCss(mediaQueries, _document) {\n /** @type {?} */\n const list = mediaQueries.filter((/**\n * @param {?} it\n * @return {?}\n */\n it => !ALL_STYLES[it]));\n if (list.length > 0) {\n /** @type {?} */\n const query = list.join(', ');\n try {\n /** @type {?} */\n const styleEl = _document.createElement('style');\n styleEl.setAttribute('type', 'text/css');\n if (!((/** @type {?} */ (styleEl))).styleSheet) {\n /** @type {?} */\n const cssText = `\n/*\n @angular/flex-layout - workaround for possible browser quirk with mediaQuery listeners\n see http://bit.ly/2sd4HMP\n*/\n@media ${query} {.fx-query-test{ }}\n`;\n styleEl.appendChild(_document.createTextNode(cssText));\n }\n (/** @type {?} */ (_document.head)).appendChild(styleEl);\n // Store in private global registry\n list.forEach((/**\n * @param {?} mq\n * @return {?}\n */\n mq => ALL_STYLES[mq] = styleEl));\n }\n catch (e) {\n console.error(e);\n }\n }\n}\n/**\n * @param {?} query\n * @param {?} isBrowser\n * @return {?}\n */\nfunction constructMql(query, isBrowser) {\n /** @type {?} */\n const canListen = isBrowser && !!((/** @type {?} */ (window))).matchMedia('all').addListener;\n return canListen ? ((/** @type {?} */ (window))).matchMedia(query) : (/** @type {?} */ ({\n matches: query === 'all' || query === '',\n media: query,\n addListener: (/**\n * @return {?}\n */\n () => {\n }),\n removeListener: (/**\n * @return {?}\n */\n () => {\n }),\n onchange: null,\n /**\n * @return {?}\n */\n addEventListener() {\n },\n /**\n * @return {?}\n */\n removeEventListener() {\n },\n /**\n * @return {?}\n */\n dispatchEvent() {\n return false;\n }\n }));\n}\n\n/**\n * @fileoverview added by tsickle\n * Generated from: core/match-media/mock/mock-match-media.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n/**\n * MockMatchMedia mocks calls to the Window API matchMedia with a build of a simulated\n * MockMediaQueryListener. Methods are available to simulate an activation of a mediaQuery\n * range and to clearAll mediaQuery listeners.\n */\nclass MockMatchMedia extends MatchMedia {\n // Allow fallback to overlapping mediaQueries\n /**\n * @param {?} _zone\n * @param {?} _platformId\n * @param {?} _document\n * @param {?} _breakpoints\n */\n constructor(_zone, _platformId, _document, _breakpoints) {\n super(_zone, _platformId, _document);\n this._breakpoints = _breakpoints;\n this.autoRegisterQueries = true; // Used for testing BreakPoint registrations\n // Used for testing BreakPoint registrations\n this.useOverlaps = false; // Allow fallback to overlapping mediaQueries\n }\n /**\n * Easy method to clear all listeners for all mediaQueries\n * @return {?}\n */\n clearAll() {\n this.registry.forEach((/**\n * @param {?} mql\n * @return {?}\n */\n (mql) => {\n ((/** @type {?} */ (mql))).destroy();\n }));\n this.registry.clear();\n this.useOverlaps = false;\n }\n /**\n * Feature to support manual, simulated activation of a mediaQuery.\n * @param {?} mediaQuery\n * @param {?=} useOverlaps\n * @return {?}\n */\n activate(mediaQuery, useOverlaps = false) {\n useOverlaps = useOverlaps || this.useOverlaps;\n mediaQuery = this._validateQuery(mediaQuery);\n if (useOverlaps || !this.isActive(mediaQuery)) {\n this._deactivateAll();\n this._registerMediaQuery(mediaQuery);\n this._activateWithOverlaps(mediaQuery, useOverlaps);\n }\n return this.hasActivated;\n }\n /**\n * Converts an optional mediaQuery alias to a specific, valid mediaQuery\n * @param {?} queryOrAlias\n * @return {?}\n */\n _validateQuery(queryOrAlias) {\n /** @type {?} */\n const bp = this._breakpoints.findByAlias(queryOrAlias);\n return (bp && bp.mediaQuery) || queryOrAlias;\n }\n /**\n * Manually onMediaChange any overlapping mediaQueries to simulate\n * similar functionality in the window.matchMedia()\n * @private\n * @param {?} mediaQuery\n * @param {?} useOverlaps\n * @return {?}\n */\n _activateWithOverlaps(mediaQuery, useOverlaps) {\n if (useOverlaps) {\n /** @type {?} */\n const bp = this._breakpoints.findByQuery(mediaQuery);\n /** @type {?} */\n const alias = bp ? bp.alias : 'unknown';\n // Simulate activation of overlapping lt- ranges\n switch (alias) {\n case 'lg':\n this._activateByAlias(['lt-xl']);\n break;\n case 'md':\n this._activateByAlias(['lt-xl', 'lt-lg']);\n break;\n case 'sm':\n this._activateByAlias(['lt-xl', 'lt-lg', 'lt-md']);\n break;\n case 'xs':\n this._activateByAlias(['lt-xl', 'lt-lg', 'lt-md', 'lt-sm']);\n break;\n }\n // Simulate activation of overlapping gt- mediaQuery ranges\n switch (alias) {\n case 'xl':\n this._activateByAlias(['gt-lg', 'gt-md', 'gt-sm', 'gt-xs']);\n break;\n case 'lg':\n this._activateByAlias(['gt-md', 'gt-sm', 'gt-xs']);\n break;\n case 'md':\n this._activateByAlias(['gt-sm', 'gt-xs']);\n break;\n case 'sm':\n this._activateByAlias(['gt-xs']);\n break;\n }\n }\n // Activate last since the responsiveActivation is watching *this* mediaQuery\n return this._activateByQuery(mediaQuery);\n }\n /**\n *\n * @private\n * @param {?} aliases\n * @return {?}\n */\n _activateByAlias(aliases) {\n /** @type {?} */\n const activate = (/**\n * @param {?} alias\n * @return {?}\n */\n (alias) => {\n /** @type {?} */\n const bp = this._breakpoints.findByAlias(alias);\n this._activateByQuery(bp ? bp.mediaQuery : alias);\n });\n aliases.forEach(activate);\n }\n /**\n *\n * @private\n * @param {?} mediaQuery\n * @return {?}\n */\n _activateByQuery(mediaQuery) {\n if (!this.registry.has(mediaQuery) && this.autoRegisterQueries) {\n this._registerMediaQuery(mediaQuery);\n }\n /** @type {?} */\n const mql = (/** @type {?} */ (this.registry.get(mediaQuery)));\n if (mql && !this.isActive(mediaQuery)) {\n this.registry.set(mediaQuery, mql.activate());\n }\n return this.hasActivated;\n }\n /**\n * Deactivate all current MQLs and reset the buffer\n * @private\n * @template THIS\n * @this {THIS}\n * @return {THIS}\n */\n _deactivateAll() {\n (/** @type {?} */ (this)).registry.forEach((/**\n * @param {?} it\n * @return {?}\n */\n (it) => {\n ((/** @type {?} */ (it))).deactivate();\n }));\n return (/** @type {?} */ (this));\n }\n /**\n * Insure the mediaQuery is registered with MatchMedia\n * @private\n * @param {?} mediaQuery\n * @return {?}\n */\n _registerMediaQuery(mediaQuery) {\n if (!this.registry.has(mediaQuery) && this.autoRegisterQueries) {\n this.registerQuery(mediaQuery);\n }\n }\n /**\n * Call window.matchMedia() to build a MediaQueryList; which\n * supports 0..n listeners for activation/deactivation\n * @protected\n * @param {?} query\n * @return {?}\n */\n buildMQL(query) {\n return new MockMediaQueryList(query);\n }\n /**\n * @protected\n * @return {?}\n */\n get hasActivated() {\n return this.activations.length > 0;\n }\n}\nMockMatchMedia.ɵfac = function MockMatchMedia_Factory(t) { return new (t || MockMatchMedia)(ɵngcc0.ɵɵinject(ɵngcc0.NgZone), ɵngcc0.ɵɵinject(PLATFORM_ID), ɵngcc0.ɵɵinject(DOCUMENT), ɵngcc0.ɵɵinject(BreakPointRegistry)); };\nMockMatchMedia.ɵprov = /*@__PURE__*/ ɵngcc0.ɵɵdefineInjectable({ token: MockMatchMedia, factory: MockMatchMedia.ɵfac });\n/** @nocollapse */\nMockMatchMedia.ctorParameters = () => [\n { type: NgZone },\n { type: Object, decorators: [{ type: Inject, args: [PLATFORM_ID,] }] },\n { type: undefined, decorators: [{ type: Inject, args: [DOCUMENT,] }] },\n { type: BreakPointRegistry }\n];\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(MockMatchMedia, [{\n type: Injectable\n }], function () { return [{ type: ɵngcc0.NgZone }, { type: Object, decorators: [{\n type: Inject,\n args: [PLATFORM_ID]\n }] }, { type: undefined, decorators: [{\n type: Inject,\n args: [DOCUMENT]\n }] }, { type: BreakPointRegistry }]; }, null); })();\n/**\n * Special internal class to simulate a MediaQueryList and\n * - supports manual activation to simulate mediaQuery matching\n * - manages listeners\n */\nclass MockMediaQueryList {\n /**\n * @param {?} _mediaQuery\n */\n constructor(_mediaQuery) {\n this._mediaQuery = _mediaQuery;\n this._isActive = false;\n this._listeners = [];\n this.onchange = null;\n }\n /**\n * @return {?}\n */\n get matches() {\n return this._isActive;\n }\n /**\n * @return {?}\n */\n get media() {\n return this._mediaQuery;\n }\n /**\n * Destroy the current list by deactivating the\n * listeners and clearing the internal list\n * @return {?}\n */\n destroy() {\n this.deactivate();\n this._listeners = [];\n }\n /**\n * Notify all listeners that 'matches === TRUE'\n * @return {?}\n */\n activate() {\n if (!this._isActive) {\n this._isActive = true;\n this._listeners.forEach((/**\n * @param {?} callback\n * @return {?}\n */\n (callback) => {\n /** @type {?} */\n const cb = (/** @type {?} */ (callback));\n cb.call(this, (/** @type {?} */ ({ matches: this.matches, media: this.media })));\n }));\n }\n return this;\n }\n /**\n * Notify all listeners that 'matches === false'\n * @return {?}\n */\n deactivate() {\n if (this._isActive) {\n this._isActive = false;\n this._listeners.forEach((/**\n * @param {?} callback\n * @return {?}\n */\n (callback) => {\n /** @type {?} */\n const cb = (/** @type {?} */ (callback));\n cb.call(this, (/** @type {?} */ ({ matches: this.matches, media: this.media })));\n }));\n }\n return this;\n }\n /**\n * Add a listener to our internal list to activate later\n * @param {?} listener\n * @return {?}\n */\n addListener(listener) {\n if (this._listeners.indexOf(listener) === -1) {\n this._listeners.push(listener);\n }\n if (this._isActive) {\n /** @type {?} */\n const cb = (/** @type {?} */ (listener));\n cb.call(this, (/** @type {?} */ ({ matches: this.matches, media: this.media })));\n }\n }\n /**\n * Don't need to remove listeners in the testing environment\n * @param {?} _\n * @return {?}\n */\n removeListener(_) {\n }\n /**\n * @param {?} _\n * @param {?} __\n * @param {?=} ___\n * @return {?}\n */\n addEventListener(_, __, ___) {\n }\n /**\n * @param {?} _\n * @param {?} __\n * @param {?=} ___\n * @return {?}\n */\n removeEventListener(_, __, ___) {\n }\n /**\n * @param {?} _\n * @return {?}\n */\n dispatchEvent(_) {\n return false;\n }\n}\n/**\n * Pre-configured provider for MockMatchMedia\n * @type {?}\n */\nconst MockMatchMediaProvider = {\n // tslint:disable-line:variable-name\n provide: MatchMedia,\n useClass: MockMatchMedia\n};\n\n/**\n * @fileoverview added by tsickle\n * Generated from: core/match-media/index.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n\n/**\n * @fileoverview added by tsickle\n * Generated from: core/media-marshaller/print-hook.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n/** @type {?} */\nconst PRINT = 'print';\n/** @type {?} */\nconst BREAKPOINT_PRINT = {\n alias: PRINT,\n mediaQuery: PRINT,\n priority: 1000\n};\n/**\n * PrintHook - Use to intercept print MediaQuery activations and force\n * layouts to render with the specified print alias/breakpoint\n *\n * Used in MediaMarshaller and MediaObserver\n */\nclass PrintHook {\n /**\n * @param {?} breakpoints\n * @param {?} layoutConfig\n * @param {?} _document\n */\n constructor(breakpoints, layoutConfig, _document) {\n this.breakpoints = breakpoints;\n this.layoutConfig = layoutConfig;\n this._document = _document;\n // registeredBeforeAfterPrintHooks tracks if we registered the `beforeprint`\n // and `afterprint` event listeners.\n this.registeredBeforeAfterPrintHooks = false;\n // isPrintingBeforeAfterEvent is used to track if we are printing from within\n // a `beforeprint` event handler. This prevents the typicall `stopPrinting`\n // form `interceptEvents` so that printing is not stopped while the dialog\n // is still open. This is an extension of the `isPrinting` property on\n // browsers which support `beforeprint` and `afterprint` events.\n this.isPrintingBeforeAfterEvent = false;\n this.beforePrintEventListeners = [];\n this.afterPrintEventListeners = [];\n /**\n * Is this service currently in Print-mode ?\n */\n this.isPrinting = false;\n this.queue = new PrintQueue();\n this.deactivations = [];\n }\n /**\n * Add 'print' mediaQuery: to listen for matchMedia activations\n * @param {?} queries\n * @return {?}\n */\n withPrintQuery(queries) {\n return [...queries, PRINT];\n }\n /**\n * Is the MediaChange event for any 'print' \\@media\n * @param {?} e\n * @return {?}\n */\n isPrintEvent(e) {\n return e.mediaQuery.startsWith(PRINT);\n }\n /**\n * What is the desired mqAlias to use while printing?\n * @return {?}\n */\n get printAlias() {\n return this.layoutConfig.printWithBreakpoints || [];\n }\n /**\n * Lookup breakpoints associated with print aliases.\n * @return {?}\n */\n get printBreakPoints() {\n return (/** @type {?} */ (this.printAlias\n .map((/**\n * @param {?} alias\n * @return {?}\n */\n alias => this.breakpoints.findByAlias(alias)))\n .filter((/**\n * @param {?} bp\n * @return {?}\n */\n bp => bp !== null))));\n }\n /**\n * Lookup breakpoint associated with mediaQuery\n * @param {?} __0\n * @return {?}\n */\n getEventBreakpoints({ mediaQuery }) {\n /** @type {?} */\n const bp = this.breakpoints.findByQuery(mediaQuery);\n /** @type {?} */\n const list = bp ? [...this.printBreakPoints, bp] : this.printBreakPoints;\n return list.sort(sortDescendingPriority);\n }\n /**\n * Update event with printAlias mediaQuery information\n * @param {?} event\n * @return {?}\n */\n updateEvent(event) {\n /** @type {?} */\n let bp = this.breakpoints.findByQuery(event.mediaQuery);\n if (this.isPrintEvent(event)) {\n // Reset from 'print' to first (highest priority) print breakpoint\n bp = this.getEventBreakpoints(event)[0];\n event.mediaQuery = bp ? bp.mediaQuery : '';\n }\n return mergeAlias(event, bp);\n }\n // registerBeforeAfterPrintHooks registers a `beforeprint` event hook so we can\n // trigger print styles synchronously and apply proper layout styles.\n // It is a noop if the hooks have already been registered or if the document's\n // `defaultView` is not available.\n /**\n * @private\n * @param {?} target\n * @return {?}\n */\n registerBeforeAfterPrintHooks(target) {\n // `defaultView` may be null when rendering on the server or in other contexts.\n if (!this._document.defaultView || this.registeredBeforeAfterPrintHooks) {\n return;\n }\n this.registeredBeforeAfterPrintHooks = true;\n /** @type {?} */\n const beforePrintListener = (/**\n * @return {?}\n */\n () => {\n // If we aren't already printing, start printing and update the styles as\n // if there was a regular print `MediaChange`(from matchMedia).\n if (!this.isPrinting) {\n this.isPrintingBeforeAfterEvent = true;\n this.startPrinting(target, this.getEventBreakpoints(new MediaChange(true, PRINT)));\n target.updateStyles();\n }\n });\n /** @type {?} */\n const afterPrintListener = (/**\n * @return {?}\n */\n () => {\n // If we aren't already printing, start printing and update the styles as\n // if there was a regular print `MediaChange`(from matchMedia).\n this.isPrintingBeforeAfterEvent = false;\n if (this.isPrinting) {\n this.stopPrinting(target);\n target.updateStyles();\n }\n });\n // Could we have teardown logic to remove if there are no print listeners being used?\n this._document.defaultView.addEventListener('beforeprint', beforePrintListener);\n this._document.defaultView.addEventListener('afterprint', afterPrintListener);\n this.beforePrintEventListeners.push(beforePrintListener);\n this.afterPrintEventListeners.push(afterPrintListener);\n }\n /**\n * Prepare RxJS filter operator with partial application\n * @param {?} target\n * @return {?} pipeable filter predicate\n */\n interceptEvents(target) {\n this.registerBeforeAfterPrintHooks(target);\n return (/**\n * @param {?} event\n * @return {?}\n */\n (event) => {\n if (this.isPrintEvent(event)) {\n if (event.matches && !this.isPrinting) {\n this.startPrinting(target, this.getEventBreakpoints(event));\n target.updateStyles();\n }\n else if (!event.matches && this.isPrinting && !this.isPrintingBeforeAfterEvent) {\n this.stopPrinting(target);\n target.updateStyles();\n }\n }\n else {\n this.collectActivations(event);\n }\n });\n }\n /**\n * Stop mediaChange event propagation in event streams\n * @return {?}\n */\n blockPropagation() {\n return (/**\n * @param {?} event\n * @return {?}\n */\n (event) => {\n return !(this.isPrinting || this.isPrintEvent(event));\n });\n }\n /**\n * Save current activateBreakpoints (for later restore)\n * and substitute only the printAlias breakpoint\n * @protected\n * @param {?} target\n * @param {?} bpList\n * @return {?}\n */\n startPrinting(target, bpList) {\n this.isPrinting = true;\n target.activatedBreakpoints = this.queue.addPrintBreakpoints(bpList);\n }\n /**\n * For any print de-activations, reset the entire print queue\n * @protected\n * @param {?} target\n * @return {?}\n */\n stopPrinting(target) {\n target.activatedBreakpoints = this.deactivations;\n this.deactivations = [];\n this.queue.clear();\n this.isPrinting = false;\n }\n /**\n * To restore pre-Print Activations, we must capture the proper\n * list of breakpoint activations BEFORE print starts. OnBeforePrint()\n * is supported; so 'print' mediaQuery activations are used as a fallback\n * in browsers without `beforeprint` support.\n *\n * > But activated breakpoints are deactivated BEFORE 'print' activation.\n *\n * Let's capture all de-activations using the following logic:\n *\n * When not printing:\n * - clear cache when activating non-print breakpoint\n * - update cache (and sort) when deactivating\n *\n * When printing:\n * - sort and save when starting print\n * - restore as activatedTargets and clear when stop printing\n * @param {?} event\n * @return {?}\n */\n collectActivations(event) {\n if (!this.isPrinting || this.isPrintingBeforeAfterEvent) {\n if (!event.matches) {\n /** @type {?} */\n const bp = this.breakpoints.findByQuery(event.mediaQuery);\n if (bp) { // Deactivating a breakpoint\n this.deactivations.push(bp);\n this.deactivations.sort(sortDescendingPriority);\n }\n }\n else if (!this.isPrintingBeforeAfterEvent) {\n // Only clear deactivations if we aren't printing from a `beforeprint` event.\n // Otherwise this will clear before `stopPrinting()` is called to restore\n // the pre-Print Activations.\n this.deactivations = [];\n }\n }\n }\n /**\n * Teardown logic for the service.\n * @return {?}\n */\n ngOnDestroy() {\n if (this._document.defaultView) {\n this.beforePrintEventListeners.forEach((/**\n * @param {?} l\n * @return {?}\n */\n l => this._document.defaultView.removeEventListener('beforeprint', l)));\n this.afterPrintEventListeners.forEach((/**\n * @param {?} l\n * @return {?}\n */\n l => this._document.defaultView.removeEventListener('afterprint', l)));\n }\n }\n}\nPrintHook.ɵfac = function PrintHook_Factory(t) { return new (t || PrintHook)(ɵngcc0.ɵɵinject(BreakPointRegistry), ɵngcc0.ɵɵinject(LAYOUT_CONFIG), ɵngcc0.ɵɵinject(DOCUMENT)); };\n/** @nocollapse */ PrintHook.ɵprov = ɵɵdefineInjectable({ factory: function PrintHook_Factory() { return new PrintHook(ɵɵinject(BreakPointRegistry), ɵɵinject(LAYOUT_CONFIG), ɵɵinject(DOCUMENT)); }, token: PrintHook, providedIn: \"root\" });\n/** @nocollapse */\nPrintHook.ctorParameters = () => [\n { type: BreakPointRegistry },\n { type: undefined, decorators: [{ type: Inject, args: [LAYOUT_CONFIG,] }] },\n { type: undefined, decorators: [{ type: Inject, args: [DOCUMENT,] }] }\n];\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(PrintHook, [{\n type: Injectable,\n args: [{ providedIn: 'root' }]\n }], function () { return [{ type: BreakPointRegistry }, { type: undefined, decorators: [{\n type: Inject,\n args: [LAYOUT_CONFIG]\n }] }, { type: undefined, decorators: [{\n type: Inject,\n args: [DOCUMENT]\n }] }]; }, null); })();\n// ************************************************************************\n// Internal Utility class 'PrintQueue'\n// ************************************************************************\n/**\n * Utility class to manage print breakpoints + activatedBreakpoints\n * with correct sorting WHILE printing\n */\nclass PrintQueue {\n constructor() {\n /**\n * Sorted queue with prioritized print breakpoints\n */\n this.printBreakpoints = [];\n }\n /**\n * @param {?} bpList\n * @return {?}\n */\n addPrintBreakpoints(bpList) {\n bpList.push(BREAKPOINT_PRINT);\n bpList.sort(sortDescendingPriority);\n bpList.forEach((/**\n * @param {?} bp\n * @return {?}\n */\n bp => this.addBreakpoint(bp)));\n return this.printBreakpoints;\n }\n /**\n * Add Print breakpoint to queue\n * @param {?} bp\n * @return {?}\n */\n addBreakpoint(bp) {\n if (!!bp) {\n /** @type {?} */\n const bpInList = this.printBreakpoints.find((/**\n * @param {?} it\n * @return {?}\n */\n it => it.mediaQuery === bp.mediaQuery));\n if (bpInList === undefined) {\n // If this is a `printAlias` breakpoint, then append. If a true 'print' breakpoint,\n // register as highest priority in the queue\n this.printBreakpoints = isPrintBreakPoint(bp) ? [bp, ...this.printBreakpoints]\n : [...this.printBreakpoints, bp];\n }\n }\n }\n /**\n * Restore original activated breakpoints and clear internal caches\n * @return {?}\n */\n clear() {\n this.printBreakpoints = [];\n }\n}\n// ************************************************************************\n// Internal Utility methods\n// ************************************************************************\n/**\n * Only support intercept queueing if the Breakpoint is a print \\@media query\n * @param {?} bp\n * @return {?}\n */\nfunction isPrintBreakPoint(bp) {\n return bp ? bp.mediaQuery.startsWith(PRINT) : false;\n}\n\n/**\n * @fileoverview added by tsickle\n * Generated from: core/utils/array.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n\n/**\n * Wraps the provided value in an array, unless the provided value is an array.\n * @template T\n * @param {?} value\n * @return {?}\n */\nfunction coerceArray(value) {\n return Array.isArray(value) ? value : [value];\n}\n\n/**\n * @fileoverview added by tsickle\n * Generated from: core/media-observer/media-observer.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n/**\n * MediaObserver enables applications to listen for 1..n mediaQuery activations and to determine\n * if a mediaQuery is currently activated.\n *\n * Since a breakpoint change will first deactivate 1...n mediaQueries and then possibly activate\n * 1..n mediaQueries, the MediaObserver will debounce notifications and report ALL *activations*\n * in 1 event notification. The reported activations will be sorted in descending priority order.\n *\n * This class uses the BreakPoint Registry to inject alias information into the raw MediaChange\n * notification. For custom mediaQuery notifications, alias information will not be injected and\n * those fields will be ''.\n *\n * Note: Developers should note that only mediaChange activations (not de-activations)\n * are announced by the MediaObserver.\n *\n * \\@usage\n *\n * // RxJS\n * import { filter } from 'rxjs/operators';\n * import { MediaObserver } from '\\@angular/flex-layout';\n *\n * \\@Component({ ... })\n * export class AppComponent {\n * status: string = '';\n *\n * constructor(mediaObserver: MediaObserver) {\n * const media$ = mediaObserver.asObservable().pipe(\n * filter((changes: MediaChange[]) => true) // silly noop filter\n * );\n *\n * media$.subscribe((changes: MediaChange[]) => {\n * let status = '';\n * changes.forEach( change => {\n * status += `'${change.mqAlias}' = (${change.mediaQuery})
` ;\n * });\n * this.status = status;\n * });\n *\n * }\n * }\n */\nclass MediaObserver {\n /**\n * @param {?} breakpoints\n * @param {?} matchMedia\n * @param {?} hook\n */\n constructor(breakpoints, matchMedia, hook) {\n this.breakpoints = breakpoints;\n this.matchMedia = matchMedia;\n this.hook = hook;\n /**\n * Filter MediaChange notifications for overlapping breakpoints\n */\n this.filterOverlaps = false;\n this.destroyed$ = new Subject();\n this._media$ = this.watchActivations();\n this.media$ = this._media$.pipe(filter((/**\n * @param {?} changes\n * @return {?}\n */\n (changes) => changes.length > 0)), map((/**\n * @param {?} changes\n * @return {?}\n */\n (changes) => changes[0])));\n }\n /**\n * Completes the active subject, signalling to all complete for all\n * MediaObserver subscribers\n * @return {?}\n */\n ngOnDestroy() {\n this.destroyed$.next();\n this.destroyed$.complete();\n }\n // ************************************************\n // Public Methods\n // ************************************************\n /**\n * Observe changes to current activation 'list'\n * @return {?}\n */\n asObservable() {\n return this._media$;\n }\n /**\n * Allow programmatic query to determine if one or more media query/alias match\n * the current viewport size.\n * @param {?} value One or more media queries (or aliases) to check.\n * @return {?} Whether any of the media queries match.\n */\n isActive(value) {\n /** @type {?} */\n const aliases = splitQueries(coerceArray(value));\n return aliases.some((/**\n * @param {?} alias\n * @return {?}\n */\n alias => {\n /** @type {?} */\n const query = toMediaQuery(alias, this.breakpoints);\n return query !== null && this.matchMedia.isActive(query);\n }));\n }\n // ************************************************\n // Internal Methods\n // ************************************************\n /**\n * Register all the mediaQueries registered in the BreakPointRegistry\n * This is needed so subscribers can be auto-notified of all standard, registered\n * mediaQuery activations\n * @private\n * @return {?}\n */\n watchActivations() {\n /** @type {?} */\n const queries = this.breakpoints.items.map((/**\n * @param {?} bp\n * @return {?}\n */\n bp => bp.mediaQuery));\n return this.buildObservable(queries);\n }\n /**\n * Only pass/announce activations (not de-activations)\n *\n * Since multiple-mediaQueries can be activation in a cycle,\n * gather all current activations into a single list of changes to observers\n *\n * Inject associated (if any) alias information into the MediaChange event\n * - Exclude mediaQuery activations for overlapping mQs. List bounded mQ ranges only\n * - Exclude print activations that do not have an associated mediaQuery\n *\n * NOTE: the raw MediaChange events [from MatchMedia] do not\n * contain important alias information; as such this info\n * must be injected into the MediaChange\n * @private\n * @param {?} mqList\n * @return {?}\n */\n buildObservable(mqList) {\n /** @type {?} */\n const hasChanges = (/**\n * @param {?} changes\n * @return {?}\n */\n (changes) => {\n /** @type {?} */\n const isValidQuery = (/**\n * @param {?} change\n * @return {?}\n */\n (change) => (change.mediaQuery.length > 0));\n return (changes.filter(isValidQuery).length > 0);\n });\n /** @type {?} */\n const excludeOverlaps = (/**\n * @param {?} changes\n * @return {?}\n */\n (changes) => {\n return !this.filterOverlaps ? changes : changes.filter((/**\n * @param {?} change\n * @return {?}\n */\n change => {\n /** @type {?} */\n const bp = this.breakpoints.findByQuery(change.mediaQuery);\n return !bp ? true : !bp.overlapping;\n }));\n });\n /**\n */\n return this.matchMedia\n .observe(this.hook.withPrintQuery(mqList))\n .pipe(filter((/**\n * @param {?} change\n * @return {?}\n */\n (change) => change.matches)), debounceTime(0, asapScheduler), switchMap((/**\n * @param {?} _\n * @return {?}\n */\n _ => of(this.findAllActivations()))), map(excludeOverlaps), filter(hasChanges), takeUntil(this.destroyed$));\n }\n /**\n * Find all current activations and prepare single list of activations\n * sorted by descending priority.\n * @private\n * @return {?}\n */\n findAllActivations() {\n /** @type {?} */\n const mergeMQAlias = (/**\n * @param {?} change\n * @return {?}\n */\n (change) => {\n /** @type {?} */\n let bp = this.breakpoints.findByQuery(change.mediaQuery);\n return mergeAlias(change, bp);\n });\n /** @type {?} */\n const replaceWithPrintAlias = (/**\n * @param {?} change\n * @return {?}\n */\n (change) => {\n return this.hook.isPrintEvent(change) ? this.hook.updateEvent(change) : change;\n });\n return this.matchMedia\n .activations\n .map((/**\n * @param {?} query\n * @return {?}\n */\n query => new MediaChange(true, query)))\n .map(replaceWithPrintAlias)\n .map(mergeMQAlias)\n .sort(sortDescendingPriority);\n }\n}\nMediaObserver.ɵfac = function MediaObserver_Factory(t) { return new (t || MediaObserver)(ɵngcc0.ɵɵinject(BreakPointRegistry), ɵngcc0.ɵɵinject(MatchMedia), ɵngcc0.ɵɵinject(PrintHook)); };\n/** @nocollapse */ MediaObserver.ɵprov = ɵɵdefineInjectable({ factory: function MediaObserver_Factory() { return new MediaObserver(ɵɵinject(BreakPointRegistry), ɵɵinject(MatchMedia), ɵɵinject(PrintHook)); }, token: MediaObserver, providedIn: \"root\" });\n/** @nocollapse */\nMediaObserver.ctorParameters = () => [\n { type: BreakPointRegistry },\n { type: MatchMedia },\n { type: PrintHook }\n];\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(MediaObserver, [{\n type: Injectable,\n args: [{ providedIn: 'root' }]\n }], function () { return [{ type: BreakPointRegistry }, { type: MatchMedia }, { type: PrintHook }]; }, null); })();\n/**\n * Find associated breakpoint (if any)\n * @param {?} query\n * @param {?} locator\n * @return {?}\n */\nfunction toMediaQuery(query, locator) {\n /** @type {?} */\n const bp = locator.findByAlias(query) || locator.findByQuery(query);\n return bp ? bp.mediaQuery : null;\n}\n/**\n * Split each query string into separate query strings if two queries are provided as comma\n * separated.\n * @param {?} queries\n * @return {?}\n */\nfunction splitQueries(queries) {\n return queries.map((/**\n * @param {?} query\n * @return {?}\n */\n (query) => query.split(',')))\n .reduce((/**\n * @param {?} a1\n * @param {?} a2\n * @return {?}\n */\n (a1, a2) => a1.concat(a2)))\n .map((/**\n * @param {?} query\n * @return {?}\n */\n query => query.trim()));\n}\n\n/**\n * @fileoverview added by tsickle\n * Generated from: core/media-observer/index.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n\n/**\n * @fileoverview added by tsickle\n * Generated from: core/media-trigger/media-trigger.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n/**\n * Class\n */\nclass MediaTrigger {\n /**\n * @param {?} breakpoints\n * @param {?} matchMedia\n * @param {?} layoutConfig\n * @param {?} _platformId\n * @param {?} _document\n */\n constructor(breakpoints, matchMedia, layoutConfig, _platformId, _document) {\n this.breakpoints = breakpoints;\n this.matchMedia = matchMedia;\n this.layoutConfig = layoutConfig;\n this._platformId = _platformId;\n this._document = _document;\n this.hasCachedRegistryMatches = false;\n this.originalActivations = [];\n this.originalRegistry = new Map();\n }\n /**\n * Manually activate range of breakpoints\n * @param {?} list array of mediaQuery or alias strings\n * @return {?}\n */\n activate(list) {\n list = list.map((/**\n * @param {?} it\n * @return {?}\n */\n it => it.trim())); // trim queries\n this.saveActivations();\n this.deactivateAll();\n this.setActivations(list);\n this.prepareAutoRestore();\n }\n /**\n * Restore original, 'real' breakpoints and emit events\n * to trigger stream notification\n * @return {?}\n */\n restore() {\n if (this.hasCachedRegistryMatches) {\n /** @type {?} */\n const extractQuery = (/**\n * @param {?} change\n * @return {?}\n */\n (change) => change.mediaQuery);\n /** @type {?} */\n const list = this.originalActivations.map(extractQuery);\n try {\n this.deactivateAll();\n this.restoreRegistryMatches();\n this.setActivations(list);\n }\n finally {\n this.originalActivations = [];\n if (this.resizeSubscription) {\n this.resizeSubscription.unsubscribe();\n }\n }\n }\n }\n // ************************************************\n // Internal Methods\n // ************************************************\n /**\n * Whenever window resizes, immediately auto-restore original\n * activations (if we are simulating activations)\n * @private\n * @return {?}\n */\n prepareAutoRestore() {\n /** @type {?} */\n const isBrowser = isPlatformBrowser(this._platformId) && this._document;\n /** @type {?} */\n const enableAutoRestore = isBrowser && this.layoutConfig.mediaTriggerAutoRestore;\n if (enableAutoRestore) {\n /** @type {?} */\n const resize$ = fromEvent(window, 'resize').pipe(take(1));\n this.resizeSubscription = resize$.subscribe(this.restore.bind(this));\n }\n }\n /**\n * Notify all matchMedia subscribers of de-activations\n *\n * Note: we must force 'matches' updates for\n * future matchMedia::activation lookups\n * @private\n * @return {?}\n */\n deactivateAll() {\n /** @type {?} */\n const list = this.currentActivations;\n this.forceRegistryMatches(list, false);\n this.simulateMediaChanges(list, false);\n }\n /**\n * Cache current activations as sorted, prioritized list of MediaChanges\n * @private\n * @return {?}\n */\n saveActivations() {\n if (!this.hasCachedRegistryMatches) {\n /** @type {?} */\n const toMediaChange = (/**\n * @param {?} query\n * @return {?}\n */\n (query) => new MediaChange(true, query));\n /** @type {?} */\n const mergeMQAlias = (/**\n * @param {?} change\n * @return {?}\n */\n (change) => {\n /** @type {?} */\n const bp = this.breakpoints.findByQuery(change.mediaQuery);\n return mergeAlias(change, bp);\n });\n this.originalActivations = this.currentActivations\n .map(toMediaChange)\n .map(mergeMQAlias)\n .sort(sortDescendingPriority);\n this.cacheRegistryMatches();\n }\n }\n /**\n * Force set manual activations for specified mediaQuery list\n * @private\n * @param {?} list\n * @return {?}\n */\n setActivations(list) {\n if (!!this.originalRegistry) {\n this.forceRegistryMatches(list, true);\n }\n this.simulateMediaChanges(list);\n }\n /**\n * For specified mediaQuery list manually simulate activations or deactivations\n * @private\n * @param {?} queries\n * @param {?=} matches\n * @return {?}\n */\n simulateMediaChanges(queries, matches = true) {\n /** @type {?} */\n const toMediaQuery = (/**\n * @param {?} query\n * @return {?}\n */\n (query) => {\n /** @type {?} */\n const locator = this.breakpoints;\n /** @type {?} */\n const bp = locator.findByAlias(query) || locator.findByQuery(query);\n return bp ? bp.mediaQuery : query;\n });\n /** @type {?} */\n const emitChangeEvent = (/**\n * @param {?} query\n * @return {?}\n */\n (query) => this.emitChangeEvent(matches, query));\n queries.map(toMediaQuery).forEach(emitChangeEvent);\n }\n /**\n * Replace current registry with simulated registry...\n * Note: this is required since MediaQueryList::matches is 'readOnly'\n * @private\n * @param {?} queries\n * @param {?} matches\n * @return {?}\n */\n forceRegistryMatches(queries, matches) {\n /** @type {?} */\n const registry = new Map();\n queries.forEach((/**\n * @param {?} query\n * @return {?}\n */\n query => {\n registry.set(query, (/** @type {?} */ ({ matches })));\n }));\n this.matchMedia.registry = registry;\n }\n /**\n * Save current MatchMedia::registry items.\n * @private\n * @return {?}\n */\n cacheRegistryMatches() {\n /** @type {?} */\n const target = this.originalRegistry;\n target.clear();\n this.matchMedia.registry.forEach((/**\n * @param {?} value\n * @param {?} key\n * @return {?}\n */\n (value, key) => {\n target.set(key, value);\n }));\n this.hasCachedRegistryMatches = true;\n }\n /**\n * Restore original, 'true' registry\n * @private\n * @return {?}\n */\n restoreRegistryMatches() {\n /** @type {?} */\n const target = this.matchMedia.registry;\n target.clear();\n this.originalRegistry.forEach((/**\n * @param {?} value\n * @param {?} key\n * @return {?}\n */\n (value, key) => {\n target.set(key, value);\n }));\n this.originalRegistry.clear();\n this.hasCachedRegistryMatches = false;\n }\n /**\n * Manually emit a MediaChange event via the MatchMedia to MediaMarshaller and MediaObserver\n * @private\n * @param {?} matches\n * @param {?} query\n * @return {?}\n */\n emitChangeEvent(matches, query) {\n this.matchMedia.source.next(new MediaChange(matches, query));\n }\n /**\n * @private\n * @return {?}\n */\n get currentActivations() {\n return this.matchMedia.activations;\n }\n}\nMediaTrigger.ɵfac = function MediaTrigger_Factory(t) { return new (t || MediaTrigger)(ɵngcc0.ɵɵinject(BreakPointRegistry), ɵngcc0.ɵɵinject(MatchMedia), ɵngcc0.ɵɵinject(LAYOUT_CONFIG), ɵngcc0.ɵɵinject(PLATFORM_ID), ɵngcc0.ɵɵinject(DOCUMENT)); };\n/** @nocollapse */ MediaTrigger.ɵprov = ɵɵdefineInjectable({ factory: function MediaTrigger_Factory() { return new MediaTrigger(ɵɵinject(BreakPointRegistry), ɵɵinject(MatchMedia), ɵɵinject(LAYOUT_CONFIG), ɵɵinject(PLATFORM_ID), ɵɵinject(DOCUMENT)); }, token: MediaTrigger, providedIn: \"root\" });\n/** @nocollapse */\nMediaTrigger.ctorParameters = () => [\n { type: BreakPointRegistry },\n { type: MatchMedia },\n { type: undefined, decorators: [{ type: Inject, args: [LAYOUT_CONFIG,] }] },\n { type: Object, decorators: [{ type: Inject, args: [PLATFORM_ID,] }] },\n { type: undefined, decorators: [{ type: Inject, args: [DOCUMENT,] }] }\n];\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(MediaTrigger, [{\n type: Injectable,\n args: [{ providedIn: 'root' }]\n }], function () { return [{ type: BreakPointRegistry }, { type: MatchMedia }, { type: undefined, decorators: [{\n type: Inject,\n args: [LAYOUT_CONFIG]\n }] }, { type: Object, decorators: [{\n type: Inject,\n args: [PLATFORM_ID]\n }] }, { type: undefined, decorators: [{\n type: Inject,\n args: [DOCUMENT]\n }] }]; }, null); })();\n\n/**\n * @fileoverview added by tsickle\n * Generated from: core/media-trigger/index.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n\n/**\n * @fileoverview added by tsickle\n * Generated from: core/utils/index.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n\n/**\n * @fileoverview added by tsickle\n * Generated from: utils/auto-prefixer.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n\n/**\n * Applies CSS prefixes to appropriate style keys.\n *\n * Note: `-ms-`, `-moz` and `-webkit-box` are no longer supported. e.g.\n * {\n * display: -webkit-flex; NEW - Safari 6.1+. iOS 7.1+, BB10\n * display: flex; NEW, Spec - Firefox, Chrome, Opera\n * // display: -webkit-box; OLD - iOS 6-, Safari 3.1-6, BB7\n * // display: -ms-flexbox; TWEENER - IE 10\n * // display: -moz-flexbox; OLD - Firefox\n * }\n * @param {?} target\n * @return {?}\n */\nfunction applyCssPrefixes(target) {\n for (let key in target) {\n /** @type {?} */\n let value = target[key] || '';\n switch (key) {\n case 'display':\n if (value === 'flex') {\n target['display'] = [\n '-webkit-flex',\n 'flex'\n ];\n }\n else if (value === 'inline-flex') {\n target['display'] = [\n '-webkit-inline-flex',\n 'inline-flex'\n ];\n }\n else {\n target['display'] = value;\n }\n break;\n case 'align-items':\n case 'align-self':\n case 'align-content':\n case 'flex':\n case 'flex-basis':\n case 'flex-flow':\n case 'flex-grow':\n case 'flex-shrink':\n case 'flex-wrap':\n case 'justify-content':\n target['-webkit-' + key] = value;\n break;\n case 'flex-direction':\n value = value || 'row';\n target['-webkit-flex-direction'] = value;\n target['flex-direction'] = value;\n break;\n case 'order':\n target['order'] = target['-webkit-' + key] = isNaN(+value) ? '0' : value;\n break;\n }\n }\n return target;\n}\n\n/**\n * @fileoverview added by tsickle\n * Generated from: core/style-utils/style-utils.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\nclass StyleUtils {\n /**\n * @param {?} _serverStylesheet\n * @param {?} _serverModuleLoaded\n * @param {?} _platformId\n * @param {?} layoutConfig\n */\n constructor(_serverStylesheet, _serverModuleLoaded, _platformId, layoutConfig) {\n this._serverStylesheet = _serverStylesheet;\n this._serverModuleLoaded = _serverModuleLoaded;\n this._platformId = _platformId;\n this.layoutConfig = layoutConfig;\n }\n /**\n * Applies styles given via string pair or object map to the directive element\n * @param {?} element\n * @param {?} style\n * @param {?=} value\n * @return {?}\n */\n applyStyleToElement(element, style, value = null) {\n /** @type {?} */\n let styles = {};\n if (typeof style === 'string') {\n styles[style] = value;\n style = styles;\n }\n styles = this.layoutConfig.disableVendorPrefixes ? style : applyCssPrefixes(style);\n this._applyMultiValueStyleToElement(styles, element);\n }\n /**\n * Applies styles given via string pair or object map to the directive's element\n * @param {?} style\n * @param {?=} elements\n * @return {?}\n */\n applyStyleToElements(style, elements = []) {\n /** @type {?} */\n const styles = this.layoutConfig.disableVendorPrefixes ? style : applyCssPrefixes(style);\n elements.forEach((/**\n * @param {?} el\n * @return {?}\n */\n el => {\n this._applyMultiValueStyleToElement(styles, el);\n }));\n }\n /**\n * Determine the DOM element's Flexbox flow (flex-direction)\n *\n * Check inline style first then check computed (stylesheet) style\n * @param {?} target\n * @return {?}\n */\n getFlowDirection(target) {\n /** @type {?} */\n const query = 'flex-direction';\n /** @type {?} */\n let value = this.lookupStyle(target, query);\n /** @type {?} */\n const hasInlineValue = this.lookupInlineStyle(target, query) ||\n (isPlatformServer(this._platformId) && this._serverModuleLoaded) ? value : '';\n return [value || 'row', hasInlineValue];\n }\n /**\n * @param {?} target\n * @return {?}\n */\n hasWrap(target) {\n /** @type {?} */\n const query = 'flex-wrap';\n return this.lookupStyle(target, query) === 'wrap';\n }\n /**\n * Find the DOM element's raw attribute value (if any)\n * @param {?} element\n * @param {?} attribute\n * @return {?}\n */\n lookupAttributeValue(element, attribute) {\n return element.getAttribute(attribute) || '';\n }\n /**\n * Find the DOM element's inline style value (if any)\n * @param {?} element\n * @param {?} styleName\n * @return {?}\n */\n lookupInlineStyle(element, styleName) {\n return isPlatformBrowser(this._platformId) ?\n element.style.getPropertyValue(styleName) : this._getServerStyle(element, styleName);\n }\n /**\n * Determine the inline or inherited CSS style\n * NOTE: platform-server has no implementation for getComputedStyle\n * @param {?} element\n * @param {?} styleName\n * @param {?=} inlineOnly\n * @return {?}\n */\n lookupStyle(element, styleName, inlineOnly = false) {\n /** @type {?} */\n let value = '';\n if (element) {\n /** @type {?} */\n let immediateValue = value = this.lookupInlineStyle(element, styleName);\n if (!immediateValue) {\n if (isPlatformBrowser(this._platformId)) {\n if (!inlineOnly) {\n value = getComputedStyle(element).getPropertyValue(styleName);\n }\n }\n else {\n if (this._serverModuleLoaded) {\n value = this._serverStylesheet.getStyleForElement(element, styleName);\n }\n }\n }\n }\n // Note: 'inline' is the default of all elements, unless UA stylesheet overrides;\n // in which case getComputedStyle() should determine a valid value.\n return value ? value.trim() : '';\n }\n /**\n * Applies the styles to the element. The styles object map may contain an array of values\n * Each value will be added as element style\n * Keys are sorted to add prefixed styles (like -webkit-x) first, before the standard ones\n * @private\n * @param {?} styles\n * @param {?} element\n * @return {?}\n */\n _applyMultiValueStyleToElement(styles, element) {\n Object.keys(styles).sort().forEach((/**\n * @param {?} key\n * @return {?}\n */\n key => {\n /** @type {?} */\n const el = styles[key];\n /** @type {?} */\n const values = Array.isArray(el) ? el : [el];\n values.sort();\n for (let value of values) {\n value = value ? value + '' : '';\n if (isPlatformBrowser(this._platformId) || !this._serverModuleLoaded) {\n isPlatformBrowser(this._platformId) ?\n element.style.setProperty(key, value) : this._setServerStyle(element, key, value);\n }\n else {\n this._serverStylesheet.addStyleToElement(element, key, value);\n }\n }\n }));\n }\n /**\n * @private\n * @param {?} element\n * @param {?} styleName\n * @param {?=} styleValue\n * @return {?}\n */\n _setServerStyle(element, styleName, styleValue) {\n styleName = styleName.replace(/([a-z])([A-Z])/g, '$1-$2').toLowerCase();\n /** @type {?} */\n const styleMap = this._readStyleAttribute(element);\n styleMap[styleName] = styleValue || '';\n this._writeStyleAttribute(element, styleMap);\n }\n /**\n * @private\n * @param {?} element\n * @param {?} styleName\n * @return {?}\n */\n _getServerStyle(element, styleName) {\n /** @type {?} */\n const styleMap = this._readStyleAttribute(element);\n return styleMap[styleName] || '';\n }\n /**\n * @private\n * @param {?} element\n * @return {?}\n */\n _readStyleAttribute(element) {\n /** @type {?} */\n const styleMap = {};\n /** @type {?} */\n const styleAttribute = element.getAttribute('style');\n if (styleAttribute) {\n /** @type {?} */\n const styleList = styleAttribute.split(/;+/g);\n for (let i = 0; i < styleList.length; i++) {\n /** @type {?} */\n const style = styleList[i].trim();\n if (style.length > 0) {\n /** @type {?} */\n const colonIndex = style.indexOf(':');\n if (colonIndex === -1) {\n throw new Error(`Invalid CSS style: ${style}`);\n }\n /** @type {?} */\n const name = style.substr(0, colonIndex).trim();\n styleMap[name] = style.substr(colonIndex + 1).trim();\n }\n }\n }\n return styleMap;\n }\n /**\n * @private\n * @param {?} element\n * @param {?} styleMap\n * @return {?}\n */\n _writeStyleAttribute(element, styleMap) {\n /** @type {?} */\n let styleAttrValue = '';\n for (const key in styleMap) {\n /** @type {?} */\n const newValue = styleMap[key];\n if (newValue) {\n styleAttrValue += key + ':' + styleMap[key] + ';';\n }\n }\n element.setAttribute('style', styleAttrValue);\n }\n}\nStyleUtils.ɵfac = function StyleUtils_Factory(t) { return new (t || StyleUtils)(ɵngcc0.ɵɵinject(StylesheetMap), ɵngcc0.ɵɵinject(SERVER_TOKEN), ɵngcc0.ɵɵinject(PLATFORM_ID), ɵngcc0.ɵɵinject(LAYOUT_CONFIG)); };\n/** @nocollapse */ StyleUtils.ɵprov = ɵɵdefineInjectable({ factory: function StyleUtils_Factory() { return new StyleUtils(ɵɵinject(StylesheetMap), ɵɵinject(SERVER_TOKEN), ɵɵinject(PLATFORM_ID), ɵɵinject(LAYOUT_CONFIG)); }, token: StyleUtils, providedIn: \"root\" });\n/** @nocollapse */\nStyleUtils.ctorParameters = () => [\n { type: StylesheetMap },\n { type: Boolean, decorators: [{ type: Inject, args: [SERVER_TOKEN,] }] },\n { type: Object, decorators: [{ type: Inject, args: [PLATFORM_ID,] }] },\n { type: undefined, decorators: [{ type: Inject, args: [LAYOUT_CONFIG,] }] }\n];\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(StyleUtils, [{\n type: Injectable,\n args: [{ providedIn: 'root' }]\n }], function () { return [{ type: StylesheetMap }, { type: Boolean, decorators: [{\n type: Inject,\n args: [SERVER_TOKEN]\n }] }, { type: Object, decorators: [{\n type: Inject,\n args: [PLATFORM_ID]\n }] }, { type: undefined, decorators: [{\n type: Inject,\n args: [LAYOUT_CONFIG]\n }] }]; }, null); })();\n\n/**\n * @fileoverview added by tsickle\n * Generated from: core/style-builder/style-builder.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n/**\n * A class that encapsulates CSS style generation for common directives\n * @abstract\n */\nclass StyleBuilder {\n constructor() {\n /**\n * Whether to cache the generated output styles\n */\n this.shouldCache = true;\n }\n /**\n * Run a side effect computation given the input string and the computed styles\n * from the build task and the host configuration object\n * NOTE: This should be a no-op unless an algorithm is provided in a subclass\n * @param {?} _input\n * @param {?} _styles\n * @param {?=} _parent\n * @return {?}\n */\n sideEffect(_input, _styles, _parent) {\n }\n}\n\n/**\n * @fileoverview added by tsickle\n * Generated from: core/basis-validator/basis-validator.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n\n/**\n * The flex API permits 3 or 1 parts of the value:\n * - `flex-grow flex-shrink flex-basis`, or\n * - `flex-basis`\n * @param {?} basis\n * @param {?=} grow\n * @param {?=} shrink\n * @return {?}\n */\nfunction validateBasis(basis, grow = '1', shrink = '1') {\n /** @type {?} */\n let parts = [grow, shrink, basis];\n /** @type {?} */\n let j = basis.indexOf('calc');\n if (j > 0) {\n parts[2] = _validateCalcValue(basis.substring(j).trim());\n /** @type {?} */\n let matches = basis.substr(0, j).trim().split(' ');\n if (matches.length == 2) {\n parts[0] = matches[0];\n parts[1] = matches[1];\n }\n }\n else if (j == 0) {\n parts[2] = _validateCalcValue(basis.trim());\n }\n else {\n /** @type {?} */\n let matches = basis.split(' ');\n parts = (matches.length === 3) ? matches : [\n grow, shrink, basis\n ];\n }\n return parts;\n}\n/**\n * Calc expressions require whitespace before & after any expression operators\n * This is a simple, crude whitespace padding solution.\n * - '3 3 calc(15em + 20px)'\n * - calc(100% / 7 * 2)\n * - 'calc(15em + 20px)'\n * - 'calc(15em+20px)'\n * - '37px'\n * = '43%'\n * @param {?} calc\n * @return {?}\n */\nfunction _validateCalcValue(calc) {\n return calc.replace(/[\\s]/g, '').replace(/[\\/\\*\\+\\-]/g, ' $& ');\n}\n\n/**\n * @fileoverview added by tsickle\n * Generated from: core/media-marshaller/media-marshaller.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n/**\n * MediaMarshaller - register responsive values from directives and\n * trigger them based on media query events\n */\nclass MediaMarshaller {\n /**\n * @param {?} matchMedia\n * @param {?} breakpoints\n * @param {?} hook\n */\n constructor(matchMedia, breakpoints, hook) {\n this.matchMedia = matchMedia;\n this.breakpoints = breakpoints;\n this.hook = hook;\n this.activatedBreakpoints = [];\n this.elementMap = new Map();\n this.elementKeyMap = new WeakMap();\n this.watcherMap = new WeakMap(); // special triggers to update elements\n // special triggers to update elements\n this.updateMap = new WeakMap(); // callback functions to update styles\n // callback functions to update styles\n this.clearMap = new WeakMap(); // callback functions to clear styles\n // callback functions to clear styles\n this.subject = new Subject();\n this.observeActivations();\n }\n /**\n * @return {?}\n */\n get activatedAlias() {\n return this.activatedBreakpoints[0] ? this.activatedBreakpoints[0].alias : '';\n }\n /**\n * Update styles on breakpoint activates or deactivates\n * @param {?} mc\n * @return {?}\n */\n onMediaChange(mc) {\n /** @type {?} */\n const bp = this.findByQuery(mc.mediaQuery);\n if (bp) {\n mc = mergeAlias(mc, bp);\n if (mc.matches && this.activatedBreakpoints.indexOf(bp) === -1) {\n this.activatedBreakpoints.push(bp);\n this.activatedBreakpoints.sort(sortDescendingPriority);\n this.updateStyles();\n }\n else if (!mc.matches && this.activatedBreakpoints.indexOf(bp) !== -1) {\n // Remove the breakpoint when it's deactivated\n this.activatedBreakpoints.splice(this.activatedBreakpoints.indexOf(bp), 1);\n this.activatedBreakpoints.sort(sortDescendingPriority);\n this.updateStyles();\n }\n }\n }\n /**\n * initialize the marshaller with necessary elements for delegation on an element\n * @param {?} element\n * @param {?} key\n * @param {?=} updateFn optional callback so that custom bp directives don't have to re-provide this\n * @param {?=} clearFn optional callback so that custom bp directives don't have to re-provide this\n * @param {?=} extraTriggers other triggers to force style updates (e.g. layout, directionality, etc)\n * @return {?}\n */\n init(element, key, updateFn, clearFn, extraTriggers = []) {\n initBuilderMap(this.updateMap, element, key, updateFn);\n initBuilderMap(this.clearMap, element, key, clearFn);\n this.buildElementKeyMap(element, key);\n this.watchExtraTriggers(element, key, extraTriggers);\n }\n /**\n * get the value for an element and key and optionally a given breakpoint\n * @param {?} element\n * @param {?} key\n * @param {?=} bp\n * @return {?}\n */\n getValue(element, key, bp) {\n /** @type {?} */\n const bpMap = this.elementMap.get(element);\n if (bpMap) {\n /** @type {?} */\n const values = bp !== undefined ? bpMap.get(bp) : this.getActivatedValues(bpMap, key);\n if (values) {\n return values.get(key);\n }\n }\n return undefined;\n }\n /**\n * whether the element has values for a given key\n * @param {?} element\n * @param {?} key\n * @return {?}\n */\n hasValue(element, key) {\n /** @type {?} */\n const bpMap = this.elementMap.get(element);\n if (bpMap) {\n /** @type {?} */\n const values = this.getActivatedValues(bpMap, key);\n if (values) {\n return values.get(key) !== undefined || false;\n }\n }\n return false;\n }\n /**\n * Set the value for an input on a directive\n * @param {?} element the element in question\n * @param {?} key the type of the directive (e.g. flex, layout-gap, etc)\n * @param {?} val the value for the breakpoint\n * @param {?} bp the breakpoint suffix (empty string = default)\n * @return {?}\n */\n setValue(element, key, val, bp) {\n /** @type {?} */\n let bpMap = this.elementMap.get(element);\n if (!bpMap) {\n bpMap = new Map().set(bp, new Map().set(key, val));\n this.elementMap.set(element, bpMap);\n }\n else {\n /** @type {?} */\n const values = (bpMap.get(bp) || new Map()).set(key, val);\n bpMap.set(bp, values);\n this.elementMap.set(element, bpMap);\n }\n /** @type {?} */\n const value = this.getValue(element, key);\n if (value !== undefined) {\n this.updateElement(element, key, value);\n }\n }\n /**\n * Track element value changes for a specific key\n * @param {?} element\n * @param {?} key\n * @return {?}\n */\n trackValue(element, key) {\n return this.subject\n .asObservable()\n .pipe(filter((/**\n * @param {?} v\n * @return {?}\n */\n v => v.element === element && v.key === key)));\n }\n /**\n * update all styles for all elements on the current breakpoint\n * @return {?}\n */\n updateStyles() {\n this.elementMap.forEach((/**\n * @param {?} bpMap\n * @param {?} el\n * @return {?}\n */\n (bpMap, el) => {\n /** @type {?} */\n const keyMap = new Set((/** @type {?} */ (this.elementKeyMap.get(el))));\n /** @type {?} */\n let valueMap = this.getActivatedValues(bpMap);\n if (valueMap) {\n valueMap.forEach((/**\n * @param {?} v\n * @param {?} k\n * @return {?}\n */\n (v, k) => {\n this.updateElement(el, k, v);\n keyMap.delete(k);\n }));\n }\n keyMap.forEach((/**\n * @param {?} k\n * @return {?}\n */\n k => {\n valueMap = this.getActivatedValues(bpMap, k);\n if (valueMap) {\n /** @type {?} */\n const value = valueMap.get(k);\n this.updateElement(el, k, value);\n }\n else {\n this.clearElement(el, k);\n }\n }));\n }));\n }\n /**\n * clear the styles for a given element\n * @param {?} element\n * @param {?} key\n * @return {?}\n */\n clearElement(element, key) {\n /** @type {?} */\n const builders = this.clearMap.get(element);\n if (builders) {\n /** @type {?} */\n const clearFn = (/** @type {?} */ (builders.get(key)));\n if (!!clearFn) {\n clearFn();\n this.subject.next({ element, key, value: '' });\n }\n }\n }\n /**\n * update a given element with the activated values for a given key\n * @param {?} element\n * @param {?} key\n * @param {?} value\n * @return {?}\n */\n updateElement(element, key, value) {\n /** @type {?} */\n const builders = this.updateMap.get(element);\n if (builders) {\n /** @type {?} */\n const updateFn = (/** @type {?} */ (builders.get(key)));\n if (!!updateFn) {\n updateFn(value);\n this.subject.next({ element, key, value });\n }\n }\n }\n /**\n * release all references to a given element\n * @param {?} element\n * @return {?}\n */\n releaseElement(element) {\n /** @type {?} */\n const watcherMap = this.watcherMap.get(element);\n if (watcherMap) {\n watcherMap.forEach((/**\n * @param {?} s\n * @return {?}\n */\n s => s.unsubscribe()));\n this.watcherMap.delete(element);\n }\n /** @type {?} */\n const elementMap = this.elementMap.get(element);\n if (elementMap) {\n elementMap.forEach((/**\n * @param {?} _\n * @param {?} s\n * @return {?}\n */\n (_, s) => elementMap.delete(s)));\n this.elementMap.delete(element);\n }\n }\n /**\n * trigger an update for a given element and key (e.g. layout)\n * @param {?} element\n * @param {?=} key\n * @return {?}\n */\n triggerUpdate(element, key) {\n /** @type {?} */\n const bpMap = this.elementMap.get(element);\n if (bpMap) {\n /** @type {?} */\n const valueMap = this.getActivatedValues(bpMap, key);\n if (valueMap) {\n if (key) {\n this.updateElement(element, key, valueMap.get(key));\n }\n else {\n valueMap.forEach((/**\n * @param {?} v\n * @param {?} k\n * @return {?}\n */\n (v, k) => this.updateElement(element, k, v)));\n }\n }\n }\n }\n /**\n * Cross-reference for HTMLElement with directive key\n * @private\n * @param {?} element\n * @param {?} key\n * @return {?}\n */\n buildElementKeyMap(element, key) {\n /** @type {?} */\n let keyMap = this.elementKeyMap.get(element);\n if (!keyMap) {\n keyMap = new Set();\n this.elementKeyMap.set(element, keyMap);\n }\n keyMap.add(key);\n }\n /**\n * Other triggers that should force style updates:\n * - directionality\n * - layout changes\n * - mutationobserver updates\n * @private\n * @param {?} element\n * @param {?} key\n * @param {?} triggers\n * @return {?}\n */\n watchExtraTriggers(element, key, triggers) {\n if (triggers && triggers.length) {\n /** @type {?} */\n let watchers = this.watcherMap.get(element);\n if (!watchers) {\n watchers = new Map();\n this.watcherMap.set(element, watchers);\n }\n /** @type {?} */\n const subscription = watchers.get(key);\n if (!subscription) {\n /** @type {?} */\n const newSubscription = merge(...triggers).subscribe((/**\n * @return {?}\n */\n () => {\n /** @type {?} */\n const currentValue = this.getValue(element, key);\n this.updateElement(element, key, currentValue);\n }));\n watchers.set(key, newSubscription);\n }\n }\n }\n /**\n * Breakpoint locator by mediaQuery\n * @private\n * @param {?} query\n * @return {?}\n */\n findByQuery(query) {\n return this.breakpoints.findByQuery(query);\n }\n /**\n * get the fallback breakpoint for a given element, starting with the current breakpoint\n * @private\n * @param {?} bpMap\n * @param {?=} key\n * @return {?}\n */\n getActivatedValues(bpMap, key) {\n for (let i = 0; i < this.activatedBreakpoints.length; i++) {\n /** @type {?} */\n const activatedBp = this.activatedBreakpoints[i];\n /** @type {?} */\n const valueMap = bpMap.get(activatedBp.alias);\n if (valueMap) {\n if (key === undefined || (valueMap.has(key) && valueMap.get(key) != null)) {\n return valueMap;\n }\n }\n }\n /** @type {?} */\n const lastHope = bpMap.get('');\n return (key === undefined || lastHope && lastHope.has(key)) ? lastHope : undefined;\n }\n /**\n * Watch for mediaQuery breakpoint activations\n * @private\n * @return {?}\n */\n observeActivations() {\n /** @type {?} */\n const target = (/** @type {?} */ ((/** @type {?} */ (this))));\n /** @type {?} */\n const queries = this.breakpoints.items.map((/**\n * @param {?} bp\n * @return {?}\n */\n bp => bp.mediaQuery));\n this.matchMedia\n .observe(this.hook.withPrintQuery(queries))\n .pipe(tap(this.hook.interceptEvents(target)), filter(this.hook.blockPropagation()))\n .subscribe(this.onMediaChange.bind(this));\n }\n}\nMediaMarshaller.ɵfac = function MediaMarshaller_Factory(t) { return new (t || MediaMarshaller)(ɵngcc0.ɵɵinject(MatchMedia), ɵngcc0.ɵɵinject(BreakPointRegistry), ɵngcc0.ɵɵinject(PrintHook)); };\n/** @nocollapse */ MediaMarshaller.ɵprov = ɵɵdefineInjectable({ factory: function MediaMarshaller_Factory() { return new MediaMarshaller(ɵɵinject(MatchMedia), ɵɵinject(BreakPointRegistry), ɵɵinject(PrintHook)); }, token: MediaMarshaller, providedIn: \"root\" });\n/** @nocollapse */\nMediaMarshaller.ctorParameters = () => [\n { type: MatchMedia },\n { type: BreakPointRegistry },\n { type: PrintHook }\n];\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(MediaMarshaller, [{\n type: Injectable,\n args: [{ providedIn: 'root' }]\n }], function () { return [{ type: MatchMedia }, { type: BreakPointRegistry }, { type: PrintHook }]; }, null); })();\n/**\n * @param {?} map\n * @param {?} element\n * @param {?} key\n * @param {?=} input\n * @return {?}\n */\nfunction initBuilderMap(map$$1, element, key, input) {\n if (input !== undefined) {\n /** @type {?} */\n let oldMap = map$$1.get(element);\n if (!oldMap) {\n oldMap = new Map();\n map$$1.set(element, oldMap);\n }\n oldMap.set(key, input);\n }\n}\n\n/**\n * @fileoverview added by tsickle\n * Generated from: core/public-api.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n\n/**\n * @fileoverview added by tsickle\n * Generated from: core/index.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n\nexport { MatchMedia as ɵMatchMedia, MockMatchMedia as ɵMockMatchMedia, MockMatchMediaProvider as ɵMockMatchMediaProvider, CoreModule, removeStyles, BROWSER_PROVIDER, CLASS_NAME, MediaChange, StylesheetMap, DEFAULT_CONFIG, LAYOUT_CONFIG, SERVER_TOKEN, BREAKPOINT, mergeAlias, BaseDirective2, DEFAULT_BREAKPOINTS, ScreenTypes, ORIENTATION_BREAKPOINTS, BreakPointRegistry, BREAKPOINTS, MediaObserver, MediaTrigger, sortDescendingPriority, sortAscendingPriority, coerceArray, StyleUtils, StyleBuilder, validateBasis, MediaMarshaller, BREAKPOINT_PRINT, PrintHook };\n\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\nimport { Directive, ElementRef, Inject, PLATFORM_ID, Injectable, Input, NgModule, IterableDiffers, KeyValueDiffers, Optional, Renderer2, Self, SecurityContext, ɵɵdefineInjectable } from '@angular/core';\nimport { isPlatformServer, NgClass, NgStyle } from '@angular/common';\nimport { MediaMarshaller, BaseDirective2, SERVER_TOKEN, StyleBuilder, StyleUtils, LAYOUT_CONFIG, CoreModule } from '@angular/flex-layout/core';\nimport { coerceBooleanProperty } from '@angular/cdk/coercion';\nimport { takeUntil } from 'rxjs/operators';\nimport { DomSanitizer } from '@angular/platform-browser';\n\n/**\n * @fileoverview added by tsickle\n * Generated from: extended/img-src/img-src.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\nimport * as ɵngcc0 from '@angular/core';\nimport * as ɵngcc1 from '@angular/flex-layout/core';\nimport * as ɵngcc2 from '@angular/common';\nimport * as ɵngcc3 from '@angular/platform-browser';\nclass ImgSrcStyleBuilder extends StyleBuilder {\n /**\n * @param {?} url\n * @return {?}\n */\n buildStyles(url) {\n return { 'content': url ? `url(${url})` : '' };\n }\n}\nImgSrcStyleBuilder.ɵfac = /*@__PURE__*/ function () { let ɵImgSrcStyleBuilder_BaseFactory; return function ImgSrcStyleBuilder_Factory(t) { return (ɵImgSrcStyleBuilder_BaseFactory || (ɵImgSrcStyleBuilder_BaseFactory = ɵngcc0.ɵɵgetInheritedFactory(ImgSrcStyleBuilder)))(t || ImgSrcStyleBuilder); }; }();\n/** @nocollapse */ ImgSrcStyleBuilder.ɵprov = ɵɵdefineInjectable({ factory: function ImgSrcStyleBuilder_Factory() { return new ImgSrcStyleBuilder(); }, token: ImgSrcStyleBuilder, providedIn: \"root\" });\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(ImgSrcStyleBuilder, [{\n type: Injectable,\n args: [{ providedIn: 'root' }]\n }], null, null); })();\nclass ImgSrcDirective extends BaseDirective2 {\n /**\n * @param {?} elementRef\n * @param {?} styleBuilder\n * @param {?} styler\n * @param {?} marshal\n * @param {?} platformId\n * @param {?} serverModuleLoaded\n */\n constructor(elementRef, styleBuilder, styler, marshal, platformId, serverModuleLoaded) {\n super(elementRef, styleBuilder, styler, marshal);\n this.platformId = platformId;\n this.serverModuleLoaded = serverModuleLoaded;\n this.DIRECTIVE_KEY = 'img-src';\n this.defaultSrc = '';\n this.styleCache = imgSrcCache;\n this.init();\n this.setValue(this.nativeElement.getAttribute('src') || '', '');\n if (isPlatformServer(this.platformId) && this.serverModuleLoaded) {\n this.nativeElement.setAttribute('src', '');\n }\n }\n /**\n * @param {?} val\n * @return {?}\n */\n set src(val) {\n this.defaultSrc = val;\n this.setValue(this.defaultSrc, '');\n }\n /**\n * Use the [responsively] activated input value to update\n * the host img src attribute or assign a default `img.src=''`\n * if the src has not been defined.\n *\n * Do nothing to standard `![](\"\")
` usages, only when responsive\n * keys are present do we actually call `setAttribute()`\n * @protected\n * @param {?=} value\n * @return {?}\n */\n updateWithValue(value) {\n /** @type {?} */\n const url = value || this.defaultSrc;\n if (isPlatformServer(this.platformId) && this.serverModuleLoaded) {\n this.addStyles(url);\n }\n else {\n this.nativeElement.setAttribute('src', url);\n }\n }\n}\nImgSrcDirective.ɵfac = function ImgSrcDirective_Factory(t) { return new (t || ImgSrcDirective)(ɵngcc0.ɵɵdirectiveInject(ɵngcc0.ElementRef), ɵngcc0.ɵɵdirectiveInject(ImgSrcStyleBuilder), ɵngcc0.ɵɵdirectiveInject(ɵngcc1.StyleUtils), ɵngcc0.ɵɵdirectiveInject(ɵngcc1.MediaMarshaller), ɵngcc0.ɵɵdirectiveInject(PLATFORM_ID), ɵngcc0.ɵɵdirectiveInject(SERVER_TOKEN)); };\nImgSrcDirective.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: ImgSrcDirective, inputs: { src: \"src\" }, features: [ɵngcc0.ɵɵInheritDefinitionFeature] });\n/** @nocollapse */\nImgSrcDirective.ctorParameters = () => [\n { type: ElementRef },\n { type: ImgSrcStyleBuilder },\n { type: StyleUtils },\n { type: MediaMarshaller },\n { type: Object, decorators: [{ type: Inject, args: [PLATFORM_ID,] }] },\n { type: Boolean, decorators: [{ type: Inject, args: [SERVER_TOKEN,] }] }\n];\nImgSrcDirective.propDecorators = {\n src: [{ type: Input, args: ['src',] }]\n};\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(ImgSrcDirective, [{\n type: Directive\n }], function () { return [{ type: ɵngcc0.ElementRef }, { type: ImgSrcStyleBuilder }, { type: ɵngcc1.StyleUtils }, { type: ɵngcc1.MediaMarshaller }, { type: Object, decorators: [{\n type: Inject,\n args: [PLATFORM_ID]\n }] }, { type: Boolean, decorators: [{\n type: Inject,\n args: [SERVER_TOKEN]\n }] }]; }, { src: [{\n type: Input,\n args: ['src']\n }] }); })();\n/** @type {?} */\nconst imgSrcCache = new Map();\n/** @type {?} */\nconst inputs = [\n 'src.xs', 'src.sm', 'src.md', 'src.lg', 'src.xl',\n 'src.lt-sm', 'src.lt-md', 'src.lt-lg', 'src.lt-xl',\n 'src.gt-xs', 'src.gt-sm', 'src.gt-md', 'src.gt-lg'\n];\n/** @type {?} */\nconst selector = `\n img[src.xs], img[src.sm], img[src.md], img[src.lg], img[src.xl],\n img[src.lt-sm], img[src.lt-md], img[src.lt-lg], img[src.lt-xl],\n img[src.gt-xs], img[src.gt-sm], img[src.gt-md], img[src.gt-lg]\n`;\n/**\n * This directive provides a responsive API for the HTML ![]()
'src' attribute\n * and will update the img.src property upon each responsive activation.\n *\n * e.g.\n * ![](\"defaultScene.jpg\")
\n *\n * @see https://css-tricks.com/responsive-images-youre-just-changing-resolutions-use-src/\n */\nclass DefaultImgSrcDirective extends ImgSrcDirective {\n constructor() {\n super(...arguments);\n this.inputs = inputs;\n }\n}\nDefaultImgSrcDirective.ɵfac = /*@__PURE__*/ function () { let ɵDefaultImgSrcDirective_BaseFactory; return function DefaultImgSrcDirective_Factory(t) { return (ɵDefaultImgSrcDirective_BaseFactory || (ɵDefaultImgSrcDirective_BaseFactory = ɵngcc0.ɵɵgetInheritedFactory(DefaultImgSrcDirective)))(t || DefaultImgSrcDirective); }; }();\nDefaultImgSrcDirective.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: DefaultImgSrcDirective, selectors: [[\"img\", \"src.xs\", \"\"], [\"img\", \"src.sm\", \"\"], [\"img\", \"src.md\", \"\"], [\"img\", \"src.lg\", \"\"], [\"img\", \"src.xl\", \"\"], [\"img\", \"src.lt-sm\", \"\"], [\"img\", \"src.lt-md\", \"\"], [\"img\", \"src.lt-lg\", \"\"], [\"img\", \"src.lt-xl\", \"\"], [\"img\", \"src.gt-xs\", \"\"], [\"img\", \"src.gt-sm\", \"\"], [\"img\", \"src.gt-md\", \"\"], [\"img\", \"src.gt-lg\", \"\"]], inputs: { \"src.xs\": \"src.xs\", \"src.sm\": \"src.sm\", \"src.md\": \"src.md\", \"src.lg\": \"src.lg\", \"src.xl\": \"src.xl\", \"src.lt-sm\": \"src.lt-sm\", \"src.lt-md\": \"src.lt-md\", \"src.lt-lg\": \"src.lt-lg\", \"src.lt-xl\": \"src.lt-xl\", \"src.gt-xs\": \"src.gt-xs\", \"src.gt-sm\": \"src.gt-sm\", \"src.gt-md\": \"src.gt-md\", \"src.gt-lg\": \"src.gt-lg\" }, features: [ɵngcc0.ɵɵInheritDefinitionFeature] });\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(DefaultImgSrcDirective, [{\n type: Directive,\n args: [{ selector, inputs }]\n }], null, null); })();\n\n/**\n * @fileoverview added by tsickle\n * Generated from: extended/class/class.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\nclass ClassDirective extends BaseDirective2 {\n /**\n * @param {?} elementRef\n * @param {?} styler\n * @param {?} marshal\n * @param {?} iterableDiffers\n * @param {?} keyValueDiffers\n * @param {?} renderer2\n * @param {?} ngClassInstance\n */\n constructor(elementRef, styler, marshal, iterableDiffers, keyValueDiffers, renderer2, ngClassInstance) {\n super(elementRef, (/** @type {?} */ (null)), styler, marshal);\n this.ngClassInstance = ngClassInstance;\n this.DIRECTIVE_KEY = 'ngClass';\n if (!this.ngClassInstance) {\n // Create an instance NgClass Directive instance only if `ngClass=\"\"` has NOT been defined on\n // the same host element; since the responsive variations may be defined...\n this.ngClassInstance = new NgClass(iterableDiffers, keyValueDiffers, elementRef, renderer2);\n }\n this.init();\n this.setValue('', '');\n }\n /**\n * Capture class assignments so we cache the default classes\n * which are merged with activated styles and used as fallbacks.\n * @param {?} val\n * @return {?}\n */\n set klass(val) {\n this.ngClassInstance.klass = val;\n this.setValue(val, '');\n }\n /**\n * @protected\n * @param {?} value\n * @return {?}\n */\n updateWithValue(value) {\n this.ngClassInstance.ngClass = value;\n this.ngClassInstance.ngDoCheck();\n }\n // ******************************************************************\n // Lifecycle Hooks\n // ******************************************************************\n /**\n * For ChangeDetectionStrategy.onPush and ngOnChanges() updates\n * @return {?}\n */\n ngDoCheck() {\n this.ngClassInstance.ngDoCheck();\n }\n}\nClassDirective.ɵfac = function ClassDirective_Factory(t) { return new (t || ClassDirective)(ɵngcc0.ɵɵdirectiveInject(ɵngcc0.ElementRef), ɵngcc0.ɵɵdirectiveInject(ɵngcc1.StyleUtils), ɵngcc0.ɵɵdirectiveInject(ɵngcc1.MediaMarshaller), ɵngcc0.ɵɵdirectiveInject(ɵngcc0.IterableDiffers), ɵngcc0.ɵɵdirectiveInject(ɵngcc0.KeyValueDiffers), ɵngcc0.ɵɵdirectiveInject(ɵngcc0.Renderer2), ɵngcc0.ɵɵdirectiveInject(ɵngcc2.NgClass, 10)); };\nClassDirective.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: ClassDirective, inputs: { klass: [\"class\", \"klass\"] }, features: [ɵngcc0.ɵɵInheritDefinitionFeature] });\n/** @nocollapse */\nClassDirective.ctorParameters = () => [\n { type: ElementRef },\n { type: StyleUtils },\n { type: MediaMarshaller },\n { type: IterableDiffers },\n { type: KeyValueDiffers },\n { type: Renderer2 },\n { type: NgClass, decorators: [{ type: Optional }, { type: Self }] }\n];\nClassDirective.propDecorators = {\n klass: [{ type: Input, args: ['class',] }]\n};\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(ClassDirective, [{\n type: Directive\n }], function () { return [{ type: ɵngcc0.ElementRef }, { type: ɵngcc1.StyleUtils }, { type: ɵngcc1.MediaMarshaller }, { type: ɵngcc0.IterableDiffers }, { type: ɵngcc0.KeyValueDiffers }, { type: ɵngcc0.Renderer2 }, { type: ɵngcc2.NgClass, decorators: [{\n type: Optional\n }, {\n type: Self\n }] }]; }, { klass: [{\n type: Input,\n args: ['class']\n }] }); })();\n/** @type {?} */\nconst inputs$1 = [\n 'ngClass', 'ngClass.xs', 'ngClass.sm', 'ngClass.md', 'ngClass.lg', 'ngClass.xl',\n 'ngClass.lt-sm', 'ngClass.lt-md', 'ngClass.lt-lg', 'ngClass.lt-xl',\n 'ngClass.gt-xs', 'ngClass.gt-sm', 'ngClass.gt-md', 'ngClass.gt-lg'\n];\n/** @type {?} */\nconst selector$1 = `\n [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl],\n [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl],\n [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]\n`;\n/**\n * Directive to add responsive support for ngClass.\n * This maintains the core functionality of 'ngClass' and adds responsive API\n * Note: this class is a no-op when rendered on the server\n */\nclass DefaultClassDirective extends ClassDirective {\n constructor() {\n super(...arguments);\n this.inputs = inputs$1;\n }\n}\nDefaultClassDirective.ɵfac = /*@__PURE__*/ function () { let ɵDefaultClassDirective_BaseFactory; return function DefaultClassDirective_Factory(t) { return (ɵDefaultClassDirective_BaseFactory || (ɵDefaultClassDirective_BaseFactory = ɵngcc0.ɵɵgetInheritedFactory(DefaultClassDirective)))(t || DefaultClassDirective); }; }();\nDefaultClassDirective.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: DefaultClassDirective, selectors: [[\"\", \"ngClass\", \"\"], [\"\", \"ngClass.xs\", \"\"], [\"\", \"ngClass.sm\", \"\"], [\"\", \"ngClass.md\", \"\"], [\"\", \"ngClass.lg\", \"\"], [\"\", \"ngClass.xl\", \"\"], [\"\", \"ngClass.lt-sm\", \"\"], [\"\", \"ngClass.lt-md\", \"\"], [\"\", \"ngClass.lt-lg\", \"\"], [\"\", \"ngClass.lt-xl\", \"\"], [\"\", \"ngClass.gt-xs\", \"\"], [\"\", \"ngClass.gt-sm\", \"\"], [\"\", \"ngClass.gt-md\", \"\"], [\"\", \"ngClass.gt-lg\", \"\"]], inputs: { ngClass: \"ngClass\", \"ngClass.xs\": \"ngClass.xs\", \"ngClass.sm\": \"ngClass.sm\", \"ngClass.md\": \"ngClass.md\", \"ngClass.lg\": \"ngClass.lg\", \"ngClass.xl\": \"ngClass.xl\", \"ngClass.lt-sm\": \"ngClass.lt-sm\", \"ngClass.lt-md\": \"ngClass.lt-md\", \"ngClass.lt-lg\": \"ngClass.lt-lg\", \"ngClass.lt-xl\": \"ngClass.lt-xl\", \"ngClass.gt-xs\": \"ngClass.gt-xs\", \"ngClass.gt-sm\": \"ngClass.gt-sm\", \"ngClass.gt-md\": \"ngClass.gt-md\", \"ngClass.gt-lg\": \"ngClass.gt-lg\" }, features: [ɵngcc0.ɵɵInheritDefinitionFeature] });\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(DefaultClassDirective, [{\n type: Directive,\n args: [{ selector: selector$1, inputs: inputs$1 }]\n }], null, null); })();\n\n/**\n * @fileoverview added by tsickle\n * Generated from: extended/show-hide/show-hide.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\nclass ShowHideStyleBuilder extends StyleBuilder {\n /**\n * @param {?} show\n * @param {?} parent\n * @return {?}\n */\n buildStyles(show, parent) {\n /** @type {?} */\n const shouldShow = show === 'true';\n return { 'display': shouldShow ? parent.display || (parent.isServer ? 'initial' : '') : 'none' };\n }\n}\nShowHideStyleBuilder.ɵfac = /*@__PURE__*/ function () { let ɵShowHideStyleBuilder_BaseFactory; return function ShowHideStyleBuilder_Factory(t) { return (ɵShowHideStyleBuilder_BaseFactory || (ɵShowHideStyleBuilder_BaseFactory = ɵngcc0.ɵɵgetInheritedFactory(ShowHideStyleBuilder)))(t || ShowHideStyleBuilder); }; }();\n/** @nocollapse */ ShowHideStyleBuilder.ɵprov = ɵɵdefineInjectable({ factory: function ShowHideStyleBuilder_Factory() { return new ShowHideStyleBuilder(); }, token: ShowHideStyleBuilder, providedIn: \"root\" });\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(ShowHideStyleBuilder, [{\n type: Injectable,\n args: [{ providedIn: 'root' }]\n }], null, null); })();\nclass ShowHideDirective extends BaseDirective2 {\n /**\n * @param {?} elementRef\n * @param {?} styleBuilder\n * @param {?} styler\n * @param {?} marshal\n * @param {?} layoutConfig\n * @param {?} platformId\n * @param {?} serverModuleLoaded\n */\n constructor(elementRef, styleBuilder, styler, marshal, layoutConfig, platformId, serverModuleLoaded) {\n super(elementRef, styleBuilder, styler, marshal);\n this.layoutConfig = layoutConfig;\n this.platformId = platformId;\n this.serverModuleLoaded = serverModuleLoaded;\n this.DIRECTIVE_KEY = 'show-hide';\n /**\n * Original DOM Element CSS display style\n */\n this.display = '';\n this.hasLayout = false;\n this.hasFlexChild = false;\n }\n // *********************************************\n // Lifecycle Methods\n // *********************************************\n /**\n * @return {?}\n */\n ngAfterViewInit() {\n this.trackExtraTriggers();\n /** @type {?} */\n const children = Array.from(this.nativeElement.children);\n for (let i = 0; i < children.length; i++) {\n if (this.marshal.hasValue((/** @type {?} */ (children[i])), 'flex')) {\n this.hasFlexChild = true;\n break;\n }\n }\n if (DISPLAY_MAP.has(this.nativeElement)) {\n this.display = (/** @type {?} */ (DISPLAY_MAP.get(this.nativeElement)));\n }\n else {\n this.display = this.getDisplayStyle();\n DISPLAY_MAP.set(this.nativeElement, this.display);\n }\n this.init();\n // set the default to show unless explicitly overridden\n /** @type {?} */\n const defaultValue = this.marshal.getValue(this.nativeElement, this.DIRECTIVE_KEY, '');\n if (defaultValue === undefined || defaultValue === '') {\n this.setValue(true, '');\n }\n else {\n this.triggerUpdate();\n }\n }\n /**\n * On changes to any \\@Input properties...\n * Default to use the non-responsive Input value ('fxShow')\n * Then conditionally override with the mq-activated Input's current value\n * @param {?} changes\n * @return {?}\n */\n ngOnChanges(changes) {\n Object.keys(changes).forEach((/**\n * @param {?} key\n * @return {?}\n */\n key => {\n if (this.inputs.indexOf(key) !== -1) {\n /** @type {?} */\n const inputKey = key.split('.');\n /** @type {?} */\n const bp = inputKey.slice(1).join('.');\n /** @type {?} */\n const inputValue = changes[key].currentValue;\n /** @type {?} */\n let shouldShow = inputValue !== '' ?\n inputValue !== 0 ? coerceBooleanProperty(inputValue) : false\n : true;\n if (inputKey[0] === 'fxHide') {\n shouldShow = !shouldShow;\n }\n this.setValue(shouldShow, bp);\n }\n }));\n }\n // *********************************************\n // Protected methods\n // *********************************************\n /**\n * Watch for these extra triggers to update fxShow, fxHide stylings\n * @protected\n * @return {?}\n */\n trackExtraTriggers() {\n this.hasLayout = this.marshal.hasValue(this.nativeElement, 'layout');\n ['layout', 'layout-align'].forEach((/**\n * @param {?} key\n * @return {?}\n */\n key => {\n this.marshal\n .trackValue(this.nativeElement, key)\n .pipe(takeUntil(this.destroySubject))\n .subscribe(this.triggerUpdate.bind(this));\n }));\n }\n /**\n * Override accessor to the current HTMLElement's `display` style\n * Note: Show/Hide will not change the display to 'flex' but will set it to 'block'\n * unless it was already explicitly specified inline or in a CSS stylesheet.\n * @protected\n * @return {?}\n */\n getDisplayStyle() {\n return (this.hasLayout || (this.hasFlexChild && this.layoutConfig.addFlexToParent)) ?\n 'flex' : this.styler.lookupStyle(this.nativeElement, 'display', true);\n }\n /**\n * Validate the visibility value and then update the host's inline display style\n * @protected\n * @param {?=} value\n * @return {?}\n */\n updateWithValue(value = true) {\n if (value === '') {\n return;\n }\n /** @type {?} */\n const isServer = isPlatformServer(this.platformId);\n this.addStyles(value ? 'true' : 'false', { display: this.display, isServer });\n if (isServer && this.serverModuleLoaded) {\n this.nativeElement.style.setProperty('display', '');\n }\n this.marshal.triggerUpdate((/** @type {?} */ (this.parentElement)), 'layout-gap');\n }\n}\nShowHideDirective.ɵfac = function ShowHideDirective_Factory(t) { return new (t || ShowHideDirective)(ɵngcc0.ɵɵdirectiveInject(ɵngcc0.ElementRef), ɵngcc0.ɵɵdirectiveInject(ShowHideStyleBuilder), ɵngcc0.ɵɵdirectiveInject(ɵngcc1.StyleUtils), ɵngcc0.ɵɵdirectiveInject(ɵngcc1.MediaMarshaller), ɵngcc0.ɵɵdirectiveInject(LAYOUT_CONFIG), ɵngcc0.ɵɵdirectiveInject(PLATFORM_ID), ɵngcc0.ɵɵdirectiveInject(SERVER_TOKEN)); };\nShowHideDirective.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: ShowHideDirective, features: [ɵngcc0.ɵɵInheritDefinitionFeature, ɵngcc0.ɵɵNgOnChangesFeature] });\n/** @nocollapse */\nShowHideDirective.ctorParameters = () => [\n { type: ElementRef },\n { type: ShowHideStyleBuilder },\n { type: StyleUtils },\n { type: MediaMarshaller },\n { type: undefined, decorators: [{ type: Inject, args: [LAYOUT_CONFIG,] }] },\n { type: Object, decorators: [{ type: Inject, args: [PLATFORM_ID,] }] },\n { type: Boolean, decorators: [{ type: Inject, args: [SERVER_TOKEN,] }] }\n];\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(ShowHideDirective, [{\n type: Directive\n }], function () { return [{ type: ɵngcc0.ElementRef }, { type: ShowHideStyleBuilder }, { type: ɵngcc1.StyleUtils }, { type: ɵngcc1.MediaMarshaller }, { type: undefined, decorators: [{\n type: Inject,\n args: [LAYOUT_CONFIG]\n }] }, { type: Object, decorators: [{\n type: Inject,\n args: [PLATFORM_ID]\n }] }, { type: Boolean, decorators: [{\n type: Inject,\n args: [SERVER_TOKEN]\n }] }]; }, null); })();\n/** @type {?} */\nconst DISPLAY_MAP = new WeakMap();\n/** @type {?} */\nconst inputs$2 = [\n 'fxShow', 'fxShow.print',\n 'fxShow.xs', 'fxShow.sm', 'fxShow.md', 'fxShow.lg', 'fxShow.xl',\n 'fxShow.lt-sm', 'fxShow.lt-md', 'fxShow.lt-lg', 'fxShow.lt-xl',\n 'fxShow.gt-xs', 'fxShow.gt-sm', 'fxShow.gt-md', 'fxShow.gt-lg',\n 'fxHide', 'fxHide.print',\n 'fxHide.xs', 'fxHide.sm', 'fxHide.md', 'fxHide.lg', 'fxHide.xl',\n 'fxHide.lt-sm', 'fxHide.lt-md', 'fxHide.lt-lg', 'fxHide.lt-xl',\n 'fxHide.gt-xs', 'fxHide.gt-sm', 'fxHide.gt-md', 'fxHide.gt-lg'\n];\n/** @type {?} */\nconst selector$2 = `\n [fxShow], [fxShow.print],\n [fxShow.xs], [fxShow.sm], [fxShow.md], [fxShow.lg], [fxShow.xl],\n [fxShow.lt-sm], [fxShow.lt-md], [fxShow.lt-lg], [fxShow.lt-xl],\n [fxShow.gt-xs], [fxShow.gt-sm], [fxShow.gt-md], [fxShow.gt-lg],\n [fxHide], [fxHide.print],\n [fxHide.xs], [fxHide.sm], [fxHide.md], [fxHide.lg], [fxHide.xl],\n [fxHide.lt-sm], [fxHide.lt-md], [fxHide.lt-lg], [fxHide.lt-xl],\n [fxHide.gt-xs], [fxHide.gt-sm], [fxHide.gt-md], [fxHide.gt-lg]\n`;\n/**\n * 'show' Layout API directive\n */\nclass DefaultShowHideDirective extends ShowHideDirective {\n constructor() {\n super(...arguments);\n this.inputs = inputs$2;\n }\n}\nDefaultShowHideDirective.ɵfac = /*@__PURE__*/ function () { let ɵDefaultShowHideDirective_BaseFactory; return function DefaultShowHideDirective_Factory(t) { return (ɵDefaultShowHideDirective_BaseFactory || (ɵDefaultShowHideDirective_BaseFactory = ɵngcc0.ɵɵgetInheritedFactory(DefaultShowHideDirective)))(t || DefaultShowHideDirective); }; }();\nDefaultShowHideDirective.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: DefaultShowHideDirective, selectors: [[\"\", \"fxShow\", \"\"], [\"\", \"fxShow.print\", \"\"], [\"\", \"fxShow.xs\", \"\"], [\"\", \"fxShow.sm\", \"\"], [\"\", \"fxShow.md\", \"\"], [\"\", \"fxShow.lg\", \"\"], [\"\", \"fxShow.xl\", \"\"], [\"\", \"fxShow.lt-sm\", \"\"], [\"\", \"fxShow.lt-md\", \"\"], [\"\", \"fxShow.lt-lg\", \"\"], [\"\", \"fxShow.lt-xl\", \"\"], [\"\", \"fxShow.gt-xs\", \"\"], [\"\", \"fxShow.gt-sm\", \"\"], [\"\", \"fxShow.gt-md\", \"\"], [\"\", \"fxShow.gt-lg\", \"\"], [\"\", \"fxHide\", \"\"], [\"\", \"fxHide.print\", \"\"], [\"\", \"fxHide.xs\", \"\"], [\"\", \"fxHide.sm\", \"\"], [\"\", \"fxHide.md\", \"\"], [\"\", \"fxHide.lg\", \"\"], [\"\", \"fxHide.xl\", \"\"], [\"\", \"fxHide.lt-sm\", \"\"], [\"\", \"fxHide.lt-md\", \"\"], [\"\", \"fxHide.lt-lg\", \"\"], [\"\", \"fxHide.lt-xl\", \"\"], [\"\", \"fxHide.gt-xs\", \"\"], [\"\", \"fxHide.gt-sm\", \"\"], [\"\", \"fxHide.gt-md\", \"\"], [\"\", \"fxHide.gt-lg\", \"\"]], inputs: { fxShow: \"fxShow\", \"fxShow.print\": \"fxShow.print\", \"fxShow.xs\": \"fxShow.xs\", \"fxShow.sm\": \"fxShow.sm\", \"fxShow.md\": \"fxShow.md\", \"fxShow.lg\": \"fxShow.lg\", \"fxShow.xl\": \"fxShow.xl\", \"fxShow.lt-sm\": \"fxShow.lt-sm\", \"fxShow.lt-md\": \"fxShow.lt-md\", \"fxShow.lt-lg\": \"fxShow.lt-lg\", \"fxShow.lt-xl\": \"fxShow.lt-xl\", \"fxShow.gt-xs\": \"fxShow.gt-xs\", \"fxShow.gt-sm\": \"fxShow.gt-sm\", \"fxShow.gt-md\": \"fxShow.gt-md\", \"fxShow.gt-lg\": \"fxShow.gt-lg\", fxHide: \"fxHide\", \"fxHide.print\": \"fxHide.print\", \"fxHide.xs\": \"fxHide.xs\", \"fxHide.sm\": \"fxHide.sm\", \"fxHide.md\": \"fxHide.md\", \"fxHide.lg\": \"fxHide.lg\", \"fxHide.xl\": \"fxHide.xl\", \"fxHide.lt-sm\": \"fxHide.lt-sm\", \"fxHide.lt-md\": \"fxHide.lt-md\", \"fxHide.lt-lg\": \"fxHide.lt-lg\", \"fxHide.lt-xl\": \"fxHide.lt-xl\", \"fxHide.gt-xs\": \"fxHide.gt-xs\", \"fxHide.gt-sm\": \"fxHide.gt-sm\", \"fxHide.gt-md\": \"fxHide.gt-md\", \"fxHide.gt-lg\": \"fxHide.gt-lg\" }, features: [ɵngcc0.ɵɵInheritDefinitionFeature] });\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(DefaultShowHideDirective, [{\n type: Directive,\n args: [{ selector: selector$2, inputs: inputs$2 }]\n }], null, null); })();\n\n/**\n * @fileoverview added by tsickle\n * Generated from: extended/style/style-transforms.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n\n/**\n * NgStyle allowed inputs\n */\nclass NgStyleKeyValue {\n /**\n * @param {?} key\n * @param {?} value\n * @param {?=} noQuotes\n */\n constructor(key, value, noQuotes = true) {\n this.key = key;\n this.value = value;\n this.key = noQuotes ? key.replace(/['\"]/g, '').trim() : key.trim();\n this.value = noQuotes ? value.replace(/['\"]/g, '').trim() : value.trim();\n this.value = this.value.replace(/;/, '');\n }\n}\n/**\n * @param {?} target\n * @return {?}\n */\nfunction getType(target) {\n /** @type {?} */\n let what = typeof target;\n if (what === 'object') {\n return (target.constructor === Array) ? 'array' :\n (target.constructor === Set) ? 'set' : 'object';\n }\n return what;\n}\n/**\n * Split string of key:value pairs into Array of k-v pairs\n * e.g. 'key:value; key:value; key:value;' -> ['key:value',...]\n * @param {?} source\n * @param {?=} delimiter\n * @return {?}\n */\nfunction buildRawList(source, delimiter = ';') {\n return String(source)\n .trim()\n .split(delimiter)\n .map((/**\n * @param {?} val\n * @return {?}\n */\n (val) => val.trim()))\n .filter((/**\n * @param {?} val\n * @return {?}\n */\n val => val !== ''));\n}\n/**\n * Convert array of key:value strings to a iterable map object\n * @param {?} styles\n * @param {?=} sanitize\n * @return {?}\n */\nfunction buildMapFromList(styles, sanitize) {\n /** @type {?} */\n const sanitizeValue = (/**\n * @param {?} it\n * @return {?}\n */\n (it) => {\n if (sanitize) {\n it.value = sanitize(it.value);\n }\n return it;\n });\n return styles\n .map(stringToKeyValue)\n .filter((/**\n * @param {?} entry\n * @return {?}\n */\n entry => !!entry))\n .map(sanitizeValue)\n .reduce(keyValuesToMap, (/** @type {?} */ ({})));\n}\n/**\n * Convert Set or raw Object to an iterable NgStyleMap\n * @param {?} source\n * @param {?=} sanitize\n * @return {?}\n */\nfunction buildMapFromSet(source, sanitize) {\n /** @type {?} */\n let list = [];\n if (getType(source) === 'set') {\n ((/** @type {?} */ (source))).forEach((/**\n * @param {?} entry\n * @return {?}\n */\n entry => list.push(entry)));\n }\n else {\n Object.keys(source).forEach((/**\n * @param {?} key\n * @return {?}\n */\n (key) => {\n list.push(`${key}:${((/** @type {?} */ (source)))[key]}`);\n }));\n }\n return buildMapFromList(list, sanitize);\n}\n/**\n * Convert 'key:value' -> [key, value]\n * @param {?} it\n * @return {?}\n */\nfunction stringToKeyValue(it) {\n const [key, ...vals] = it.split(':');\n return new NgStyleKeyValue(key, vals.join(':'));\n}\n/**\n * Convert [ [key,value] ] -> { key : value }\n * @param {?} map\n * @param {?} entry\n * @return {?}\n */\nfunction keyValuesToMap(map, entry) {\n if (!!entry.key) {\n map[entry.key] = entry.value;\n }\n return map;\n}\n\n/**\n * @fileoverview added by tsickle\n * Generated from: extended/style/style.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\nclass StyleDirective extends BaseDirective2 {\n /**\n * @param {?} elementRef\n * @param {?} styler\n * @param {?} marshal\n * @param {?} sanitizer\n * @param {?} differs\n * @param {?} renderer2\n * @param {?} ngStyleInstance\n * @param {?} serverLoaded\n * @param {?} platformId\n */\n constructor(elementRef, styler, marshal, sanitizer, differs, renderer2, ngStyleInstance, serverLoaded, platformId) {\n super(elementRef, (/** @type {?} */ (null)), styler, marshal);\n this.sanitizer = sanitizer;\n this.ngStyleInstance = ngStyleInstance;\n this.DIRECTIVE_KEY = 'ngStyle';\n if (!this.ngStyleInstance) {\n // Create an instance NgStyle Directive instance only if `ngStyle=\"\"` has NOT been\n // defined on the same host element; since the responsive variations may be defined...\n this.ngStyleInstance = new NgStyle(elementRef, differs, renderer2);\n }\n this.init();\n /** @type {?} */\n const styles = this.nativeElement.getAttribute('style') || '';\n this.fallbackStyles = this.buildStyleMap(styles);\n this.isServer = serverLoaded && isPlatformServer(platformId);\n }\n /**\n * Add generated styles\n * @protected\n * @param {?} value\n * @return {?}\n */\n updateWithValue(value) {\n /** @type {?} */\n const styles = this.buildStyleMap(value);\n this.ngStyleInstance.ngStyle = Object.assign(Object.assign({}, this.fallbackStyles), styles);\n if (this.isServer) {\n this.applyStyleToElement(styles);\n }\n this.ngStyleInstance.ngDoCheck();\n }\n /**\n * Remove generated styles\n * @protected\n * @return {?}\n */\n clearStyles() {\n this.ngStyleInstance.ngStyle = this.fallbackStyles;\n this.ngStyleInstance.ngDoCheck();\n }\n /**\n * Convert raw strings to ngStyleMap; which is required by ngStyle\n * NOTE: Raw string key-value pairs MUST be delimited by `;`\n * Comma-delimiters are not supported due to complexities of\n * possible style values such as `rgba(x,x,x,x)` and others\n * @protected\n * @param {?} styles\n * @return {?}\n */\n buildStyleMap(styles) {\n // Always safe-guard (aka sanitize) style property values\n /** @type {?} */\n const sanitizer = (/**\n * @param {?} val\n * @return {?}\n */\n (val) => this.sanitizer.sanitize(SecurityContext.STYLE, val) || '');\n if (styles) {\n switch (getType(styles)) {\n case 'string': return buildMapFromList$1(buildRawList(styles), sanitizer);\n case 'array': return buildMapFromList$1((/** @type {?} */ (styles)), sanitizer);\n case 'set': return buildMapFromSet(styles, sanitizer);\n default: return buildMapFromSet(styles, sanitizer);\n }\n }\n return {};\n }\n // ******************************************************************\n // Lifecycle Hooks\n // ******************************************************************\n /**\n * For ChangeDetectionStrategy.onPush and ngOnChanges() updates\n * @return {?}\n */\n ngDoCheck() {\n this.ngStyleInstance.ngDoCheck();\n }\n}\nStyleDirective.ɵfac = function StyleDirective_Factory(t) { return new (t || StyleDirective)(ɵngcc0.ɵɵdirectiveInject(ɵngcc0.ElementRef), ɵngcc0.ɵɵdirectiveInject(ɵngcc1.StyleUtils), ɵngcc0.ɵɵdirectiveInject(ɵngcc1.MediaMarshaller), ɵngcc0.ɵɵdirectiveInject(ɵngcc3.DomSanitizer), ɵngcc0.ɵɵdirectiveInject(ɵngcc0.KeyValueDiffers), ɵngcc0.ɵɵdirectiveInject(ɵngcc0.Renderer2), ɵngcc0.ɵɵdirectiveInject(ɵngcc2.NgStyle, 10), ɵngcc0.ɵɵdirectiveInject(SERVER_TOKEN), ɵngcc0.ɵɵdirectiveInject(PLATFORM_ID)); };\nStyleDirective.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: StyleDirective, features: [ɵngcc0.ɵɵInheritDefinitionFeature] });\n/** @nocollapse */\nStyleDirective.ctorParameters = () => [\n { type: ElementRef },\n { type: StyleUtils },\n { type: MediaMarshaller },\n { type: DomSanitizer },\n { type: KeyValueDiffers },\n { type: Renderer2 },\n { type: NgStyle, decorators: [{ type: Optional }, { type: Self }] },\n { type: Boolean, decorators: [{ type: Inject, args: [SERVER_TOKEN,] }] },\n { type: Object, decorators: [{ type: Inject, args: [PLATFORM_ID,] }] }\n];\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(StyleDirective, [{\n type: Directive\n }], function () { return [{ type: ɵngcc0.ElementRef }, { type: ɵngcc1.StyleUtils }, { type: ɵngcc1.MediaMarshaller }, { type: ɵngcc3.DomSanitizer }, { type: ɵngcc0.KeyValueDiffers }, { type: ɵngcc0.Renderer2 }, { type: ɵngcc2.NgStyle, decorators: [{\n type: Optional\n }, {\n type: Self\n }] }, { type: Boolean, decorators: [{\n type: Inject,\n args: [SERVER_TOKEN]\n }] }, { type: Object, decorators: [{\n type: Inject,\n args: [PLATFORM_ID]\n }] }]; }, null); })();\n/** @type {?} */\nconst inputs$3 = [\n 'ngStyle',\n 'ngStyle.xs', 'ngStyle.sm', 'ngStyle.md', 'ngStyle.lg', 'ngStyle.xl',\n 'ngStyle.lt-sm', 'ngStyle.lt-md', 'ngStyle.lt-lg', 'ngStyle.lt-xl',\n 'ngStyle.gt-xs', 'ngStyle.gt-sm', 'ngStyle.gt-md', 'ngStyle.gt-lg'\n];\n/** @type {?} */\nconst selector$3 = `\n [ngStyle],\n [ngStyle.xs], [ngStyle.sm], [ngStyle.md], [ngStyle.lg], [ngStyle.xl],\n [ngStyle.lt-sm], [ngStyle.lt-md], [ngStyle.lt-lg], [ngStyle.lt-xl],\n [ngStyle.gt-xs], [ngStyle.gt-sm], [ngStyle.gt-md], [ngStyle.gt-lg]\n`;\n/**\n * Directive to add responsive support for ngStyle.\n *\n */\nclass DefaultStyleDirective extends StyleDirective {\n constructor() {\n super(...arguments);\n this.inputs = inputs$3;\n }\n}\nDefaultStyleDirective.ɵfac = /*@__PURE__*/ function () { let ɵDefaultStyleDirective_BaseFactory; return function DefaultStyleDirective_Factory(t) { return (ɵDefaultStyleDirective_BaseFactory || (ɵDefaultStyleDirective_BaseFactory = ɵngcc0.ɵɵgetInheritedFactory(DefaultStyleDirective)))(t || DefaultStyleDirective); }; }();\nDefaultStyleDirective.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: DefaultStyleDirective, selectors: [[\"\", \"ngStyle\", \"\"], [\"\", \"ngStyle.xs\", \"\"], [\"\", \"ngStyle.sm\", \"\"], [\"\", \"ngStyle.md\", \"\"], [\"\", \"ngStyle.lg\", \"\"], [\"\", \"ngStyle.xl\", \"\"], [\"\", \"ngStyle.lt-sm\", \"\"], [\"\", \"ngStyle.lt-md\", \"\"], [\"\", \"ngStyle.lt-lg\", \"\"], [\"\", \"ngStyle.lt-xl\", \"\"], [\"\", \"ngStyle.gt-xs\", \"\"], [\"\", \"ngStyle.gt-sm\", \"\"], [\"\", \"ngStyle.gt-md\", \"\"], [\"\", \"ngStyle.gt-lg\", \"\"]], inputs: { ngStyle: \"ngStyle\", \"ngStyle.xs\": \"ngStyle.xs\", \"ngStyle.sm\": \"ngStyle.sm\", \"ngStyle.md\": \"ngStyle.md\", \"ngStyle.lg\": \"ngStyle.lg\", \"ngStyle.xl\": \"ngStyle.xl\", \"ngStyle.lt-sm\": \"ngStyle.lt-sm\", \"ngStyle.lt-md\": \"ngStyle.lt-md\", \"ngStyle.lt-lg\": \"ngStyle.lt-lg\", \"ngStyle.lt-xl\": \"ngStyle.lt-xl\", \"ngStyle.gt-xs\": \"ngStyle.gt-xs\", \"ngStyle.gt-sm\": \"ngStyle.gt-sm\", \"ngStyle.gt-md\": \"ngStyle.gt-md\", \"ngStyle.gt-lg\": \"ngStyle.gt-lg\" }, features: [ɵngcc0.ɵɵInheritDefinitionFeature] });\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(DefaultStyleDirective, [{\n type: Directive,\n args: [{ selector: selector$3, inputs: inputs$3 }]\n }], null, null); })();\n/**\n * Build a styles map from a list of styles, while sanitizing bad values first\n * @param {?} styles\n * @param {?=} sanitize\n * @return {?}\n */\nfunction buildMapFromList$1(styles, sanitize) {\n /** @type {?} */\n const sanitizeValue = (/**\n * @param {?} it\n * @return {?}\n */\n (it) => {\n if (sanitize) {\n it.value = sanitize(it.value);\n }\n return it;\n });\n return styles\n .map(stringToKeyValue)\n .filter((/**\n * @param {?} entry\n * @return {?}\n */\n entry => !!entry))\n .map(sanitizeValue)\n .reduce(keyValuesToMap, (/** @type {?} */ ({})));\n}\n\n/**\n * @fileoverview added by tsickle\n * Generated from: extended/module.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n/** @type {?} */\nconst ALL_DIRECTIVES = [\n DefaultShowHideDirective,\n DefaultClassDirective,\n DefaultStyleDirective,\n DefaultImgSrcDirective,\n];\n/**\n * *****************************************************************\n * Define module for the Extended API\n * *****************************************************************\n */\nclass ExtendedModule {\n}\nExtendedModule.ɵfac = function ExtendedModule_Factory(t) { return new (t || ExtendedModule)(); };\nExtendedModule.ɵmod = /*@__PURE__*/ ɵngcc0.ɵɵdefineNgModule({ type: ExtendedModule });\nExtendedModule.ɵinj = /*@__PURE__*/ ɵngcc0.ɵɵdefineInjector({ imports: [[CoreModule]] });\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(ExtendedModule, [{\n type: NgModule,\n args: [{\n imports: [CoreModule],\n declarations: [...ALL_DIRECTIVES],\n exports: [...ALL_DIRECTIVES]\n }]\n }], null, null); })();\n(function () { (typeof ngJitMode === \"undefined\" || ngJitMode) && ɵngcc0.ɵɵsetNgModuleScope(ExtendedModule, { declarations: function () { return [DefaultShowHideDirective, DefaultClassDirective, DefaultStyleDirective, DefaultImgSrcDirective]; }, imports: function () { return [CoreModule]; }, exports: function () { return [DefaultShowHideDirective, DefaultClassDirective, DefaultStyleDirective, DefaultImgSrcDirective]; } }); })();\n\n/**\n * @fileoverview added by tsickle\n * Generated from: extended/public-api.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n\n/**\n * @fileoverview added by tsickle\n * Generated from: extended/index.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n\nexport { ExtendedModule, ClassDirective, DefaultClassDirective, ImgSrcStyleBuilder, ImgSrcDirective, DefaultImgSrcDirective, ShowHideStyleBuilder, ShowHideDirective, DefaultShowHideDirective, StyleDirective, DefaultStyleDirective };\n\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\nimport { Directive, ElementRef, Injectable, NgModule, NgZone, Inject, Input, ɵɵdefineInjectable, ɵɵinject } from '@angular/core';\nimport { BaseDirective2, StyleBuilder, StyleUtils, MediaMarshaller, CoreModule, LAYOUT_CONFIG, validateBasis } from '@angular/flex-layout/core';\nimport { Directionality, BidiModule } from '@angular/cdk/bidi';\nimport { Subject } from 'rxjs';\nimport { takeUntil } from 'rxjs/operators';\n\n/**\n * @fileoverview added by tsickle\n * Generated from: utils/layout-validator.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n * @type {?}\n */\nimport * as ɵngcc0 from '@angular/core';\nimport * as ɵngcc1 from '@angular/flex-layout/core';\nimport * as ɵngcc2 from '@angular/cdk/bidi';\nconst INLINE = 'inline';\n/** @type {?} */\nconst LAYOUT_VALUES = ['row', 'column', 'row-reverse', 'column-reverse'];\n/**\n * Validate the direction|'direction wrap' value and then update the host's inline flexbox styles\n * @param {?} value\n * @return {?}\n */\nfunction buildLayoutCSS(value) {\n let [direction, wrap, isInline] = validateValue(value);\n return buildCSS(direction, wrap, isInline);\n}\n/**\n * Validate the value to be one of the acceptable value options\n * Use default fallback of 'row'\n * @param {?} value\n * @return {?}\n */\nfunction validateValue(value) {\n value = value ? value.toLowerCase() : '';\n let [direction, wrap, inline] = value.split(' ');\n // First value must be the `flex-direction`\n if (!LAYOUT_VALUES.find((/**\n * @param {?} x\n * @return {?}\n */\n x => x === direction))) {\n direction = LAYOUT_VALUES[0];\n }\n if (wrap === INLINE) {\n wrap = (inline !== INLINE) ? inline : '';\n inline = INLINE;\n }\n return [direction, validateWrapValue(wrap), !!inline];\n}\n/**\n * Determine if the validated, flex-direction value specifies\n * a horizontal/row flow.\n * @param {?} value\n * @return {?}\n */\nfunction isFlowHorizontal(value) {\n let [flow,] = validateValue(value);\n return flow.indexOf('row') > -1;\n}\n/**\n * Convert layout-wrap='' to expected flex-wrap style\n * @param {?} value\n * @return {?}\n */\nfunction validateWrapValue(value) {\n if (!!value) {\n switch (value.toLowerCase()) {\n case 'reverse':\n case 'wrap-reverse':\n case 'reverse-wrap':\n value = 'wrap-reverse';\n break;\n case 'no':\n case 'none':\n case 'nowrap':\n value = 'nowrap';\n break;\n // All other values fallback to 'wrap'\n default:\n value = 'wrap';\n break;\n }\n }\n return value;\n}\n/**\n * Build the CSS that should be assigned to the element instance\n * BUG:\n * 1) min-height on a column flex container won’t apply to its flex item children in IE 10-11.\n * Use height instead if possible; height : vh;\n *\n * This way any padding or border specified on the child elements are\n * laid out and drawn inside that element's specified width and height.\n * @param {?} direction\n * @param {?=} wrap\n * @param {?=} inline\n * @return {?}\n */\nfunction buildCSS(direction, wrap = null, inline = false) {\n return {\n 'display': inline ? 'inline-flex' : 'flex',\n 'box-sizing': 'border-box',\n 'flex-direction': direction,\n 'flex-wrap': !!wrap ? wrap : null\n };\n}\n\n/**\n * @fileoverview added by tsickle\n * Generated from: flex/layout/layout.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\nclass LayoutStyleBuilder extends StyleBuilder {\n /**\n * @param {?} input\n * @return {?}\n */\n buildStyles(input) {\n return buildLayoutCSS(input);\n }\n}\nLayoutStyleBuilder.ɵfac = /*@__PURE__*/ function () { let ɵLayoutStyleBuilder_BaseFactory; return function LayoutStyleBuilder_Factory(t) { return (ɵLayoutStyleBuilder_BaseFactory || (ɵLayoutStyleBuilder_BaseFactory = ɵngcc0.ɵɵgetInheritedFactory(LayoutStyleBuilder)))(t || LayoutStyleBuilder); }; }();\n/** @nocollapse */ LayoutStyleBuilder.ɵprov = ɵɵdefineInjectable({ factory: function LayoutStyleBuilder_Factory() { return new LayoutStyleBuilder(); }, token: LayoutStyleBuilder, providedIn: \"root\" });\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(LayoutStyleBuilder, [{\n type: Injectable,\n args: [{ providedIn: 'root' }]\n }], null, null); })();\n/** @type {?} */\nconst inputs = [\n 'fxLayout', 'fxLayout.xs', 'fxLayout.sm', 'fxLayout.md',\n 'fxLayout.lg', 'fxLayout.xl', 'fxLayout.lt-sm', 'fxLayout.lt-md',\n 'fxLayout.lt-lg', 'fxLayout.lt-xl', 'fxLayout.gt-xs', 'fxLayout.gt-sm',\n 'fxLayout.gt-md', 'fxLayout.gt-lg'\n];\n/** @type {?} */\nconst selector = `\n [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],\n [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],\n [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],\n [fxLayout.gt-md], [fxLayout.gt-lg]\n`;\n/**\n * 'layout' flexbox styling directive\n * Defines the positioning flow direction for the child elements: row or column\n * Optional values: column or row (default)\n * @see https://css-tricks.com/almanac/properties/f/flex-direction/\n *\n */\nclass LayoutDirective extends BaseDirective2 {\n /**\n * @param {?} elRef\n * @param {?} styleUtils\n * @param {?} styleBuilder\n * @param {?} marshal\n */\n constructor(elRef, styleUtils, styleBuilder, marshal) {\n super(elRef, styleBuilder, styleUtils, marshal);\n this.DIRECTIVE_KEY = 'layout';\n this.styleCache = layoutCache;\n this.init();\n }\n}\nLayoutDirective.ɵfac = function LayoutDirective_Factory(t) { return new (t || LayoutDirective)(ɵngcc0.ɵɵdirectiveInject(ɵngcc0.ElementRef), ɵngcc0.ɵɵdirectiveInject(ɵngcc1.StyleUtils), ɵngcc0.ɵɵdirectiveInject(LayoutStyleBuilder), ɵngcc0.ɵɵdirectiveInject(ɵngcc1.MediaMarshaller)); };\nLayoutDirective.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: LayoutDirective, features: [ɵngcc0.ɵɵInheritDefinitionFeature] });\n/** @nocollapse */\nLayoutDirective.ctorParameters = () => [\n { type: ElementRef },\n { type: StyleUtils },\n { type: LayoutStyleBuilder },\n { type: MediaMarshaller }\n];\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(LayoutDirective, [{\n type: Directive\n }], function () { return [{ type: ɵngcc0.ElementRef }, { type: ɵngcc1.StyleUtils }, { type: LayoutStyleBuilder }, { type: ɵngcc1.MediaMarshaller }]; }, null); })();\nclass DefaultLayoutDirective extends LayoutDirective {\n constructor() {\n super(...arguments);\n this.inputs = inputs;\n }\n}\nDefaultLayoutDirective.ɵfac = /*@__PURE__*/ function () { let ɵDefaultLayoutDirective_BaseFactory; return function DefaultLayoutDirective_Factory(t) { return (ɵDefaultLayoutDirective_BaseFactory || (ɵDefaultLayoutDirective_BaseFactory = ɵngcc0.ɵɵgetInheritedFactory(DefaultLayoutDirective)))(t || DefaultLayoutDirective); }; }();\nDefaultLayoutDirective.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: DefaultLayoutDirective, selectors: [[\"\", \"fxLayout\", \"\"], [\"\", \"fxLayout.xs\", \"\"], [\"\", \"fxLayout.sm\", \"\"], [\"\", \"fxLayout.md\", \"\"], [\"\", \"fxLayout.lg\", \"\"], [\"\", \"fxLayout.xl\", \"\"], [\"\", \"fxLayout.lt-sm\", \"\"], [\"\", \"fxLayout.lt-md\", \"\"], [\"\", \"fxLayout.lt-lg\", \"\"], [\"\", \"fxLayout.lt-xl\", \"\"], [\"\", \"fxLayout.gt-xs\", \"\"], [\"\", \"fxLayout.gt-sm\", \"\"], [\"\", \"fxLayout.gt-md\", \"\"], [\"\", \"fxLayout.gt-lg\", \"\"]], inputs: { fxLayout: \"fxLayout\", \"fxLayout.xs\": \"fxLayout.xs\", \"fxLayout.sm\": \"fxLayout.sm\", \"fxLayout.md\": \"fxLayout.md\", \"fxLayout.lg\": \"fxLayout.lg\", \"fxLayout.xl\": \"fxLayout.xl\", \"fxLayout.lt-sm\": \"fxLayout.lt-sm\", \"fxLayout.lt-md\": \"fxLayout.lt-md\", \"fxLayout.lt-lg\": \"fxLayout.lt-lg\", \"fxLayout.lt-xl\": \"fxLayout.lt-xl\", \"fxLayout.gt-xs\": \"fxLayout.gt-xs\", \"fxLayout.gt-sm\": \"fxLayout.gt-sm\", \"fxLayout.gt-md\": \"fxLayout.gt-md\", \"fxLayout.gt-lg\": \"fxLayout.gt-lg\" }, features: [ɵngcc0.ɵɵInheritDefinitionFeature] });\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(DefaultLayoutDirective, [{\n type: Directive,\n args: [{ selector, inputs }]\n }], null, null); })();\n/** @type {?} */\nconst layoutCache = new Map();\n\n/**\n * @fileoverview added by tsickle\n * Generated from: flex/layout-gap/layout-gap.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n/** @type {?} */\nconst CLEAR_MARGIN_CSS = {\n 'margin-left': null,\n 'margin-right': null,\n 'margin-top': null,\n 'margin-bottom': null\n};\nclass LayoutGapStyleBuilder extends StyleBuilder {\n /**\n * @param {?} _styler\n */\n constructor(_styler) {\n super();\n this._styler = _styler;\n }\n /**\n * @param {?} gapValue\n * @param {?} parent\n * @return {?}\n */\n buildStyles(gapValue, parent) {\n if (gapValue.endsWith(GRID_SPECIFIER)) {\n gapValue = gapValue.slice(0, gapValue.indexOf(GRID_SPECIFIER));\n // Add the margin to the host element\n return buildGridMargin(gapValue, parent.directionality);\n }\n else {\n return {};\n }\n }\n /**\n * @param {?} gapValue\n * @param {?} _styles\n * @param {?} parent\n * @return {?}\n */\n sideEffect(gapValue, _styles, parent) {\n /** @type {?} */\n const items = parent.items;\n if (gapValue.endsWith(GRID_SPECIFIER)) {\n gapValue = gapValue.slice(0, gapValue.indexOf(GRID_SPECIFIER));\n // For each `element` children, set the padding\n /** @type {?} */\n const paddingStyles = buildGridPadding(gapValue, parent.directionality);\n this._styler.applyStyleToElements(paddingStyles, parent.items);\n }\n else {\n /** @type {?} */\n const lastItem = (/** @type {?} */ (items.pop()));\n // For each `element` children EXCEPT the last,\n // set the margin right/bottom styles...\n /** @type {?} */\n const gapCss = buildGapCSS(gapValue, parent);\n this._styler.applyStyleToElements(gapCss, items);\n // Clear all gaps for all visible elements\n this._styler.applyStyleToElements(CLEAR_MARGIN_CSS, [lastItem]);\n }\n }\n}\nLayoutGapStyleBuilder.ɵfac = function LayoutGapStyleBuilder_Factory(t) { return new (t || LayoutGapStyleBuilder)(ɵngcc0.ɵɵinject(ɵngcc1.StyleUtils)); };\n/** @nocollapse */ LayoutGapStyleBuilder.ɵprov = ɵɵdefineInjectable({ factory: function LayoutGapStyleBuilder_Factory() { return new LayoutGapStyleBuilder(ɵɵinject(StyleUtils)); }, token: LayoutGapStyleBuilder, providedIn: \"root\" });\n/** @nocollapse */\nLayoutGapStyleBuilder.ctorParameters = () => [\n { type: StyleUtils }\n];\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(LayoutGapStyleBuilder, [{\n type: Injectable,\n args: [{ providedIn: 'root' }]\n }], function () { return [{ type: ɵngcc1.StyleUtils }]; }, null); })();\n/** @type {?} */\nconst inputs$1 = [\n 'fxLayoutGap', 'fxLayoutGap.xs', 'fxLayoutGap.sm', 'fxLayoutGap.md',\n 'fxLayoutGap.lg', 'fxLayoutGap.xl', 'fxLayoutGap.lt-sm', 'fxLayoutGap.lt-md',\n 'fxLayoutGap.lt-lg', 'fxLayoutGap.lt-xl', 'fxLayoutGap.gt-xs', 'fxLayoutGap.gt-sm',\n 'fxLayoutGap.gt-md', 'fxLayoutGap.gt-lg'\n];\n/** @type {?} */\nconst selector$1 = `\n [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md],\n [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md],\n [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm],\n [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]\n`;\n/**\n * 'layout-padding' styling directive\n * Defines padding of child elements in a layout container\n */\nclass LayoutGapDirective extends BaseDirective2 {\n /**\n * @param {?} elRef\n * @param {?} zone\n * @param {?} directionality\n * @param {?} styleUtils\n * @param {?} styleBuilder\n * @param {?} marshal\n */\n constructor(elRef, zone, directionality, styleUtils, styleBuilder, marshal) {\n super(elRef, styleBuilder, styleUtils, marshal);\n this.zone = zone;\n this.directionality = directionality;\n this.styleUtils = styleUtils;\n this.layout = 'row'; // default flex-direction\n // default flex-direction\n this.DIRECTIVE_KEY = 'layout-gap';\n this.observerSubject = new Subject();\n /** @type {?} */\n const extraTriggers = [this.directionality.change, this.observerSubject.asObservable()];\n this.init(extraTriggers);\n this.marshal\n .trackValue(this.nativeElement, 'layout')\n .pipe(takeUntil(this.destroySubject))\n .subscribe(this.onLayoutChange.bind(this));\n }\n /**\n * Special accessor to query for all child 'element' nodes regardless of type, class, etc\n * @protected\n * @return {?}\n */\n get childrenNodes() {\n /** @type {?} */\n const obj = this.nativeElement.children;\n /** @type {?} */\n const buffer = [];\n // iterate backwards ensuring that length is an UInt32\n for (let i = obj.length; i--;) {\n buffer[i] = obj[i];\n }\n return buffer;\n }\n // *********************************************\n // Lifecycle Methods\n // *********************************************\n /**\n * @return {?}\n */\n ngAfterContentInit() {\n this.buildChildObservable();\n this.triggerUpdate();\n }\n /**\n * @return {?}\n */\n ngOnDestroy() {\n super.ngOnDestroy();\n if (this.observer) {\n this.observer.disconnect();\n }\n }\n // *********************************************\n // Protected methods\n // *********************************************\n /**\n * Cache the parent container 'flex-direction' and update the 'margin' styles\n * @protected\n * @param {?} matcher\n * @return {?}\n */\n onLayoutChange(matcher) {\n /** @type {?} */\n const layout = matcher.value;\n // Make sure to filter out 'wrap' option\n /** @type {?} */\n const direction = layout.split(' ');\n this.layout = direction[0];\n if (!LAYOUT_VALUES.find((/**\n * @param {?} x\n * @return {?}\n */\n x => x === this.layout))) {\n this.layout = 'row';\n }\n this.triggerUpdate();\n }\n /**\n *\n * @protected\n * @param {?} value\n * @return {?}\n */\n updateWithValue(value) {\n // Gather all non-hidden Element nodes\n /** @type {?} */\n const items = this.childrenNodes\n .filter((/**\n * @param {?} el\n * @return {?}\n */\n el => el.nodeType === 1 && this.willDisplay(el)))\n .sort((/**\n * @param {?} a\n * @param {?} b\n * @return {?}\n */\n (a, b) => {\n /** @type {?} */\n const orderA = +this.styler.lookupStyle(a, 'order');\n /** @type {?} */\n const orderB = +this.styler.lookupStyle(b, 'order');\n if (isNaN(orderA) || isNaN(orderB) || orderA === orderB) {\n return 0;\n }\n else {\n return orderA > orderB ? 1 : -1;\n }\n }));\n if (items.length > 0) {\n /** @type {?} */\n const directionality = this.directionality.value;\n /** @type {?} */\n const layout = this.layout;\n if (layout === 'row' && directionality === 'rtl') {\n this.styleCache = layoutGapCacheRowRtl;\n }\n else if (layout === 'row' && directionality !== 'rtl') {\n this.styleCache = layoutGapCacheRowLtr;\n }\n else if (layout === 'column' && directionality === 'rtl') {\n this.styleCache = layoutGapCacheColumnRtl;\n }\n else if (layout === 'column' && directionality !== 'rtl') {\n this.styleCache = layoutGapCacheColumnLtr;\n }\n this.addStyles(value, { directionality, items, layout });\n }\n }\n /**\n * We need to override clearStyles because in most cases mru isn't populated\n * @protected\n * @return {?}\n */\n clearStyles() {\n /** @type {?} */\n const gridMode = Object.keys(this.mru).length > 0;\n /** @type {?} */\n const childrenStyle = gridMode ? 'padding' :\n getMarginType(this.directionality.value, this.layout);\n // If there are styles on the parent remove them\n if (gridMode) {\n super.clearStyles();\n }\n // Then remove the children styles too\n this.styleUtils.applyStyleToElements({ [childrenStyle]: '' }, this.childrenNodes);\n }\n /**\n * Determine if an element will show or hide based on current activation\n * @protected\n * @param {?} source\n * @return {?}\n */\n willDisplay(source) {\n /** @type {?} */\n const value = this.marshal.getValue(source, 'show-hide');\n return value === true ||\n (value === undefined && this.styleUtils.lookupStyle(source, 'display') !== 'none');\n }\n /**\n * @protected\n * @return {?}\n */\n buildChildObservable() {\n this.zone.runOutsideAngular((/**\n * @return {?}\n */\n () => {\n if (typeof MutationObserver !== 'undefined') {\n this.observer = new MutationObserver((/**\n * @param {?} mutations\n * @return {?}\n */\n (mutations) => {\n /** @type {?} */\n const validatedChanges = (/**\n * @param {?} it\n * @return {?}\n */\n (it) => {\n return (it.addedNodes && it.addedNodes.length > 0) ||\n (it.removedNodes && it.removedNodes.length > 0);\n });\n // update gap styles only for child 'added' or 'removed' events\n if (mutations.some(validatedChanges)) {\n this.observerSubject.next();\n }\n }));\n this.observer.observe(this.nativeElement, { childList: true });\n }\n }));\n }\n}\nLayoutGapDirective.ɵfac = function LayoutGapDirective_Factory(t) { return new (t || LayoutGapDirective)(ɵngcc0.ɵɵdirectiveInject(ɵngcc0.ElementRef), ɵngcc0.ɵɵdirectiveInject(ɵngcc0.NgZone), ɵngcc0.ɵɵdirectiveInject(ɵngcc2.Directionality), ɵngcc0.ɵɵdirectiveInject(ɵngcc1.StyleUtils), ɵngcc0.ɵɵdirectiveInject(LayoutGapStyleBuilder), ɵngcc0.ɵɵdirectiveInject(ɵngcc1.MediaMarshaller)); };\nLayoutGapDirective.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: LayoutGapDirective, features: [ɵngcc0.ɵɵInheritDefinitionFeature] });\n/** @nocollapse */\nLayoutGapDirective.ctorParameters = () => [\n { type: ElementRef },\n { type: NgZone },\n { type: Directionality },\n { type: StyleUtils },\n { type: LayoutGapStyleBuilder },\n { type: MediaMarshaller }\n];\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(LayoutGapDirective, [{\n type: Directive\n }], function () { return [{ type: ɵngcc0.ElementRef }, { type: ɵngcc0.NgZone }, { type: ɵngcc2.Directionality }, { type: ɵngcc1.StyleUtils }, { type: LayoutGapStyleBuilder }, { type: ɵngcc1.MediaMarshaller }]; }, null); })();\nclass DefaultLayoutGapDirective extends LayoutGapDirective {\n constructor() {\n super(...arguments);\n this.inputs = inputs$1;\n }\n}\nDefaultLayoutGapDirective.ɵfac = /*@__PURE__*/ function () { let ɵDefaultLayoutGapDirective_BaseFactory; return function DefaultLayoutGapDirective_Factory(t) { return (ɵDefaultLayoutGapDirective_BaseFactory || (ɵDefaultLayoutGapDirective_BaseFactory = ɵngcc0.ɵɵgetInheritedFactory(DefaultLayoutGapDirective)))(t || DefaultLayoutGapDirective); }; }();\nDefaultLayoutGapDirective.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: DefaultLayoutGapDirective, selectors: [[\"\", \"fxLayoutGap\", \"\"], [\"\", \"fxLayoutGap.xs\", \"\"], [\"\", \"fxLayoutGap.sm\", \"\"], [\"\", \"fxLayoutGap.md\", \"\"], [\"\", \"fxLayoutGap.lg\", \"\"], [\"\", \"fxLayoutGap.xl\", \"\"], [\"\", \"fxLayoutGap.lt-sm\", \"\"], [\"\", \"fxLayoutGap.lt-md\", \"\"], [\"\", \"fxLayoutGap.lt-lg\", \"\"], [\"\", \"fxLayoutGap.lt-xl\", \"\"], [\"\", \"fxLayoutGap.gt-xs\", \"\"], [\"\", \"fxLayoutGap.gt-sm\", \"\"], [\"\", \"fxLayoutGap.gt-md\", \"\"], [\"\", \"fxLayoutGap.gt-lg\", \"\"]], inputs: { fxLayoutGap: \"fxLayoutGap\", \"fxLayoutGap.xs\": \"fxLayoutGap.xs\", \"fxLayoutGap.sm\": \"fxLayoutGap.sm\", \"fxLayoutGap.md\": \"fxLayoutGap.md\", \"fxLayoutGap.lg\": \"fxLayoutGap.lg\", \"fxLayoutGap.xl\": \"fxLayoutGap.xl\", \"fxLayoutGap.lt-sm\": \"fxLayoutGap.lt-sm\", \"fxLayoutGap.lt-md\": \"fxLayoutGap.lt-md\", \"fxLayoutGap.lt-lg\": \"fxLayoutGap.lt-lg\", \"fxLayoutGap.lt-xl\": \"fxLayoutGap.lt-xl\", \"fxLayoutGap.gt-xs\": \"fxLayoutGap.gt-xs\", \"fxLayoutGap.gt-sm\": \"fxLayoutGap.gt-sm\", \"fxLayoutGap.gt-md\": \"fxLayoutGap.gt-md\", \"fxLayoutGap.gt-lg\": \"fxLayoutGap.gt-lg\" }, features: [ɵngcc0.ɵɵInheritDefinitionFeature] });\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(DefaultLayoutGapDirective, [{\n type: Directive,\n args: [{ selector: selector$1, inputs: inputs$1 }]\n }], null, null); })();\n/** @type {?} */\nconst layoutGapCacheRowRtl = new Map();\n/** @type {?} */\nconst layoutGapCacheColumnRtl = new Map();\n/** @type {?} */\nconst layoutGapCacheRowLtr = new Map();\n/** @type {?} */\nconst layoutGapCacheColumnLtr = new Map();\n/** @type {?} */\nconst GRID_SPECIFIER = ' grid';\n/**\n * @param {?} value\n * @param {?} directionality\n * @return {?}\n */\nfunction buildGridPadding(value, directionality) {\n const [between, below] = value.split(' ');\n /** @type {?} */\n const bottom = below || between;\n /** @type {?} */\n let paddingRight = '0px';\n /** @type {?} */\n let paddingBottom = bottom;\n /** @type {?} */\n let paddingLeft = '0px';\n if (directionality === 'rtl') {\n paddingLeft = between;\n }\n else {\n paddingRight = between;\n }\n return { 'padding': `0px ${paddingRight} ${paddingBottom} ${paddingLeft}` };\n}\n/**\n * @param {?} value\n * @param {?} directionality\n * @return {?}\n */\nfunction buildGridMargin(value, directionality) {\n const [between, below] = value.split(' ');\n /** @type {?} */\n const bottom = below || between;\n /** @type {?} */\n const minus = (/**\n * @param {?} str\n * @return {?}\n */\n (str) => `-${str}`);\n /** @type {?} */\n let marginRight = '0px';\n /** @type {?} */\n let marginBottom = minus(bottom);\n /** @type {?} */\n let marginLeft = '0px';\n if (directionality === 'rtl') {\n marginLeft = minus(between);\n }\n else {\n marginRight = minus(between);\n }\n return { 'margin': `0px ${marginRight} ${marginBottom} ${marginLeft}` };\n}\n/**\n * @param {?} directionality\n * @param {?} layout\n * @return {?}\n */\nfunction getMarginType(directionality, layout) {\n switch (layout) {\n case 'column':\n return 'margin-bottom';\n case 'column-reverse':\n return 'margin-top';\n case 'row':\n return directionality === 'rtl' ? 'margin-left' : 'margin-right';\n case 'row-reverse':\n return directionality === 'rtl' ? 'margin-right' : 'margin-left';\n default:\n return directionality === 'rtl' ? 'margin-left' : 'margin-right';\n }\n}\n/**\n * @param {?} gapValue\n * @param {?} parent\n * @return {?}\n */\nfunction buildGapCSS(gapValue, parent) {\n /** @type {?} */\n const key = getMarginType(parent.directionality, parent.layout);\n /** @type {?} */\n const margins = Object.assign({}, CLEAR_MARGIN_CSS);\n margins[key] = gapValue;\n return margins;\n}\n\n/**\n * @fileoverview added by tsickle\n * Generated from: utils/object-extend.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n\n/**\n * Extends an object with the *enumerable* and *own* properties of one or more source objects,\n * similar to Object.assign.\n *\n * @param {?} dest The object which will have properties copied to it.\n * @param {...?} sources The source objects from which properties will be copied.\n * @return {?}\n */\nfunction extendObject(dest, ...sources) {\n if (dest == null) {\n throw TypeError('Cannot convert undefined or null to object');\n }\n for (let source of sources) {\n if (source != null) {\n for (let key in source) {\n if (source.hasOwnProperty(key)) {\n dest[key] = source[key];\n }\n }\n }\n }\n return dest;\n}\n\n/**\n * @fileoverview added by tsickle\n * Generated from: flex/flex/flex.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\nclass FlexStyleBuilder extends StyleBuilder {\n /**\n * @param {?} layoutConfig\n */\n constructor(layoutConfig) {\n super();\n this.layoutConfig = layoutConfig;\n }\n /**\n * @param {?} input\n * @param {?} parent\n * @return {?}\n */\n buildStyles(input, parent) {\n let [grow, shrink, ...basisParts] = input.split(' ');\n /** @type {?} */\n let basis = basisParts.join(' ');\n // The flex-direction of this element's flex container. Defaults to 'row'.\n /** @type {?} */\n const direction = (parent.direction.indexOf('column') > -1) ? 'column' : 'row';\n /** @type {?} */\n const max = isFlowHorizontal(direction) ? 'max-width' : 'max-height';\n /** @type {?} */\n const min = isFlowHorizontal(direction) ? 'min-width' : 'min-height';\n /** @type {?} */\n const hasCalc = String(basis).indexOf('calc') > -1;\n /** @type {?} */\n const usingCalc = hasCalc || (basis === 'auto');\n /** @type {?} */\n const isPercent = String(basis).indexOf('%') > -1 && !hasCalc;\n /** @type {?} */\n const hasUnits = String(basis).indexOf('px') > -1 || String(basis).indexOf('rem') > -1 ||\n String(basis).indexOf('em') > -1 || String(basis).indexOf('vw') > -1 ||\n String(basis).indexOf('vh') > -1;\n /** @type {?} */\n let isValue = (hasCalc || hasUnits);\n grow = (grow == '0') ? 0 : grow;\n shrink = (shrink == '0') ? 0 : shrink;\n // make box inflexible when shrink and grow are both zero\n // should not set a min when the grow is zero\n // should not set a max when the shrink is zero\n /** @type {?} */\n const isFixed = !grow && !shrink;\n /** @type {?} */\n let css = {};\n // flex-basis allows you to specify the initial/starting main-axis size of the element,\n // before anything else is computed. It can either be a percentage or an absolute value.\n // It is, however, not the breaking point for flex-grow/shrink properties\n //\n // flex-grow can be seen as this:\n // 0: Do not stretch. Either size to element's content width, or obey 'flex-basis'.\n // 1: (Default value). Stretch; will be the same size to all other flex items on\n // the same row since they have a default value of 1.\n // ≥2 (integer n): Stretch. Will be n times the size of other elements\n // with 'flex-grow: 1' on the same row.\n // Use `null` to clear existing styles.\n /** @type {?} */\n const clearStyles = {\n 'max-width': null,\n 'max-height': null,\n 'min-width': null,\n 'min-height': null\n };\n switch (basis || '') {\n case '':\n /** @type {?} */\n const useColumnBasisZero = this.layoutConfig.useColumnBasisZero !== false;\n basis = direction === 'row' ? '0%' : (useColumnBasisZero ? '0.000000001px' : 'auto');\n break;\n case 'initial': // default\n case 'nogrow':\n grow = 0;\n basis = 'auto';\n break;\n case 'grow':\n basis = '100%';\n break;\n case 'noshrink':\n shrink = 0;\n basis = 'auto';\n break;\n case 'auto':\n break;\n case 'none':\n grow = 0;\n shrink = 0;\n basis = 'auto';\n break;\n default:\n // Defaults to percentage sizing unless `px` is explicitly set\n if (!isValue && !isPercent && !isNaN((/** @type {?} */ (basis)))) {\n basis = basis + '%';\n }\n // Fix for issue 280\n if (basis === '0%') {\n isValue = true;\n }\n if (basis === '0px') {\n basis = '0%';\n }\n // fix issue #5345\n if (hasCalc) {\n css = extendObject(clearStyles, {\n 'flex-grow': grow,\n 'flex-shrink': shrink,\n 'flex-basis': isValue ? basis : '100%'\n });\n }\n else {\n css = extendObject(clearStyles, {\n 'flex': `${grow} ${shrink} ${isValue ? basis : '100%'}`\n });\n }\n break;\n }\n if (!(css['flex'] || css['flex-grow'])) {\n if (hasCalc) {\n css = extendObject(clearStyles, {\n 'flex-grow': grow,\n 'flex-shrink': shrink,\n 'flex-basis': basis\n });\n }\n else {\n css = extendObject(clearStyles, {\n 'flex': `${grow} ${shrink} ${basis}`\n });\n }\n }\n // Fix for issues 277, 534, and 728\n if (basis !== '0%' && basis !== '0px' && basis !== '0.000000001px' && basis !== 'auto') {\n css[min] = isFixed || (isValue && grow) ? basis : null;\n css[max] = isFixed || (!usingCalc && shrink) ? basis : null;\n }\n // Fix for issue 528\n if (!css[min] && !css[max]) {\n if (hasCalc) {\n css = extendObject(clearStyles, {\n 'flex-grow': grow,\n 'flex-shrink': shrink,\n 'flex-basis': basis\n });\n }\n else {\n css = extendObject(clearStyles, {\n 'flex': `${grow} ${shrink} ${basis}`\n });\n }\n }\n else {\n // Fix for issue 660\n if (parent.hasWrap) {\n css[hasCalc ? 'flex-basis' : 'flex'] = css[max] ?\n (hasCalc ? css[max] : `${grow} ${shrink} ${css[max]}`) :\n (hasCalc ? css[min] : `${grow} ${shrink} ${css[min]}`);\n }\n }\n return (/** @type {?} */ (extendObject(css, { 'box-sizing': 'border-box' })));\n }\n}\nFlexStyleBuilder.ɵfac = function FlexStyleBuilder_Factory(t) { return new (t || FlexStyleBuilder)(ɵngcc0.ɵɵinject(LAYOUT_CONFIG)); };\n/** @nocollapse */ FlexStyleBuilder.ɵprov = ɵɵdefineInjectable({ factory: function FlexStyleBuilder_Factory() { return new FlexStyleBuilder(ɵɵinject(LAYOUT_CONFIG)); }, token: FlexStyleBuilder, providedIn: \"root\" });\n/** @nocollapse */\nFlexStyleBuilder.ctorParameters = () => [\n { type: undefined, decorators: [{ type: Inject, args: [LAYOUT_CONFIG,] }] }\n];\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(FlexStyleBuilder, [{\n type: Injectable,\n args: [{ providedIn: 'root' }]\n }], function () { return [{ type: undefined, decorators: [{\n type: Inject,\n args: [LAYOUT_CONFIG]\n }] }]; }, null); })();\n/** @type {?} */\nconst inputs$2 = [\n 'fxFlex', 'fxFlex.xs', 'fxFlex.sm', 'fxFlex.md',\n 'fxFlex.lg', 'fxFlex.xl', 'fxFlex.lt-sm', 'fxFlex.lt-md',\n 'fxFlex.lt-lg', 'fxFlex.lt-xl', 'fxFlex.gt-xs', 'fxFlex.gt-sm',\n 'fxFlex.gt-md', 'fxFlex.gt-lg'\n];\n/** @type {?} */\nconst selector$2 = `\n [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md],\n [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md],\n [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm],\n [fxFlex.gt-md], [fxFlex.gt-lg]\n`;\n/**\n * Directive to control the size of a flex item using flex-basis, flex-grow, and flex-shrink.\n * Corresponds to the css `flex` shorthand property.\n *\n * @see https://css-tricks.com/snippets/css/a-guide-to-flexbox/\n */\nclass FlexDirective extends BaseDirective2 {\n /**\n * @param {?} elRef\n * @param {?} styleUtils\n * @param {?} layoutConfig\n * @param {?} styleBuilder\n * @param {?} marshal\n */\n constructor(elRef, styleUtils, layoutConfig, styleBuilder, marshal) {\n super(elRef, styleBuilder, styleUtils, marshal);\n this.layoutConfig = layoutConfig;\n this.marshal = marshal;\n this.DIRECTIVE_KEY = 'flex';\n this.direction = undefined;\n this.wrap = undefined;\n this.flexGrow = '1';\n this.flexShrink = '1';\n this.init();\n }\n /**\n * @return {?}\n */\n get shrink() { return this.flexShrink; }\n /**\n * @param {?} value\n * @return {?}\n */\n set shrink(value) {\n this.flexShrink = value || '1';\n this.triggerReflow();\n }\n /**\n * @return {?}\n */\n get grow() { return this.flexGrow; }\n /**\n * @param {?} value\n * @return {?}\n */\n set grow(value) {\n this.flexGrow = value || '1';\n this.triggerReflow();\n }\n /**\n * @return {?}\n */\n ngOnInit() {\n if (this.parentElement) {\n this.marshal.trackValue(this.parentElement, 'layout')\n .pipe(takeUntil(this.destroySubject))\n .subscribe(this.onLayoutChange.bind(this));\n this.marshal.trackValue(this.nativeElement, 'layout-align')\n .pipe(takeUntil(this.destroySubject))\n .subscribe(this.triggerReflow.bind(this));\n }\n }\n /**\n * Caches the parent container's 'flex-direction' and updates the element's style.\n * Used as a handler for layout change events from the parent flex container.\n * @protected\n * @param {?} matcher\n * @return {?}\n */\n onLayoutChange(matcher) {\n /** @type {?} */\n const layout = matcher.value;\n /** @type {?} */\n const layoutParts = layout.split(' ');\n this.direction = layoutParts[0];\n this.wrap = layoutParts[1] !== undefined && layoutParts[1] === 'wrap';\n this.triggerUpdate();\n }\n /**\n * Input to this is exclusively the basis input value\n * @protected\n * @param {?} value\n * @return {?}\n */\n updateWithValue(value) {\n /** @type {?} */\n const addFlexToParent = this.layoutConfig.addFlexToParent !== false;\n if (this.direction === undefined) {\n this.direction = this.getFlexFlowDirection((/** @type {?} */ (this.parentElement)), addFlexToParent);\n }\n if (this.wrap === undefined) {\n this.wrap = this.hasWrap((/** @type {?} */ (this.parentElement)));\n }\n /** @type {?} */\n const direction = this.direction;\n /** @type {?} */\n const isHorizontal = direction.startsWith('row');\n /** @type {?} */\n const hasWrap = this.wrap;\n if (isHorizontal && hasWrap) {\n this.styleCache = flexRowWrapCache;\n }\n else if (isHorizontal && !hasWrap) {\n this.styleCache = flexRowCache;\n }\n else if (!isHorizontal && hasWrap) {\n this.styleCache = flexColumnWrapCache;\n }\n else if (!isHorizontal && !hasWrap) {\n this.styleCache = flexColumnCache;\n }\n /** @type {?} */\n const basis = String(value).replace(';', '');\n /** @type {?} */\n const parts = validateBasis(basis, this.flexGrow, this.flexShrink);\n this.addStyles(parts.join(' '), { direction, hasWrap });\n }\n /**\n * Trigger a style reflow, usually based on a shrink/grow input event\n * @protected\n * @return {?}\n */\n triggerReflow() {\n /** @type {?} */\n const activatedValue = this.activatedValue;\n if (activatedValue !== undefined) {\n /** @type {?} */\n const parts = validateBasis(activatedValue + '', this.flexGrow, this.flexShrink);\n this.marshal.updateElement(this.nativeElement, this.DIRECTIVE_KEY, parts.join(' '));\n }\n }\n}\nFlexDirective.ɵfac = function FlexDirective_Factory(t) { return new (t || FlexDirective)(ɵngcc0.ɵɵdirectiveInject(ɵngcc0.ElementRef), ɵngcc0.ɵɵdirectiveInject(ɵngcc1.StyleUtils), ɵngcc0.ɵɵdirectiveInject(LAYOUT_CONFIG), ɵngcc0.ɵɵdirectiveInject(FlexStyleBuilder), ɵngcc0.ɵɵdirectiveInject(ɵngcc1.MediaMarshaller)); };\nFlexDirective.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: FlexDirective, inputs: { shrink: [\"fxShrink\", \"shrink\"], grow: [\"fxGrow\", \"grow\"] }, features: [ɵngcc0.ɵɵInheritDefinitionFeature] });\n/** @nocollapse */\nFlexDirective.ctorParameters = () => [\n { type: ElementRef },\n { type: StyleUtils },\n { type: undefined, decorators: [{ type: Inject, args: [LAYOUT_CONFIG,] }] },\n { type: FlexStyleBuilder },\n { type: MediaMarshaller }\n];\nFlexDirective.propDecorators = {\n shrink: [{ type: Input, args: ['fxShrink',] }],\n grow: [{ type: Input, args: ['fxGrow',] }]\n};\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(FlexDirective, [{\n type: Directive\n }], function () { return [{ type: ɵngcc0.ElementRef }, { type: ɵngcc1.StyleUtils }, { type: undefined, decorators: [{\n type: Inject,\n args: [LAYOUT_CONFIG]\n }] }, { type: FlexStyleBuilder }, { type: ɵngcc1.MediaMarshaller }]; }, { shrink: [{\n type: Input,\n args: ['fxShrink']\n }], grow: [{\n type: Input,\n args: ['fxGrow']\n }] }); })();\nclass DefaultFlexDirective extends FlexDirective {\n constructor() {\n super(...arguments);\n this.inputs = inputs$2;\n }\n}\nDefaultFlexDirective.ɵfac = /*@__PURE__*/ function () { let ɵDefaultFlexDirective_BaseFactory; return function DefaultFlexDirective_Factory(t) { return (ɵDefaultFlexDirective_BaseFactory || (ɵDefaultFlexDirective_BaseFactory = ɵngcc0.ɵɵgetInheritedFactory(DefaultFlexDirective)))(t || DefaultFlexDirective); }; }();\nDefaultFlexDirective.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: DefaultFlexDirective, selectors: [[\"\", \"fxFlex\", \"\"], [\"\", \"fxFlex.xs\", \"\"], [\"\", \"fxFlex.sm\", \"\"], [\"\", \"fxFlex.md\", \"\"], [\"\", \"fxFlex.lg\", \"\"], [\"\", \"fxFlex.xl\", \"\"], [\"\", \"fxFlex.lt-sm\", \"\"], [\"\", \"fxFlex.lt-md\", \"\"], [\"\", \"fxFlex.lt-lg\", \"\"], [\"\", \"fxFlex.lt-xl\", \"\"], [\"\", \"fxFlex.gt-xs\", \"\"], [\"\", \"fxFlex.gt-sm\", \"\"], [\"\", \"fxFlex.gt-md\", \"\"], [\"\", \"fxFlex.gt-lg\", \"\"]], inputs: { fxFlex: \"fxFlex\", \"fxFlex.xs\": \"fxFlex.xs\", \"fxFlex.sm\": \"fxFlex.sm\", \"fxFlex.md\": \"fxFlex.md\", \"fxFlex.lg\": \"fxFlex.lg\", \"fxFlex.xl\": \"fxFlex.xl\", \"fxFlex.lt-sm\": \"fxFlex.lt-sm\", \"fxFlex.lt-md\": \"fxFlex.lt-md\", \"fxFlex.lt-lg\": \"fxFlex.lt-lg\", \"fxFlex.lt-xl\": \"fxFlex.lt-xl\", \"fxFlex.gt-xs\": \"fxFlex.gt-xs\", \"fxFlex.gt-sm\": \"fxFlex.gt-sm\", \"fxFlex.gt-md\": \"fxFlex.gt-md\", \"fxFlex.gt-lg\": \"fxFlex.gt-lg\" }, features: [ɵngcc0.ɵɵInheritDefinitionFeature] });\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(DefaultFlexDirective, [{\n type: Directive,\n args: [{ inputs: inputs$2, selector: selector$2 }]\n }], null, null); })();\n/** @type {?} */\nconst flexRowCache = new Map();\n/** @type {?} */\nconst flexColumnCache = new Map();\n/** @type {?} */\nconst flexRowWrapCache = new Map();\n/** @type {?} */\nconst flexColumnWrapCache = new Map();\n\n/**\n * @fileoverview added by tsickle\n * Generated from: flex/flex-order/flex-order.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\nclass FlexOrderStyleBuilder extends StyleBuilder {\n /**\n * @param {?} value\n * @return {?}\n */\n buildStyles(value) {\n return { order: (value && parseInt(value, 10)) || '' };\n }\n}\nFlexOrderStyleBuilder.ɵfac = /*@__PURE__*/ function () { let ɵFlexOrderStyleBuilder_BaseFactory; return function FlexOrderStyleBuilder_Factory(t) { return (ɵFlexOrderStyleBuilder_BaseFactory || (ɵFlexOrderStyleBuilder_BaseFactory = ɵngcc0.ɵɵgetInheritedFactory(FlexOrderStyleBuilder)))(t || FlexOrderStyleBuilder); }; }();\n/** @nocollapse */ FlexOrderStyleBuilder.ɵprov = ɵɵdefineInjectable({ factory: function FlexOrderStyleBuilder_Factory() { return new FlexOrderStyleBuilder(); }, token: FlexOrderStyleBuilder, providedIn: \"root\" });\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(FlexOrderStyleBuilder, [{\n type: Injectable,\n args: [{ providedIn: 'root' }]\n }], null, null); })();\n/** @type {?} */\nconst inputs$3 = [\n 'fxFlexOrder', 'fxFlexOrder.xs', 'fxFlexOrder.sm', 'fxFlexOrder.md',\n 'fxFlexOrder.lg', 'fxFlexOrder.xl', 'fxFlexOrder.lt-sm', 'fxFlexOrder.lt-md',\n 'fxFlexOrder.lt-lg', 'fxFlexOrder.lt-xl', 'fxFlexOrder.gt-xs', 'fxFlexOrder.gt-sm',\n 'fxFlexOrder.gt-md', 'fxFlexOrder.gt-lg'\n];\n/** @type {?} */\nconst selector$3 = `\n [fxFlexOrder], [fxFlexOrder.xs], [fxFlexOrder.sm], [fxFlexOrder.md],\n [fxFlexOrder.lg], [fxFlexOrder.xl], [fxFlexOrder.lt-sm], [fxFlexOrder.lt-md],\n [fxFlexOrder.lt-lg], [fxFlexOrder.lt-xl], [fxFlexOrder.gt-xs], [fxFlexOrder.gt-sm],\n [fxFlexOrder.gt-md], [fxFlexOrder.gt-lg]\n`;\n/**\n * 'flex-order' flexbox styling directive\n * Configures the positional ordering of the element in a sorted layout container\n * @see https://css-tricks.com/almanac/properties/o/order/\n */\nclass FlexOrderDirective extends BaseDirective2 {\n /**\n * @param {?} elRef\n * @param {?} styleUtils\n * @param {?} styleBuilder\n * @param {?} marshal\n */\n constructor(elRef, styleUtils, styleBuilder, marshal) {\n super(elRef, styleBuilder, styleUtils, marshal);\n this.DIRECTIVE_KEY = 'flex-order';\n this.styleCache = flexOrderCache;\n this.init();\n }\n}\nFlexOrderDirective.ɵfac = function FlexOrderDirective_Factory(t) { return new (t || FlexOrderDirective)(ɵngcc0.ɵɵdirectiveInject(ɵngcc0.ElementRef), ɵngcc0.ɵɵdirectiveInject(ɵngcc1.StyleUtils), ɵngcc0.ɵɵdirectiveInject(FlexOrderStyleBuilder), ɵngcc0.ɵɵdirectiveInject(ɵngcc1.MediaMarshaller)); };\nFlexOrderDirective.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: FlexOrderDirective, features: [ɵngcc0.ɵɵInheritDefinitionFeature] });\n/** @nocollapse */\nFlexOrderDirective.ctorParameters = () => [\n { type: ElementRef },\n { type: StyleUtils },\n { type: FlexOrderStyleBuilder },\n { type: MediaMarshaller }\n];\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(FlexOrderDirective, [{\n type: Directive\n }], function () { return [{ type: ɵngcc0.ElementRef }, { type: ɵngcc1.StyleUtils }, { type: FlexOrderStyleBuilder }, { type: ɵngcc1.MediaMarshaller }]; }, null); })();\n/** @type {?} */\nconst flexOrderCache = new Map();\nclass DefaultFlexOrderDirective extends FlexOrderDirective {\n constructor() {\n super(...arguments);\n this.inputs = inputs$3;\n }\n}\nDefaultFlexOrderDirective.ɵfac = /*@__PURE__*/ function () { let ɵDefaultFlexOrderDirective_BaseFactory; return function DefaultFlexOrderDirective_Factory(t) { return (ɵDefaultFlexOrderDirective_BaseFactory || (ɵDefaultFlexOrderDirective_BaseFactory = ɵngcc0.ɵɵgetInheritedFactory(DefaultFlexOrderDirective)))(t || DefaultFlexOrderDirective); }; }();\nDefaultFlexOrderDirective.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: DefaultFlexOrderDirective, selectors: [[\"\", \"fxFlexOrder\", \"\"], [\"\", \"fxFlexOrder.xs\", \"\"], [\"\", \"fxFlexOrder.sm\", \"\"], [\"\", \"fxFlexOrder.md\", \"\"], [\"\", \"fxFlexOrder.lg\", \"\"], [\"\", \"fxFlexOrder.xl\", \"\"], [\"\", \"fxFlexOrder.lt-sm\", \"\"], [\"\", \"fxFlexOrder.lt-md\", \"\"], [\"\", \"fxFlexOrder.lt-lg\", \"\"], [\"\", \"fxFlexOrder.lt-xl\", \"\"], [\"\", \"fxFlexOrder.gt-xs\", \"\"], [\"\", \"fxFlexOrder.gt-sm\", \"\"], [\"\", \"fxFlexOrder.gt-md\", \"\"], [\"\", \"fxFlexOrder.gt-lg\", \"\"]], inputs: { fxFlexOrder: \"fxFlexOrder\", \"fxFlexOrder.xs\": \"fxFlexOrder.xs\", \"fxFlexOrder.sm\": \"fxFlexOrder.sm\", \"fxFlexOrder.md\": \"fxFlexOrder.md\", \"fxFlexOrder.lg\": \"fxFlexOrder.lg\", \"fxFlexOrder.xl\": \"fxFlexOrder.xl\", \"fxFlexOrder.lt-sm\": \"fxFlexOrder.lt-sm\", \"fxFlexOrder.lt-md\": \"fxFlexOrder.lt-md\", \"fxFlexOrder.lt-lg\": \"fxFlexOrder.lt-lg\", \"fxFlexOrder.lt-xl\": \"fxFlexOrder.lt-xl\", \"fxFlexOrder.gt-xs\": \"fxFlexOrder.gt-xs\", \"fxFlexOrder.gt-sm\": \"fxFlexOrder.gt-sm\", \"fxFlexOrder.gt-md\": \"fxFlexOrder.gt-md\", \"fxFlexOrder.gt-lg\": \"fxFlexOrder.gt-lg\" }, features: [ɵngcc0.ɵɵInheritDefinitionFeature] });\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(DefaultFlexOrderDirective, [{\n type: Directive,\n args: [{ selector: selector$3, inputs: inputs$3 }]\n }], null, null); })();\n\n/**\n * @fileoverview added by tsickle\n * Generated from: flex/flex-offset/flex-offset.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\nclass FlexOffsetStyleBuilder extends StyleBuilder {\n /**\n * @param {?} offset\n * @param {?} parent\n * @return {?}\n */\n buildStyles(offset, parent) {\n if (offset === '') {\n offset = '0';\n }\n /** @type {?} */\n const isPercent = String(offset).indexOf('%') > -1;\n /** @type {?} */\n const isPx = String(offset).indexOf('px') > -1;\n if (!isPx && !isPercent && !isNaN(+offset)) {\n offset = offset + '%';\n }\n /** @type {?} */\n const horizontalLayoutKey = parent.isRtl ? 'margin-right' : 'margin-left';\n /** @type {?} */\n const styles = isFlowHorizontal(parent.layout) ?\n { [horizontalLayoutKey]: `${offset}` } : { 'margin-top': `${offset}` };\n return styles;\n }\n}\nFlexOffsetStyleBuilder.ɵfac = /*@__PURE__*/ function () { let ɵFlexOffsetStyleBuilder_BaseFactory; return function FlexOffsetStyleBuilder_Factory(t) { return (ɵFlexOffsetStyleBuilder_BaseFactory || (ɵFlexOffsetStyleBuilder_BaseFactory = ɵngcc0.ɵɵgetInheritedFactory(FlexOffsetStyleBuilder)))(t || FlexOffsetStyleBuilder); }; }();\n/** @nocollapse */ FlexOffsetStyleBuilder.ɵprov = ɵɵdefineInjectable({ factory: function FlexOffsetStyleBuilder_Factory() { return new FlexOffsetStyleBuilder(); }, token: FlexOffsetStyleBuilder, providedIn: \"root\" });\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(FlexOffsetStyleBuilder, [{\n type: Injectable,\n args: [{ providedIn: 'root' }]\n }], null, null); })();\n/** @type {?} */\nconst inputs$4 = [\n 'fxFlexOffset', 'fxFlexOffset.xs', 'fxFlexOffset.sm', 'fxFlexOffset.md',\n 'fxFlexOffset.lg', 'fxFlexOffset.xl', 'fxFlexOffset.lt-sm', 'fxFlexOffset.lt-md',\n 'fxFlexOffset.lt-lg', 'fxFlexOffset.lt-xl', 'fxFlexOffset.gt-xs', 'fxFlexOffset.gt-sm',\n 'fxFlexOffset.gt-md', 'fxFlexOffset.gt-lg'\n];\n/** @type {?} */\nconst selector$4 = `\n [fxFlexOffset], [fxFlexOffset.xs], [fxFlexOffset.sm], [fxFlexOffset.md],\n [fxFlexOffset.lg], [fxFlexOffset.xl], [fxFlexOffset.lt-sm], [fxFlexOffset.lt-md],\n [fxFlexOffset.lt-lg], [fxFlexOffset.lt-xl], [fxFlexOffset.gt-xs], [fxFlexOffset.gt-sm],\n [fxFlexOffset.gt-md], [fxFlexOffset.gt-lg]\n`;\n/**\n * 'flex-offset' flexbox styling directive\n * Configures the 'margin-left' of the element in a layout container\n */\nclass FlexOffsetDirective extends BaseDirective2 {\n /**\n * @param {?} elRef\n * @param {?} directionality\n * @param {?} styleBuilder\n * @param {?} marshal\n * @param {?} styler\n */\n constructor(elRef, directionality, styleBuilder, marshal, styler) {\n super(elRef, styleBuilder, styler, marshal);\n this.directionality = directionality;\n this.DIRECTIVE_KEY = 'flex-offset';\n this.init([this.directionality.change]);\n // Parent DOM `layout-gap` with affect the nested child with `flex-offset`\n if (this.parentElement) {\n this.marshal\n .trackValue(this.parentElement, 'layout-gap')\n .pipe(takeUntil(this.destroySubject))\n .subscribe(this.triggerUpdate.bind(this));\n }\n }\n // *********************************************\n // Protected methods\n // *********************************************\n /**\n * Using the current fxFlexOffset value, update the inline CSS\n * NOTE: this will assign `margin-left` if the parent flex-direction == 'row',\n * otherwise `margin-top` is used for the offset.\n * @protected\n * @param {?=} value\n * @return {?}\n */\n updateWithValue(value = '') {\n // The flex-direction of this element's flex container. Defaults to 'row'.\n /** @type {?} */\n const layout = this.getFlexFlowDirection((/** @type {?} */ (this.parentElement)), true);\n /** @type {?} */\n const isRtl = this.directionality.value === 'rtl';\n if (layout === 'row' && isRtl) {\n this.styleCache = flexOffsetCacheRowRtl;\n }\n else if (layout === 'row' && !isRtl) {\n this.styleCache = flexOffsetCacheRowLtr;\n }\n else if (layout === 'column' && isRtl) {\n this.styleCache = flexOffsetCacheColumnRtl;\n }\n else if (layout === 'column' && !isRtl) {\n this.styleCache = flexOffsetCacheColumnLtr;\n }\n this.addStyles(value + '', { layout, isRtl });\n }\n}\nFlexOffsetDirective.ɵfac = function FlexOffsetDirective_Factory(t) { return new (t || FlexOffsetDirective)(ɵngcc0.ɵɵdirectiveInject(ɵngcc0.ElementRef), ɵngcc0.ɵɵdirectiveInject(ɵngcc2.Directionality), ɵngcc0.ɵɵdirectiveInject(FlexOffsetStyleBuilder), ɵngcc0.ɵɵdirectiveInject(ɵngcc1.MediaMarshaller), ɵngcc0.ɵɵdirectiveInject(ɵngcc1.StyleUtils)); };\nFlexOffsetDirective.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: FlexOffsetDirective, features: [ɵngcc0.ɵɵInheritDefinitionFeature] });\n/** @nocollapse */\nFlexOffsetDirective.ctorParameters = () => [\n { type: ElementRef },\n { type: Directionality },\n { type: FlexOffsetStyleBuilder },\n { type: MediaMarshaller },\n { type: StyleUtils }\n];\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(FlexOffsetDirective, [{\n type: Directive\n }], function () { return [{ type: ɵngcc0.ElementRef }, { type: ɵngcc2.Directionality }, { type: FlexOffsetStyleBuilder }, { type: ɵngcc1.MediaMarshaller }, { type: ɵngcc1.StyleUtils }]; }, null); })();\nclass DefaultFlexOffsetDirective extends FlexOffsetDirective {\n constructor() {\n super(...arguments);\n this.inputs = inputs$4;\n }\n}\nDefaultFlexOffsetDirective.ɵfac = /*@__PURE__*/ function () { let ɵDefaultFlexOffsetDirective_BaseFactory; return function DefaultFlexOffsetDirective_Factory(t) { return (ɵDefaultFlexOffsetDirective_BaseFactory || (ɵDefaultFlexOffsetDirective_BaseFactory = ɵngcc0.ɵɵgetInheritedFactory(DefaultFlexOffsetDirective)))(t || DefaultFlexOffsetDirective); }; }();\nDefaultFlexOffsetDirective.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: DefaultFlexOffsetDirective, selectors: [[\"\", \"fxFlexOffset\", \"\"], [\"\", \"fxFlexOffset.xs\", \"\"], [\"\", \"fxFlexOffset.sm\", \"\"], [\"\", \"fxFlexOffset.md\", \"\"], [\"\", \"fxFlexOffset.lg\", \"\"], [\"\", \"fxFlexOffset.xl\", \"\"], [\"\", \"fxFlexOffset.lt-sm\", \"\"], [\"\", \"fxFlexOffset.lt-md\", \"\"], [\"\", \"fxFlexOffset.lt-lg\", \"\"], [\"\", \"fxFlexOffset.lt-xl\", \"\"], [\"\", \"fxFlexOffset.gt-xs\", \"\"], [\"\", \"fxFlexOffset.gt-sm\", \"\"], [\"\", \"fxFlexOffset.gt-md\", \"\"], [\"\", \"fxFlexOffset.gt-lg\", \"\"]], inputs: { fxFlexOffset: \"fxFlexOffset\", \"fxFlexOffset.xs\": \"fxFlexOffset.xs\", \"fxFlexOffset.sm\": \"fxFlexOffset.sm\", \"fxFlexOffset.md\": \"fxFlexOffset.md\", \"fxFlexOffset.lg\": \"fxFlexOffset.lg\", \"fxFlexOffset.xl\": \"fxFlexOffset.xl\", \"fxFlexOffset.lt-sm\": \"fxFlexOffset.lt-sm\", \"fxFlexOffset.lt-md\": \"fxFlexOffset.lt-md\", \"fxFlexOffset.lt-lg\": \"fxFlexOffset.lt-lg\", \"fxFlexOffset.lt-xl\": \"fxFlexOffset.lt-xl\", \"fxFlexOffset.gt-xs\": \"fxFlexOffset.gt-xs\", \"fxFlexOffset.gt-sm\": \"fxFlexOffset.gt-sm\", \"fxFlexOffset.gt-md\": \"fxFlexOffset.gt-md\", \"fxFlexOffset.gt-lg\": \"fxFlexOffset.gt-lg\" }, features: [ɵngcc0.ɵɵInheritDefinitionFeature] });\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(DefaultFlexOffsetDirective, [{\n type: Directive,\n args: [{ selector: selector$4, inputs: inputs$4 }]\n }], null, null); })();\n/** @type {?} */\nconst flexOffsetCacheRowRtl = new Map();\n/** @type {?} */\nconst flexOffsetCacheColumnRtl = new Map();\n/** @type {?} */\nconst flexOffsetCacheRowLtr = new Map();\n/** @type {?} */\nconst flexOffsetCacheColumnLtr = new Map();\n\n/**\n * @fileoverview added by tsickle\n * Generated from: flex/flex-align/flex-align.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\nclass FlexAlignStyleBuilder extends StyleBuilder {\n /**\n * @param {?} input\n * @return {?}\n */\n buildStyles(input) {\n input = input || 'stretch';\n /** @type {?} */\n const styles = {};\n // Cross-axis\n switch (input) {\n case 'start':\n styles['align-self'] = 'flex-start';\n break;\n case 'end':\n styles['align-self'] = 'flex-end';\n break;\n default:\n styles['align-self'] = input;\n break;\n }\n return styles;\n }\n}\nFlexAlignStyleBuilder.ɵfac = /*@__PURE__*/ function () { let ɵFlexAlignStyleBuilder_BaseFactory; return function FlexAlignStyleBuilder_Factory(t) { return (ɵFlexAlignStyleBuilder_BaseFactory || (ɵFlexAlignStyleBuilder_BaseFactory = ɵngcc0.ɵɵgetInheritedFactory(FlexAlignStyleBuilder)))(t || FlexAlignStyleBuilder); }; }();\n/** @nocollapse */ FlexAlignStyleBuilder.ɵprov = ɵɵdefineInjectable({ factory: function FlexAlignStyleBuilder_Factory() { return new FlexAlignStyleBuilder(); }, token: FlexAlignStyleBuilder, providedIn: \"root\" });\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(FlexAlignStyleBuilder, [{\n type: Injectable,\n args: [{ providedIn: 'root' }]\n }], null, null); })();\n/** @type {?} */\nconst inputs$5 = [\n 'fxFlexAlign', 'fxFlexAlign.xs', 'fxFlexAlign.sm', 'fxFlexAlign.md',\n 'fxFlexAlign.lg', 'fxFlexAlign.xl', 'fxFlexAlign.lt-sm', 'fxFlexAlign.lt-md',\n 'fxFlexAlign.lt-lg', 'fxFlexAlign.lt-xl', 'fxFlexAlign.gt-xs', 'fxFlexAlign.gt-sm',\n 'fxFlexAlign.gt-md', 'fxFlexAlign.gt-lg'\n];\n/** @type {?} */\nconst selector$5 = `\n [fxFlexAlign], [fxFlexAlign.xs], [fxFlexAlign.sm], [fxFlexAlign.md],\n [fxFlexAlign.lg], [fxFlexAlign.xl], [fxFlexAlign.lt-sm], [fxFlexAlign.lt-md],\n [fxFlexAlign.lt-lg], [fxFlexAlign.lt-xl], [fxFlexAlign.gt-xs], [fxFlexAlign.gt-sm],\n [fxFlexAlign.gt-md], [fxFlexAlign.gt-lg]\n`;\n/**\n * 'flex-align' flexbox styling directive\n * Allows element-specific overrides for cross-axis alignments in a layout container\n * @see https://css-tricks.com/almanac/properties/a/align-self/\n */\nclass FlexAlignDirective extends BaseDirective2 {\n /**\n * @param {?} elRef\n * @param {?} styleUtils\n * @param {?} styleBuilder\n * @param {?} marshal\n */\n constructor(elRef, styleUtils, styleBuilder, marshal) {\n super(elRef, styleBuilder, styleUtils, marshal);\n this.DIRECTIVE_KEY = 'flex-align';\n this.styleCache = flexAlignCache;\n this.init();\n }\n}\nFlexAlignDirective.ɵfac = function FlexAlignDirective_Factory(t) { return new (t || FlexAlignDirective)(ɵngcc0.ɵɵdirectiveInject(ɵngcc0.ElementRef), ɵngcc0.ɵɵdirectiveInject(ɵngcc1.StyleUtils), ɵngcc0.ɵɵdirectiveInject(FlexAlignStyleBuilder), ɵngcc0.ɵɵdirectiveInject(ɵngcc1.MediaMarshaller)); };\nFlexAlignDirective.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: FlexAlignDirective, features: [ɵngcc0.ɵɵInheritDefinitionFeature] });\n/** @nocollapse */\nFlexAlignDirective.ctorParameters = () => [\n { type: ElementRef },\n { type: StyleUtils },\n { type: FlexAlignStyleBuilder },\n { type: MediaMarshaller }\n];\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(FlexAlignDirective, [{\n type: Directive\n }], function () { return [{ type: ɵngcc0.ElementRef }, { type: ɵngcc1.StyleUtils }, { type: FlexAlignStyleBuilder }, { type: ɵngcc1.MediaMarshaller }]; }, null); })();\n/** @type {?} */\nconst flexAlignCache = new Map();\nclass DefaultFlexAlignDirective extends FlexAlignDirective {\n constructor() {\n super(...arguments);\n this.inputs = inputs$5;\n }\n}\nDefaultFlexAlignDirective.ɵfac = /*@__PURE__*/ function () { let ɵDefaultFlexAlignDirective_BaseFactory; return function DefaultFlexAlignDirective_Factory(t) { return (ɵDefaultFlexAlignDirective_BaseFactory || (ɵDefaultFlexAlignDirective_BaseFactory = ɵngcc0.ɵɵgetInheritedFactory(DefaultFlexAlignDirective)))(t || DefaultFlexAlignDirective); }; }();\nDefaultFlexAlignDirective.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: DefaultFlexAlignDirective, selectors: [[\"\", \"fxFlexAlign\", \"\"], [\"\", \"fxFlexAlign.xs\", \"\"], [\"\", \"fxFlexAlign.sm\", \"\"], [\"\", \"fxFlexAlign.md\", \"\"], [\"\", \"fxFlexAlign.lg\", \"\"], [\"\", \"fxFlexAlign.xl\", \"\"], [\"\", \"fxFlexAlign.lt-sm\", \"\"], [\"\", \"fxFlexAlign.lt-md\", \"\"], [\"\", \"fxFlexAlign.lt-lg\", \"\"], [\"\", \"fxFlexAlign.lt-xl\", \"\"], [\"\", \"fxFlexAlign.gt-xs\", \"\"], [\"\", \"fxFlexAlign.gt-sm\", \"\"], [\"\", \"fxFlexAlign.gt-md\", \"\"], [\"\", \"fxFlexAlign.gt-lg\", \"\"]], inputs: { fxFlexAlign: \"fxFlexAlign\", \"fxFlexAlign.xs\": \"fxFlexAlign.xs\", \"fxFlexAlign.sm\": \"fxFlexAlign.sm\", \"fxFlexAlign.md\": \"fxFlexAlign.md\", \"fxFlexAlign.lg\": \"fxFlexAlign.lg\", \"fxFlexAlign.xl\": \"fxFlexAlign.xl\", \"fxFlexAlign.lt-sm\": \"fxFlexAlign.lt-sm\", \"fxFlexAlign.lt-md\": \"fxFlexAlign.lt-md\", \"fxFlexAlign.lt-lg\": \"fxFlexAlign.lt-lg\", \"fxFlexAlign.lt-xl\": \"fxFlexAlign.lt-xl\", \"fxFlexAlign.gt-xs\": \"fxFlexAlign.gt-xs\", \"fxFlexAlign.gt-sm\": \"fxFlexAlign.gt-sm\", \"fxFlexAlign.gt-md\": \"fxFlexAlign.gt-md\", \"fxFlexAlign.gt-lg\": \"fxFlexAlign.gt-lg\" }, features: [ɵngcc0.ɵɵInheritDefinitionFeature] });\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(DefaultFlexAlignDirective, [{\n type: Directive,\n args: [{ selector: selector$5, inputs: inputs$5 }]\n }], null, null); })();\n\n/**\n * @fileoverview added by tsickle\n * Generated from: flex/flex-fill/flex-fill.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n/** @type {?} */\nconst FLEX_FILL_CSS = {\n 'margin': 0,\n 'width': '100%',\n 'height': '100%',\n 'min-width': '100%',\n 'min-height': '100%'\n};\nclass FlexFillStyleBuilder extends StyleBuilder {\n /**\n * @param {?} _input\n * @return {?}\n */\n buildStyles(_input) {\n return FLEX_FILL_CSS;\n }\n}\nFlexFillStyleBuilder.ɵfac = /*@__PURE__*/ function () { let ɵFlexFillStyleBuilder_BaseFactory; return function FlexFillStyleBuilder_Factory(t) { return (ɵFlexFillStyleBuilder_BaseFactory || (ɵFlexFillStyleBuilder_BaseFactory = ɵngcc0.ɵɵgetInheritedFactory(FlexFillStyleBuilder)))(t || FlexFillStyleBuilder); }; }();\n/** @nocollapse */ FlexFillStyleBuilder.ɵprov = ɵɵdefineInjectable({ factory: function FlexFillStyleBuilder_Factory() { return new FlexFillStyleBuilder(); }, token: FlexFillStyleBuilder, providedIn: \"root\" });\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(FlexFillStyleBuilder, [{\n type: Injectable,\n args: [{ providedIn: 'root' }]\n }], null, null); })();\n/**\n * 'fxFill' flexbox styling directive\n * Maximizes width and height of element in a layout container\n *\n * NOTE: fxFill is NOT responsive API!!\n */\nclass FlexFillDirective extends BaseDirective2 {\n /**\n * @param {?} elRef\n * @param {?} styleUtils\n * @param {?} styleBuilder\n * @param {?} marshal\n */\n constructor(elRef, styleUtils, styleBuilder, marshal) {\n super(elRef, styleBuilder, styleUtils, marshal);\n this.styleCache = flexFillCache;\n this.addStyles('');\n }\n}\nFlexFillDirective.ɵfac = function FlexFillDirective_Factory(t) { return new (t || FlexFillDirective)(ɵngcc0.ɵɵdirectiveInject(ɵngcc0.ElementRef), ɵngcc0.ɵɵdirectiveInject(ɵngcc1.StyleUtils), ɵngcc0.ɵɵdirectiveInject(FlexFillStyleBuilder), ɵngcc0.ɵɵdirectiveInject(ɵngcc1.MediaMarshaller)); };\nFlexFillDirective.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: FlexFillDirective, selectors: [[\"\", \"fxFill\", \"\"], [\"\", \"fxFlexFill\", \"\"]], features: [ɵngcc0.ɵɵInheritDefinitionFeature] });\n/** @nocollapse */\nFlexFillDirective.ctorParameters = () => [\n { type: ElementRef },\n { type: StyleUtils },\n { type: FlexFillStyleBuilder },\n { type: MediaMarshaller }\n];\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(FlexFillDirective, [{\n type: Directive,\n args: [{ selector: `[fxFill], [fxFlexFill]` }]\n }], function () { return [{ type: ɵngcc0.ElementRef }, { type: ɵngcc1.StyleUtils }, { type: FlexFillStyleBuilder }, { type: ɵngcc1.MediaMarshaller }]; }, null); })();\n/** @type {?} */\nconst flexFillCache = new Map();\n\n/**\n * @fileoverview added by tsickle\n * Generated from: flex/layout-align/layout-align.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\nclass LayoutAlignStyleBuilder extends StyleBuilder {\n /**\n * @param {?} align\n * @param {?} parent\n * @return {?}\n */\n buildStyles(align, parent) {\n /** @type {?} */\n const css = {};\n const [mainAxis, crossAxis] = align.split(' ');\n // Main axis\n switch (mainAxis) {\n case 'center':\n css['justify-content'] = 'center';\n break;\n case 'space-around':\n css['justify-content'] = 'space-around';\n break;\n case 'space-between':\n css['justify-content'] = 'space-between';\n break;\n case 'space-evenly':\n css['justify-content'] = 'space-evenly';\n break;\n case 'end':\n case 'flex-end':\n css['justify-content'] = 'flex-end';\n break;\n case 'start':\n case 'flex-start':\n default:\n css['justify-content'] = 'flex-start'; // default main axis\n break;\n }\n // Cross-axis\n switch (crossAxis) {\n case 'start':\n case 'flex-start':\n css['align-items'] = css['align-content'] = 'flex-start';\n break;\n case 'center':\n css['align-items'] = css['align-content'] = 'center';\n break;\n case 'end':\n case 'flex-end':\n css['align-items'] = css['align-content'] = 'flex-end';\n break;\n case 'space-between':\n css['align-content'] = 'space-between';\n css['align-items'] = 'stretch';\n break;\n case 'space-around':\n css['align-content'] = 'space-around';\n css['align-items'] = 'stretch';\n break;\n case 'baseline':\n css['align-content'] = 'stretch';\n css['align-items'] = 'baseline';\n break;\n case 'stretch':\n default: // 'stretch'\n css['align-items'] = css['align-content'] = 'stretch'; // default cross axis\n break;\n }\n return (/** @type {?} */ (extendObject(css, {\n 'display': parent.inline ? 'inline-flex' : 'flex',\n 'flex-direction': parent.layout,\n 'box-sizing': 'border-box',\n 'max-width': crossAxis === 'stretch' ?\n !isFlowHorizontal(parent.layout) ? '100%' : null : null,\n 'max-height': crossAxis === 'stretch' ?\n isFlowHorizontal(parent.layout) ? '100%' : null : null,\n })));\n }\n}\nLayoutAlignStyleBuilder.ɵfac = /*@__PURE__*/ function () { let ɵLayoutAlignStyleBuilder_BaseFactory; return function LayoutAlignStyleBuilder_Factory(t) { return (ɵLayoutAlignStyleBuilder_BaseFactory || (ɵLayoutAlignStyleBuilder_BaseFactory = ɵngcc0.ɵɵgetInheritedFactory(LayoutAlignStyleBuilder)))(t || LayoutAlignStyleBuilder); }; }();\n/** @nocollapse */ LayoutAlignStyleBuilder.ɵprov = ɵɵdefineInjectable({ factory: function LayoutAlignStyleBuilder_Factory() { return new LayoutAlignStyleBuilder(); }, token: LayoutAlignStyleBuilder, providedIn: \"root\" });\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(LayoutAlignStyleBuilder, [{\n type: Injectable,\n args: [{ providedIn: 'root' }]\n }], null, null); })();\n/** @type {?} */\nconst inputs$6 = [\n 'fxLayoutAlign', 'fxLayoutAlign.xs', 'fxLayoutAlign.sm', 'fxLayoutAlign.md',\n 'fxLayoutAlign.lg', 'fxLayoutAlign.xl', 'fxLayoutAlign.lt-sm', 'fxLayoutAlign.lt-md',\n 'fxLayoutAlign.lt-lg', 'fxLayoutAlign.lt-xl', 'fxLayoutAlign.gt-xs', 'fxLayoutAlign.gt-sm',\n 'fxLayoutAlign.gt-md', 'fxLayoutAlign.gt-lg'\n];\n/** @type {?} */\nconst selector$6 = `\n [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md],\n [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md],\n [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm],\n [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]\n`;\n/**\n * 'layout-align' flexbox styling directive\n * Defines positioning of child elements along main and cross axis in a layout container\n * Optional values: {main-axis} values or {main-axis cross-axis} value pairs\n *\n * @see https://css-tricks.com/almanac/properties/j/justify-content/\n * @see https://css-tricks.com/almanac/properties/a/align-items/\n * @see https://css-tricks.com/almanac/properties/a/align-content/\n */\nclass LayoutAlignDirective extends BaseDirective2 {\n // default inline value\n /**\n * @param {?} elRef\n * @param {?} styleUtils\n * @param {?} styleBuilder\n * @param {?} marshal\n */\n constructor(elRef, styleUtils, styleBuilder, marshal) {\n super(elRef, styleBuilder, styleUtils, marshal);\n this.DIRECTIVE_KEY = 'layout-align';\n this.layout = 'row'; // default flex-direction\n // default flex-direction\n this.inline = false; // default inline value\n this.init();\n this.marshal.trackValue(this.nativeElement, 'layout')\n .pipe(takeUntil(this.destroySubject))\n .subscribe(this.onLayoutChange.bind(this));\n }\n // *********************************************\n // Protected methods\n // *********************************************\n /**\n *\n * @protected\n * @param {?} value\n * @return {?}\n */\n updateWithValue(value) {\n /** @type {?} */\n const layout = this.layout || 'row';\n /** @type {?} */\n const inline = this.inline;\n if (layout === 'row' && inline) {\n this.styleCache = layoutAlignHorizontalInlineCache;\n }\n else if (layout === 'row' && !inline) {\n this.styleCache = layoutAlignHorizontalCache;\n }\n else if (layout === 'row-reverse' && inline) {\n this.styleCache = layoutAlignHorizontalRevInlineCache;\n }\n else if (layout === 'row-reverse' && !inline) {\n this.styleCache = layoutAlignHorizontalRevCache;\n }\n else if (layout === 'column' && inline) {\n this.styleCache = layoutAlignVerticalInlineCache;\n }\n else if (layout === 'column' && !inline) {\n this.styleCache = layoutAlignVerticalCache;\n }\n else if (layout === 'column-reverse' && inline) {\n this.styleCache = layoutAlignVerticalRevInlineCache;\n }\n else if (layout === 'column-reverse' && !inline) {\n this.styleCache = layoutAlignVerticalRevCache;\n }\n this.addStyles(value, { layout, inline });\n }\n /**\n * Cache the parent container 'flex-direction' and update the 'flex' styles\n * @protected\n * @param {?} matcher\n * @return {?}\n */\n onLayoutChange(matcher) {\n /** @type {?} */\n const layoutKeys = matcher.value.split(' ');\n this.layout = layoutKeys[0];\n this.inline = matcher.value.includes('inline');\n if (!LAYOUT_VALUES.find((/**\n * @param {?} x\n * @return {?}\n */\n x => x === this.layout))) {\n this.layout = 'row';\n }\n this.triggerUpdate();\n }\n}\nLayoutAlignDirective.ɵfac = function LayoutAlignDirective_Factory(t) { return new (t || LayoutAlignDirective)(ɵngcc0.ɵɵdirectiveInject(ɵngcc0.ElementRef), ɵngcc0.ɵɵdirectiveInject(ɵngcc1.StyleUtils), ɵngcc0.ɵɵdirectiveInject(LayoutAlignStyleBuilder), ɵngcc0.ɵɵdirectiveInject(ɵngcc1.MediaMarshaller)); };\nLayoutAlignDirective.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: LayoutAlignDirective, features: [ɵngcc0.ɵɵInheritDefinitionFeature] });\n/** @nocollapse */\nLayoutAlignDirective.ctorParameters = () => [\n { type: ElementRef },\n { type: StyleUtils },\n { type: LayoutAlignStyleBuilder },\n { type: MediaMarshaller }\n];\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(LayoutAlignDirective, [{\n type: Directive\n }], function () { return [{ type: ɵngcc0.ElementRef }, { type: ɵngcc1.StyleUtils }, { type: LayoutAlignStyleBuilder }, { type: ɵngcc1.MediaMarshaller }]; }, null); })();\nclass DefaultLayoutAlignDirective extends LayoutAlignDirective {\n constructor() {\n super(...arguments);\n this.inputs = inputs$6;\n }\n}\nDefaultLayoutAlignDirective.ɵfac = /*@__PURE__*/ function () { let ɵDefaultLayoutAlignDirective_BaseFactory; return function DefaultLayoutAlignDirective_Factory(t) { return (ɵDefaultLayoutAlignDirective_BaseFactory || (ɵDefaultLayoutAlignDirective_BaseFactory = ɵngcc0.ɵɵgetInheritedFactory(DefaultLayoutAlignDirective)))(t || DefaultLayoutAlignDirective); }; }();\nDefaultLayoutAlignDirective.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: DefaultLayoutAlignDirective, selectors: [[\"\", \"fxLayoutAlign\", \"\"], [\"\", \"fxLayoutAlign.xs\", \"\"], [\"\", \"fxLayoutAlign.sm\", \"\"], [\"\", \"fxLayoutAlign.md\", \"\"], [\"\", \"fxLayoutAlign.lg\", \"\"], [\"\", \"fxLayoutAlign.xl\", \"\"], [\"\", \"fxLayoutAlign.lt-sm\", \"\"], [\"\", \"fxLayoutAlign.lt-md\", \"\"], [\"\", \"fxLayoutAlign.lt-lg\", \"\"], [\"\", \"fxLayoutAlign.lt-xl\", \"\"], [\"\", \"fxLayoutAlign.gt-xs\", \"\"], [\"\", \"fxLayoutAlign.gt-sm\", \"\"], [\"\", \"fxLayoutAlign.gt-md\", \"\"], [\"\", \"fxLayoutAlign.gt-lg\", \"\"]], inputs: { fxLayoutAlign: \"fxLayoutAlign\", \"fxLayoutAlign.xs\": \"fxLayoutAlign.xs\", \"fxLayoutAlign.sm\": \"fxLayoutAlign.sm\", \"fxLayoutAlign.md\": \"fxLayoutAlign.md\", \"fxLayoutAlign.lg\": \"fxLayoutAlign.lg\", \"fxLayoutAlign.xl\": \"fxLayoutAlign.xl\", \"fxLayoutAlign.lt-sm\": \"fxLayoutAlign.lt-sm\", \"fxLayoutAlign.lt-md\": \"fxLayoutAlign.lt-md\", \"fxLayoutAlign.lt-lg\": \"fxLayoutAlign.lt-lg\", \"fxLayoutAlign.lt-xl\": \"fxLayoutAlign.lt-xl\", \"fxLayoutAlign.gt-xs\": \"fxLayoutAlign.gt-xs\", \"fxLayoutAlign.gt-sm\": \"fxLayoutAlign.gt-sm\", \"fxLayoutAlign.gt-md\": \"fxLayoutAlign.gt-md\", \"fxLayoutAlign.gt-lg\": \"fxLayoutAlign.gt-lg\" }, features: [ɵngcc0.ɵɵInheritDefinitionFeature] });\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(DefaultLayoutAlignDirective, [{\n type: Directive,\n args: [{ selector: selector$6, inputs: inputs$6 }]\n }], null, null); })();\n/** @type {?} */\nconst layoutAlignHorizontalCache = new Map();\n/** @type {?} */\nconst layoutAlignVerticalCache = new Map();\n/** @type {?} */\nconst layoutAlignHorizontalRevCache = new Map();\n/** @type {?} */\nconst layoutAlignVerticalRevCache = new Map();\n/** @type {?} */\nconst layoutAlignHorizontalInlineCache = new Map();\n/** @type {?} */\nconst layoutAlignVerticalInlineCache = new Map();\n/** @type {?} */\nconst layoutAlignHorizontalRevInlineCache = new Map();\n/** @type {?} */\nconst layoutAlignVerticalRevInlineCache = new Map();\n\n/**\n * @fileoverview added by tsickle\n * Generated from: flex/module.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n/** @type {?} */\nconst ALL_DIRECTIVES = [\n DefaultLayoutDirective,\n DefaultLayoutGapDirective,\n DefaultLayoutAlignDirective,\n DefaultFlexOrderDirective,\n DefaultFlexOffsetDirective,\n FlexFillDirective,\n DefaultFlexAlignDirective,\n DefaultFlexDirective,\n];\n/**\n * *****************************************************************\n * Define module for the Flex API\n * *****************************************************************\n */\nclass FlexModule {\n}\nFlexModule.ɵfac = function FlexModule_Factory(t) { return new (t || FlexModule)(); };\nFlexModule.ɵmod = /*@__PURE__*/ ɵngcc0.ɵɵdefineNgModule({ type: FlexModule });\nFlexModule.ɵinj = /*@__PURE__*/ ɵngcc0.ɵɵdefineInjector({ imports: [[CoreModule, BidiModule]] });\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(FlexModule, [{\n type: NgModule,\n args: [{\n imports: [CoreModule, BidiModule],\n declarations: [...ALL_DIRECTIVES],\n exports: [...ALL_DIRECTIVES]\n }]\n }], null, null); })();\n(function () { (typeof ngJitMode === \"undefined\" || ngJitMode) && ɵngcc0.ɵɵsetNgModuleScope(FlexModule, { declarations: function () { return [DefaultLayoutDirective, DefaultLayoutGapDirective, DefaultLayoutAlignDirective, DefaultFlexOrderDirective, DefaultFlexOffsetDirective, FlexFillDirective, DefaultFlexAlignDirective, DefaultFlexDirective]; }, imports: function () { return [CoreModule, BidiModule]; }, exports: function () { return [DefaultLayoutDirective, DefaultLayoutGapDirective, DefaultLayoutAlignDirective, DefaultFlexOrderDirective, DefaultFlexOffsetDirective, FlexFillDirective, DefaultFlexAlignDirective, DefaultFlexDirective]; } }); })();\n\n/**\n * @fileoverview added by tsickle\n * Generated from: flex/public-api.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n\n/**\n * @fileoverview added by tsickle\n * Generated from: flex/index.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n\nexport { FlexModule, FlexStyleBuilder, FlexDirective, DefaultFlexDirective, FlexAlignStyleBuilder, FlexAlignDirective, DefaultFlexAlignDirective, FlexFillStyleBuilder, FlexFillDirective, FlexOffsetStyleBuilder, FlexOffsetDirective, DefaultFlexOffsetDirective, FlexOrderStyleBuilder, FlexOrderDirective, DefaultFlexOrderDirective, LayoutStyleBuilder, LayoutDirective, DefaultLayoutDirective, LayoutAlignStyleBuilder, LayoutAlignDirective, DefaultLayoutAlignDirective, LayoutGapStyleBuilder, LayoutGapDirective, DefaultLayoutGapDirective };\n\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\nimport { Directive, ElementRef, Injectable, NgModule, Input, ɵɵdefineInjectable } from '@angular/core';\nimport { MediaMarshaller, BaseDirective2, StyleBuilder, StyleUtils, CoreModule } from '@angular/flex-layout/core';\nimport { coerceBooleanProperty } from '@angular/cdk/coercion';\n\n/**\n * @fileoverview added by tsickle\n * Generated from: grid/grid-align/grid-align.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n/** @type {?} */\nimport * as ɵngcc0 from '@angular/core';\nimport * as ɵngcc1 from '@angular/flex-layout/core';\nconst ROW_DEFAULT = 'stretch';\n/** @type {?} */\nconst COL_DEFAULT = 'stretch';\nclass GridAlignStyleBuilder extends StyleBuilder {\n /**\n * @param {?} input\n * @return {?}\n */\n buildStyles(input) {\n return buildCss(input || ROW_DEFAULT);\n }\n}\nGridAlignStyleBuilder.ɵfac = /*@__PURE__*/ function () { let ɵGridAlignStyleBuilder_BaseFactory; return function GridAlignStyleBuilder_Factory(t) { return (ɵGridAlignStyleBuilder_BaseFactory || (ɵGridAlignStyleBuilder_BaseFactory = ɵngcc0.ɵɵgetInheritedFactory(GridAlignStyleBuilder)))(t || GridAlignStyleBuilder); }; }();\n/** @nocollapse */ GridAlignStyleBuilder.ɵprov = ɵɵdefineInjectable({ factory: function GridAlignStyleBuilder_Factory() { return new GridAlignStyleBuilder(); }, token: GridAlignStyleBuilder, providedIn: \"root\" });\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(GridAlignStyleBuilder, [{\n type: Injectable,\n args: [{ providedIn: 'root' }]\n }], null, null); })();\nclass GridAlignDirective extends BaseDirective2 {\n /**\n * @param {?} elementRef\n * @param {?} styleBuilder\n * @param {?} styler\n * @param {?} marshal\n */\n constructor(elementRef, styleBuilder, styler, marshal) {\n super(elementRef, styleBuilder, styler, marshal);\n this.DIRECTIVE_KEY = 'grid-align';\n this.styleCache = alignCache;\n this.init();\n }\n}\nGridAlignDirective.ɵfac = function GridAlignDirective_Factory(t) { return new (t || GridAlignDirective)(ɵngcc0.ɵɵdirectiveInject(ɵngcc0.ElementRef), ɵngcc0.ɵɵdirectiveInject(GridAlignStyleBuilder), ɵngcc0.ɵɵdirectiveInject(ɵngcc1.StyleUtils), ɵngcc0.ɵɵdirectiveInject(ɵngcc1.MediaMarshaller)); };\nGridAlignDirective.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: GridAlignDirective, features: [ɵngcc0.ɵɵInheritDefinitionFeature] });\n/** @nocollapse */\nGridAlignDirective.ctorParameters = () => [\n { type: ElementRef },\n { type: GridAlignStyleBuilder },\n { type: StyleUtils },\n { type: MediaMarshaller }\n];\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(GridAlignDirective, [{\n type: Directive\n }], function () { return [{ type: ɵngcc0.ElementRef }, { type: GridAlignStyleBuilder }, { type: ɵngcc1.StyleUtils }, { type: ɵngcc1.MediaMarshaller }]; }, null); })();\n/** @type {?} */\nconst alignCache = new Map();\n/** @type {?} */\nconst inputs = [\n 'gdGridAlign',\n 'gdGridAlign.xs', 'gdGridAlign.sm', 'gdGridAlign.md', 'gdGridAlign.lg', 'gdGridAlign.xl',\n 'gdGridAlign.lt-sm', 'gdGridAlign.lt-md', 'gdGridAlign.lt-lg', 'gdGridAlign.lt-xl',\n 'gdGridAlign.gt-xs', 'gdGridAlign.gt-sm', 'gdGridAlign.gt-md', 'gdGridAlign.gt-lg'\n];\n/** @type {?} */\nconst selector = `\n [gdGridAlign],\n [gdGridAlign.xs], [gdGridAlign.sm], [gdGridAlign.md], [gdGridAlign.lg],[gdGridAlign.xl],\n [gdGridAlign.lt-sm], [gdGridAlign.lt-md], [gdGridAlign.lt-lg], [gdGridAlign.lt-xl],\n [gdGridAlign.gt-xs], [gdGridAlign.gt-sm], [gdGridAlign.gt-md], [gdGridAlign.gt-lg]\n`;\n/**\n * 'align' CSS Grid styling directive for grid children\n * Defines positioning of child elements along row and column axis in a grid container\n * Optional values: {row-axis} values or {row-axis column-axis} value pairs\n *\n * @see https://css-tricks.com/snippets/css/complete-guide-grid/#prop-justify-self\n * @see https://css-tricks.com/snippets/css/complete-guide-grid/#prop-align-self\n */\nclass DefaultGridAlignDirective extends GridAlignDirective {\n constructor() {\n super(...arguments);\n this.inputs = inputs;\n }\n}\nDefaultGridAlignDirective.ɵfac = /*@__PURE__*/ function () { let ɵDefaultGridAlignDirective_BaseFactory; return function DefaultGridAlignDirective_Factory(t) { return (ɵDefaultGridAlignDirective_BaseFactory || (ɵDefaultGridAlignDirective_BaseFactory = ɵngcc0.ɵɵgetInheritedFactory(DefaultGridAlignDirective)))(t || DefaultGridAlignDirective); }; }();\nDefaultGridAlignDirective.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: DefaultGridAlignDirective, selectors: [[\"\", \"gdGridAlign\", \"\"], [\"\", \"gdGridAlign.xs\", \"\"], [\"\", \"gdGridAlign.sm\", \"\"], [\"\", \"gdGridAlign.md\", \"\"], [\"\", \"gdGridAlign.lg\", \"\"], [\"\", \"gdGridAlign.xl\", \"\"], [\"\", \"gdGridAlign.lt-sm\", \"\"], [\"\", \"gdGridAlign.lt-md\", \"\"], [\"\", \"gdGridAlign.lt-lg\", \"\"], [\"\", \"gdGridAlign.lt-xl\", \"\"], [\"\", \"gdGridAlign.gt-xs\", \"\"], [\"\", \"gdGridAlign.gt-sm\", \"\"], [\"\", \"gdGridAlign.gt-md\", \"\"], [\"\", \"gdGridAlign.gt-lg\", \"\"]], inputs: { gdGridAlign: \"gdGridAlign\", \"gdGridAlign.xs\": \"gdGridAlign.xs\", \"gdGridAlign.sm\": \"gdGridAlign.sm\", \"gdGridAlign.md\": \"gdGridAlign.md\", \"gdGridAlign.lg\": \"gdGridAlign.lg\", \"gdGridAlign.xl\": \"gdGridAlign.xl\", \"gdGridAlign.lt-sm\": \"gdGridAlign.lt-sm\", \"gdGridAlign.lt-md\": \"gdGridAlign.lt-md\", \"gdGridAlign.lt-lg\": \"gdGridAlign.lt-lg\", \"gdGridAlign.lt-xl\": \"gdGridAlign.lt-xl\", \"gdGridAlign.gt-xs\": \"gdGridAlign.gt-xs\", \"gdGridAlign.gt-sm\": \"gdGridAlign.gt-sm\", \"gdGridAlign.gt-md\": \"gdGridAlign.gt-md\", \"gdGridAlign.gt-lg\": \"gdGridAlign.gt-lg\" }, features: [ɵngcc0.ɵɵInheritDefinitionFeature] });\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(DefaultGridAlignDirective, [{\n type: Directive,\n args: [{ selector, inputs }]\n }], null, null); })();\n/**\n * @param {?=} align\n * @return {?}\n */\nfunction buildCss(align = '') {\n /** @type {?} */\n const css = {};\n const [rowAxis, columnAxis] = align.split(' ');\n // Row axis\n switch (rowAxis) {\n case 'end':\n css['justify-self'] = 'end';\n break;\n case 'center':\n css['justify-self'] = 'center';\n break;\n case 'stretch':\n css['justify-self'] = 'stretch';\n break;\n case 'start':\n css['justify-self'] = 'start';\n break;\n default:\n css['justify-self'] = ROW_DEFAULT; // default row axis\n break;\n }\n // Column axis\n switch (columnAxis) {\n case 'end':\n css['align-self'] = 'end';\n break;\n case 'center':\n css['align-self'] = 'center';\n break;\n case 'stretch':\n css['align-self'] = 'stretch';\n break;\n case 'start':\n css['align-self'] = 'start';\n break;\n default:\n css['align-self'] = COL_DEFAULT; // default column axis\n break;\n }\n return css;\n}\n\n/**\n * @fileoverview added by tsickle\n * Generated from: grid/align-columns/align-columns.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n/** @type {?} */\nconst DEFAULT_MAIN = 'start';\n/** @type {?} */\nconst DEFAULT_CROSS = 'stretch';\nclass GridAlignColumnsStyleBuilder extends StyleBuilder {\n /**\n * @param {?} input\n * @param {?} parent\n * @return {?}\n */\n buildStyles(input, parent) {\n return buildCss$1(input || `${DEFAULT_MAIN} ${DEFAULT_CROSS}`, parent.inline);\n }\n}\nGridAlignColumnsStyleBuilder.ɵfac = /*@__PURE__*/ function () { let ɵGridAlignColumnsStyleBuilder_BaseFactory; return function GridAlignColumnsStyleBuilder_Factory(t) { return (ɵGridAlignColumnsStyleBuilder_BaseFactory || (ɵGridAlignColumnsStyleBuilder_BaseFactory = ɵngcc0.ɵɵgetInheritedFactory(GridAlignColumnsStyleBuilder)))(t || GridAlignColumnsStyleBuilder); }; }();\n/** @nocollapse */ GridAlignColumnsStyleBuilder.ɵprov = ɵɵdefineInjectable({ factory: function GridAlignColumnsStyleBuilder_Factory() { return new GridAlignColumnsStyleBuilder(); }, token: GridAlignColumnsStyleBuilder, providedIn: \"root\" });\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(GridAlignColumnsStyleBuilder, [{\n type: Injectable,\n args: [{ providedIn: 'root' }]\n }], null, null); })();\nclass GridAlignColumnsDirective extends BaseDirective2 {\n /**\n * @param {?} elementRef\n * @param {?} styleBuilder\n * @param {?} styler\n * @param {?} marshal\n */\n constructor(elementRef, styleBuilder, styler, marshal) {\n super(elementRef, styleBuilder, styler, marshal);\n this.DIRECTIVE_KEY = 'grid-align-columns';\n this._inline = false;\n this.init();\n }\n /**\n * @return {?}\n */\n get inline() { return this._inline; }\n /**\n * @param {?} val\n * @return {?}\n */\n set inline(val) { this._inline = coerceBooleanProperty(val); }\n // *********************************************\n // Protected methods\n // *********************************************\n /**\n * @protected\n * @param {?} value\n * @return {?}\n */\n updateWithValue(value) {\n this.styleCache = this.inline ? alignColumnsInlineCache : alignColumnsCache;\n this.addStyles(value, { inline: this.inline });\n }\n}\nGridAlignColumnsDirective.ɵfac = function GridAlignColumnsDirective_Factory(t) { return new (t || GridAlignColumnsDirective)(ɵngcc0.ɵɵdirectiveInject(ɵngcc0.ElementRef), ɵngcc0.ɵɵdirectiveInject(GridAlignColumnsStyleBuilder), ɵngcc0.ɵɵdirectiveInject(ɵngcc1.StyleUtils), ɵngcc0.ɵɵdirectiveInject(ɵngcc1.MediaMarshaller)); };\nGridAlignColumnsDirective.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: GridAlignColumnsDirective, inputs: { inline: [\"gdInline\", \"inline\"] }, features: [ɵngcc0.ɵɵInheritDefinitionFeature] });\n/** @nocollapse */\nGridAlignColumnsDirective.ctorParameters = () => [\n { type: ElementRef },\n { type: GridAlignColumnsStyleBuilder },\n { type: StyleUtils },\n { type: MediaMarshaller }\n];\nGridAlignColumnsDirective.propDecorators = {\n inline: [{ type: Input, args: ['gdInline',] }]\n};\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(GridAlignColumnsDirective, [{\n type: Directive\n }], function () { return [{ type: ɵngcc0.ElementRef }, { type: GridAlignColumnsStyleBuilder }, { type: ɵngcc1.StyleUtils }, { type: ɵngcc1.MediaMarshaller }]; }, { inline: [{\n type: Input,\n args: ['gdInline']\n }] }); })();\n/** @type {?} */\nconst alignColumnsCache = new Map();\n/** @type {?} */\nconst alignColumnsInlineCache = new Map();\n/** @type {?} */\nconst inputs$1 = [\n 'gdAlignColumns',\n 'gdAlignColumns.xs', 'gdAlignColumns.sm', 'gdAlignColumns.md',\n 'gdAlignColumns.lg', 'gdAlignColumns.xl', 'gdAlignColumns.lt-sm',\n 'gdAlignColumns.lt-md', 'gdAlignColumns.lt-lg', 'gdAlignColumns.lt-xl',\n 'gdAlignColumns.gt-xs', 'gdAlignColumns.gt-sm', 'gdAlignColumns.gt-md',\n 'gdAlignColumns.gt-lg'\n];\n/** @type {?} */\nconst selector$1 = `\n [gdAlignColumns],\n [gdAlignColumns.xs], [gdAlignColumns.sm], [gdAlignColumns.md],\n [gdAlignColumns.lg], [gdAlignColumns.xl], [gdAlignColumns.lt-sm],\n [gdAlignColumns.lt-md], [gdAlignColumns.lt-lg], [gdAlignColumns.lt-xl],\n [gdAlignColumns.gt-xs], [gdAlignColumns.gt-sm], [gdAlignColumns.gt-md],\n [gdAlignColumns.gt-lg]\n`;\n/**\n * 'column alignment' CSS Grid styling directive\n * Configures the alignment in the column direction\n * @see https://css-tricks.com/snippets/css/complete-guide-grid/#article-header-id-19\n * @see https://css-tricks.com/snippets/css/complete-guide-grid/#article-header-id-21\n */\nclass DefaultGridAlignColumnsDirective extends GridAlignColumnsDirective {\n constructor() {\n super(...arguments);\n this.inputs = inputs$1;\n }\n}\nDefaultGridAlignColumnsDirective.ɵfac = /*@__PURE__*/ function () { let ɵDefaultGridAlignColumnsDirective_BaseFactory; return function DefaultGridAlignColumnsDirective_Factory(t) { return (ɵDefaultGridAlignColumnsDirective_BaseFactory || (ɵDefaultGridAlignColumnsDirective_BaseFactory = ɵngcc0.ɵɵgetInheritedFactory(DefaultGridAlignColumnsDirective)))(t || DefaultGridAlignColumnsDirective); }; }();\nDefaultGridAlignColumnsDirective.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: DefaultGridAlignColumnsDirective, selectors: [[\"\", \"gdAlignColumns\", \"\"], [\"\", \"gdAlignColumns.xs\", \"\"], [\"\", \"gdAlignColumns.sm\", \"\"], [\"\", \"gdAlignColumns.md\", \"\"], [\"\", \"gdAlignColumns.lg\", \"\"], [\"\", \"gdAlignColumns.xl\", \"\"], [\"\", \"gdAlignColumns.lt-sm\", \"\"], [\"\", \"gdAlignColumns.lt-md\", \"\"], [\"\", \"gdAlignColumns.lt-lg\", \"\"], [\"\", \"gdAlignColumns.lt-xl\", \"\"], [\"\", \"gdAlignColumns.gt-xs\", \"\"], [\"\", \"gdAlignColumns.gt-sm\", \"\"], [\"\", \"gdAlignColumns.gt-md\", \"\"], [\"\", \"gdAlignColumns.gt-lg\", \"\"]], inputs: { gdAlignColumns: \"gdAlignColumns\", \"gdAlignColumns.xs\": \"gdAlignColumns.xs\", \"gdAlignColumns.sm\": \"gdAlignColumns.sm\", \"gdAlignColumns.md\": \"gdAlignColumns.md\", \"gdAlignColumns.lg\": \"gdAlignColumns.lg\", \"gdAlignColumns.xl\": \"gdAlignColumns.xl\", \"gdAlignColumns.lt-sm\": \"gdAlignColumns.lt-sm\", \"gdAlignColumns.lt-md\": \"gdAlignColumns.lt-md\", \"gdAlignColumns.lt-lg\": \"gdAlignColumns.lt-lg\", \"gdAlignColumns.lt-xl\": \"gdAlignColumns.lt-xl\", \"gdAlignColumns.gt-xs\": \"gdAlignColumns.gt-xs\", \"gdAlignColumns.gt-sm\": \"gdAlignColumns.gt-sm\", \"gdAlignColumns.gt-md\": \"gdAlignColumns.gt-md\", \"gdAlignColumns.gt-lg\": \"gdAlignColumns.gt-lg\" }, features: [ɵngcc0.ɵɵInheritDefinitionFeature] });\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(DefaultGridAlignColumnsDirective, [{\n type: Directive,\n args: [{ selector: selector$1, inputs: inputs$1 }]\n }], null, null); })();\n/**\n * @param {?} align\n * @param {?} inline\n * @return {?}\n */\nfunction buildCss$1(align, inline) {\n /** @type {?} */\n const css = {};\n const [mainAxis, crossAxis] = align.split(' ');\n // Main axis\n switch (mainAxis) {\n case 'center':\n css['align-content'] = 'center';\n break;\n case 'space-around':\n css['align-content'] = 'space-around';\n break;\n case 'space-between':\n css['align-content'] = 'space-between';\n break;\n case 'space-evenly':\n css['align-content'] = 'space-evenly';\n break;\n case 'end':\n css['align-content'] = 'end';\n break;\n case 'start':\n css['align-content'] = 'start';\n break;\n case 'stretch':\n css['align-content'] = 'stretch';\n break;\n default:\n css['align-content'] = DEFAULT_MAIN; // default main axis\n break;\n }\n // Cross-axis\n switch (crossAxis) {\n case 'start':\n css['align-items'] = 'start';\n break;\n case 'center':\n css['align-items'] = 'center';\n break;\n case 'end':\n css['align-items'] = 'end';\n break;\n case 'stretch':\n css['align-items'] = 'stretch';\n break;\n default: // 'stretch'\n css['align-items'] = DEFAULT_CROSS; // default cross axis\n break;\n }\n css['display'] = inline ? 'inline-grid' : 'grid';\n return css;\n}\n\n/**\n * @fileoverview added by tsickle\n * Generated from: grid/align-rows/align-rows.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n/** @type {?} */\nconst DEFAULT_MAIN$1 = 'start';\n/** @type {?} */\nconst DEFAULT_CROSS$1 = 'stretch';\nclass GridAlignRowsStyleBuilder extends StyleBuilder {\n /**\n * @param {?} input\n * @param {?} parent\n * @return {?}\n */\n buildStyles(input, parent) {\n return buildCss$2(input || `${DEFAULT_MAIN$1} ${DEFAULT_CROSS$1}`, parent.inline);\n }\n}\nGridAlignRowsStyleBuilder.ɵfac = /*@__PURE__*/ function () { let ɵGridAlignRowsStyleBuilder_BaseFactory; return function GridAlignRowsStyleBuilder_Factory(t) { return (ɵGridAlignRowsStyleBuilder_BaseFactory || (ɵGridAlignRowsStyleBuilder_BaseFactory = ɵngcc0.ɵɵgetInheritedFactory(GridAlignRowsStyleBuilder)))(t || GridAlignRowsStyleBuilder); }; }();\n/** @nocollapse */ GridAlignRowsStyleBuilder.ɵprov = ɵɵdefineInjectable({ factory: function GridAlignRowsStyleBuilder_Factory() { return new GridAlignRowsStyleBuilder(); }, token: GridAlignRowsStyleBuilder, providedIn: \"root\" });\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(GridAlignRowsStyleBuilder, [{\n type: Injectable,\n args: [{ providedIn: 'root' }]\n }], null, null); })();\nclass GridAlignRowsDirective extends BaseDirective2 {\n /**\n * @param {?} elementRef\n * @param {?} styleBuilder\n * @param {?} styler\n * @param {?} marshal\n */\n constructor(elementRef, styleBuilder, styler, marshal) {\n super(elementRef, styleBuilder, styler, marshal);\n this.DIRECTIVE_KEY = 'grid-align-rows';\n this._inline = false;\n this.init();\n }\n /**\n * @return {?}\n */\n get inline() { return this._inline; }\n /**\n * @param {?} val\n * @return {?}\n */\n set inline(val) { this._inline = coerceBooleanProperty(val); }\n // *********************************************\n // Protected methods\n // *********************************************\n /**\n * @protected\n * @param {?} value\n * @return {?}\n */\n updateWithValue(value) {\n this.styleCache = this.inline ? alignRowsInlineCache : alignRowsCache;\n this.addStyles(value, { inline: this.inline });\n }\n}\nGridAlignRowsDirective.ɵfac = function GridAlignRowsDirective_Factory(t) { return new (t || GridAlignRowsDirective)(ɵngcc0.ɵɵdirectiveInject(ɵngcc0.ElementRef), ɵngcc0.ɵɵdirectiveInject(GridAlignRowsStyleBuilder), ɵngcc0.ɵɵdirectiveInject(ɵngcc1.StyleUtils), ɵngcc0.ɵɵdirectiveInject(ɵngcc1.MediaMarshaller)); };\nGridAlignRowsDirective.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: GridAlignRowsDirective, inputs: { inline: [\"gdInline\", \"inline\"] }, features: [ɵngcc0.ɵɵInheritDefinitionFeature] });\n/** @nocollapse */\nGridAlignRowsDirective.ctorParameters = () => [\n { type: ElementRef },\n { type: GridAlignRowsStyleBuilder },\n { type: StyleUtils },\n { type: MediaMarshaller }\n];\nGridAlignRowsDirective.propDecorators = {\n inline: [{ type: Input, args: ['gdInline',] }]\n};\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(GridAlignRowsDirective, [{\n type: Directive\n }], function () { return [{ type: ɵngcc0.ElementRef }, { type: GridAlignRowsStyleBuilder }, { type: ɵngcc1.StyleUtils }, { type: ɵngcc1.MediaMarshaller }]; }, { inline: [{\n type: Input,\n args: ['gdInline']\n }] }); })();\n/** @type {?} */\nconst alignRowsCache = new Map();\n/** @type {?} */\nconst alignRowsInlineCache = new Map();\n/** @type {?} */\nconst inputs$2 = [\n 'gdAlignRows',\n 'gdAlignRows.xs', 'gdAlignRows.sm', 'gdAlignRows.md',\n 'gdAlignRows.lg', 'gdAlignRows.xl', 'gdAlignRows.lt-sm',\n 'gdAlignRows.lt-md', 'gdAlignRows.lt-lg', 'gdAlignRows.lt-xl',\n 'gdAlignRows.gt-xs', 'gdAlignRows.gt-sm', 'gdAlignRows.gt-md',\n 'gdAlignRows.gt-lg'\n];\n/** @type {?} */\nconst selector$2 = `\n [gdAlignRows],\n [gdAlignRows.xs], [gdAlignRows.sm], [gdAlignRows.md],\n [gdAlignRows.lg], [gdAlignRows.xl], [gdAlignRows.lt-sm],\n [gdAlignRows.lt-md], [gdAlignRows.lt-lg], [gdAlignRows.lt-xl],\n [gdAlignRows.gt-xs], [gdAlignRows.gt-sm], [gdAlignRows.gt-md],\n [gdAlignRows.gt-lg]\n`;\n/**\n * 'row alignment' CSS Grid styling directive\n * Configures the alignment in the row direction\n * @see https://css-tricks.com/snippets/css/complete-guide-grid/#article-header-id-18\n * @see https://css-tricks.com/snippets/css/complete-guide-grid/#article-header-id-20\n */\nclass DefaultGridAlignRowsDirective extends GridAlignRowsDirective {\n constructor() {\n super(...arguments);\n this.inputs = inputs$2;\n }\n}\nDefaultGridAlignRowsDirective.ɵfac = /*@__PURE__*/ function () { let ɵDefaultGridAlignRowsDirective_BaseFactory; return function DefaultGridAlignRowsDirective_Factory(t) { return (ɵDefaultGridAlignRowsDirective_BaseFactory || (ɵDefaultGridAlignRowsDirective_BaseFactory = ɵngcc0.ɵɵgetInheritedFactory(DefaultGridAlignRowsDirective)))(t || DefaultGridAlignRowsDirective); }; }();\nDefaultGridAlignRowsDirective.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: DefaultGridAlignRowsDirective, selectors: [[\"\", \"gdAlignRows\", \"\"], [\"\", \"gdAlignRows.xs\", \"\"], [\"\", \"gdAlignRows.sm\", \"\"], [\"\", \"gdAlignRows.md\", \"\"], [\"\", \"gdAlignRows.lg\", \"\"], [\"\", \"gdAlignRows.xl\", \"\"], [\"\", \"gdAlignRows.lt-sm\", \"\"], [\"\", \"gdAlignRows.lt-md\", \"\"], [\"\", \"gdAlignRows.lt-lg\", \"\"], [\"\", \"gdAlignRows.lt-xl\", \"\"], [\"\", \"gdAlignRows.gt-xs\", \"\"], [\"\", \"gdAlignRows.gt-sm\", \"\"], [\"\", \"gdAlignRows.gt-md\", \"\"], [\"\", \"gdAlignRows.gt-lg\", \"\"]], inputs: { gdAlignRows: \"gdAlignRows\", \"gdAlignRows.xs\": \"gdAlignRows.xs\", \"gdAlignRows.sm\": \"gdAlignRows.sm\", \"gdAlignRows.md\": \"gdAlignRows.md\", \"gdAlignRows.lg\": \"gdAlignRows.lg\", \"gdAlignRows.xl\": \"gdAlignRows.xl\", \"gdAlignRows.lt-sm\": \"gdAlignRows.lt-sm\", \"gdAlignRows.lt-md\": \"gdAlignRows.lt-md\", \"gdAlignRows.lt-lg\": \"gdAlignRows.lt-lg\", \"gdAlignRows.lt-xl\": \"gdAlignRows.lt-xl\", \"gdAlignRows.gt-xs\": \"gdAlignRows.gt-xs\", \"gdAlignRows.gt-sm\": \"gdAlignRows.gt-sm\", \"gdAlignRows.gt-md\": \"gdAlignRows.gt-md\", \"gdAlignRows.gt-lg\": \"gdAlignRows.gt-lg\" }, features: [ɵngcc0.ɵɵInheritDefinitionFeature] });\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(DefaultGridAlignRowsDirective, [{\n type: Directive,\n args: [{ selector: selector$2, inputs: inputs$2 }]\n }], null, null); })();\n/**\n * @param {?} align\n * @param {?} inline\n * @return {?}\n */\nfunction buildCss$2(align, inline) {\n /** @type {?} */\n const css = {};\n const [mainAxis, crossAxis] = align.split(' ');\n // Main axis\n switch (mainAxis) {\n case 'center':\n case 'space-around':\n case 'space-between':\n case 'space-evenly':\n case 'end':\n case 'start':\n case 'stretch':\n css['justify-content'] = mainAxis;\n break;\n default:\n css['justify-content'] = DEFAULT_MAIN$1; // default main axis\n break;\n }\n // Cross-axis\n switch (crossAxis) {\n case 'start':\n case 'center':\n case 'end':\n case 'stretch':\n css['justify-items'] = crossAxis;\n break;\n default: // 'stretch'\n css['justify-items'] = DEFAULT_CROSS$1; // default cross axis\n break;\n }\n css['display'] = inline ? 'inline-grid' : 'grid';\n return css;\n}\n\n/**\n * @fileoverview added by tsickle\n * Generated from: grid/area/area.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n/** @type {?} */\nconst DEFAULT_VALUE = 'auto';\nclass GridAreaStyleBuilder extends StyleBuilder {\n /**\n * @param {?} input\n * @return {?}\n */\n buildStyles(input) {\n return { 'grid-area': input || DEFAULT_VALUE };\n }\n}\nGridAreaStyleBuilder.ɵfac = /*@__PURE__*/ function () { let ɵGridAreaStyleBuilder_BaseFactory; return function GridAreaStyleBuilder_Factory(t) { return (ɵGridAreaStyleBuilder_BaseFactory || (ɵGridAreaStyleBuilder_BaseFactory = ɵngcc0.ɵɵgetInheritedFactory(GridAreaStyleBuilder)))(t || GridAreaStyleBuilder); }; }();\n/** @nocollapse */ GridAreaStyleBuilder.ɵprov = ɵɵdefineInjectable({ factory: function GridAreaStyleBuilder_Factory() { return new GridAreaStyleBuilder(); }, token: GridAreaStyleBuilder, providedIn: \"root\" });\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(GridAreaStyleBuilder, [{\n type: Injectable,\n args: [{ providedIn: 'root' }]\n }], null, null); })();\nclass GridAreaDirective extends BaseDirective2 {\n /**\n * @param {?} elRef\n * @param {?} styleUtils\n * @param {?} styleBuilder\n * @param {?} marshal\n */\n constructor(elRef, styleUtils, styleBuilder, marshal) {\n super(elRef, styleBuilder, styleUtils, marshal);\n this.DIRECTIVE_KEY = 'grid-area';\n this.styleCache = gridAreaCache;\n this.init();\n }\n}\nGridAreaDirective.ɵfac = function GridAreaDirective_Factory(t) { return new (t || GridAreaDirective)(ɵngcc0.ɵɵdirectiveInject(ɵngcc0.ElementRef), ɵngcc0.ɵɵdirectiveInject(ɵngcc1.StyleUtils), ɵngcc0.ɵɵdirectiveInject(GridAreaStyleBuilder), ɵngcc0.ɵɵdirectiveInject(ɵngcc1.MediaMarshaller)); };\nGridAreaDirective.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: GridAreaDirective, features: [ɵngcc0.ɵɵInheritDefinitionFeature] });\n/** @nocollapse */\nGridAreaDirective.ctorParameters = () => [\n { type: ElementRef },\n { type: StyleUtils },\n { type: GridAreaStyleBuilder },\n { type: MediaMarshaller }\n];\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(GridAreaDirective, [{\n type: Directive\n }], function () { return [{ type: ɵngcc0.ElementRef }, { type: ɵngcc1.StyleUtils }, { type: GridAreaStyleBuilder }, { type: ɵngcc1.MediaMarshaller }]; }, null); })();\n/** @type {?} */\nconst gridAreaCache = new Map();\n/** @type {?} */\nconst inputs$3 = [\n 'gdArea',\n 'gdArea.xs', 'gdArea.sm', 'gdArea.md', 'gdArea.lg', 'gdArea.xl',\n 'gdArea.lt-sm', 'gdArea.lt-md', 'gdArea.lt-lg', 'gdArea.lt-xl',\n 'gdArea.gt-xs', 'gdArea.gt-sm', 'gdArea.gt-md', 'gdArea.gt-lg'\n];\n/** @type {?} */\nconst selector$3 = `\n [gdArea],\n [gdArea.xs], [gdArea.sm], [gdArea.md], [gdArea.lg], [gdArea.xl],\n [gdArea.lt-sm], [gdArea.lt-md], [gdArea.lt-lg], [gdArea.lt-xl],\n [gdArea.gt-xs], [gdArea.gt-sm], [gdArea.gt-md], [gdArea.gt-lg]\n`;\n/**\n * 'grid-area' CSS Grid styling directive\n * Configures the name or position of an element within the grid\n * @see https://css-tricks.com/snippets/css/complete-guide-grid/#article-header-id-27\n */\nclass DefaultGridAreaDirective extends GridAreaDirective {\n constructor() {\n super(...arguments);\n this.inputs = inputs$3;\n }\n}\nDefaultGridAreaDirective.ɵfac = /*@__PURE__*/ function () { let ɵDefaultGridAreaDirective_BaseFactory; return function DefaultGridAreaDirective_Factory(t) { return (ɵDefaultGridAreaDirective_BaseFactory || (ɵDefaultGridAreaDirective_BaseFactory = ɵngcc0.ɵɵgetInheritedFactory(DefaultGridAreaDirective)))(t || DefaultGridAreaDirective); }; }();\nDefaultGridAreaDirective.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: DefaultGridAreaDirective, selectors: [[\"\", \"gdArea\", \"\"], [\"\", \"gdArea.xs\", \"\"], [\"\", \"gdArea.sm\", \"\"], [\"\", \"gdArea.md\", \"\"], [\"\", \"gdArea.lg\", \"\"], [\"\", \"gdArea.xl\", \"\"], [\"\", \"gdArea.lt-sm\", \"\"], [\"\", \"gdArea.lt-md\", \"\"], [\"\", \"gdArea.lt-lg\", \"\"], [\"\", \"gdArea.lt-xl\", \"\"], [\"\", \"gdArea.gt-xs\", \"\"], [\"\", \"gdArea.gt-sm\", \"\"], [\"\", \"gdArea.gt-md\", \"\"], [\"\", \"gdArea.gt-lg\", \"\"]], inputs: { gdArea: \"gdArea\", \"gdArea.xs\": \"gdArea.xs\", \"gdArea.sm\": \"gdArea.sm\", \"gdArea.md\": \"gdArea.md\", \"gdArea.lg\": \"gdArea.lg\", \"gdArea.xl\": \"gdArea.xl\", \"gdArea.lt-sm\": \"gdArea.lt-sm\", \"gdArea.lt-md\": \"gdArea.lt-md\", \"gdArea.lt-lg\": \"gdArea.lt-lg\", \"gdArea.lt-xl\": \"gdArea.lt-xl\", \"gdArea.gt-xs\": \"gdArea.gt-xs\", \"gdArea.gt-sm\": \"gdArea.gt-sm\", \"gdArea.gt-md\": \"gdArea.gt-md\", \"gdArea.gt-lg\": \"gdArea.gt-lg\" }, features: [ɵngcc0.ɵɵInheritDefinitionFeature] });\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(DefaultGridAreaDirective, [{\n type: Directive,\n args: [{ selector: selector$3, inputs: inputs$3 }]\n }], null, null); })();\n\n/**\n * @fileoverview added by tsickle\n * Generated from: grid/areas/areas.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n/** @type {?} */\nconst DEFAULT_VALUE$1 = 'none';\n/** @type {?} */\nconst DELIMETER = '|';\nclass GridAreasStyleBuiler extends StyleBuilder {\n /**\n * @param {?} input\n * @param {?} parent\n * @return {?}\n */\n buildStyles(input, parent) {\n /** @type {?} */\n const areas = (input || DEFAULT_VALUE$1).split(DELIMETER).map((/**\n * @param {?} v\n * @return {?}\n */\n v => `\"${v.trim()}\"`));\n return {\n 'display': parent.inline ? 'inline-grid' : 'grid',\n 'grid-template-areas': areas.join(' ')\n };\n }\n}\nGridAreasStyleBuiler.ɵfac = /*@__PURE__*/ function () { let ɵGridAreasStyleBuiler_BaseFactory; return function GridAreasStyleBuiler_Factory(t) { return (ɵGridAreasStyleBuiler_BaseFactory || (ɵGridAreasStyleBuiler_BaseFactory = ɵngcc0.ɵɵgetInheritedFactory(GridAreasStyleBuiler)))(t || GridAreasStyleBuiler); }; }();\n/** @nocollapse */ GridAreasStyleBuiler.ɵprov = ɵɵdefineInjectable({ factory: function GridAreasStyleBuiler_Factory() { return new GridAreasStyleBuiler(); }, token: GridAreasStyleBuiler, providedIn: \"root\" });\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(GridAreasStyleBuiler, [{\n type: Injectable,\n args: [{ providedIn: 'root' }]\n }], null, null); })();\nclass GridAreasDirective extends BaseDirective2 {\n /**\n * @param {?} elRef\n * @param {?} styleUtils\n * @param {?} styleBuilder\n * @param {?} marshal\n */\n constructor(elRef, styleUtils, styleBuilder, marshal) {\n super(elRef, styleBuilder, styleUtils, marshal);\n this.DIRECTIVE_KEY = 'grid-areas';\n this._inline = false;\n this.init();\n }\n /**\n * @return {?}\n */\n get inline() { return this._inline; }\n /**\n * @param {?} val\n * @return {?}\n */\n set inline(val) { this._inline = coerceBooleanProperty(val); }\n // *********************************************\n // Protected methods\n // *********************************************\n /**\n * @protected\n * @param {?} value\n * @return {?}\n */\n updateWithValue(value) {\n this.styleCache = this.inline ? areasInlineCache : areasCache;\n this.addStyles(value, { inline: this.inline });\n }\n}\nGridAreasDirective.ɵfac = function GridAreasDirective_Factory(t) { return new (t || GridAreasDirective)(ɵngcc0.ɵɵdirectiveInject(ɵngcc0.ElementRef), ɵngcc0.ɵɵdirectiveInject(ɵngcc1.StyleUtils), ɵngcc0.ɵɵdirectiveInject(GridAreasStyleBuiler), ɵngcc0.ɵɵdirectiveInject(ɵngcc1.MediaMarshaller)); };\nGridAreasDirective.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: GridAreasDirective, inputs: { inline: [\"gdInline\", \"inline\"] }, features: [ɵngcc0.ɵɵInheritDefinitionFeature] });\n/** @nocollapse */\nGridAreasDirective.ctorParameters = () => [\n { type: ElementRef },\n { type: StyleUtils },\n { type: GridAreasStyleBuiler },\n { type: MediaMarshaller }\n];\nGridAreasDirective.propDecorators = {\n inline: [{ type: Input, args: ['gdInline',] }]\n};\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(GridAreasDirective, [{\n type: Directive\n }], function () { return [{ type: ɵngcc0.ElementRef }, { type: ɵngcc1.StyleUtils }, { type: GridAreasStyleBuiler }, { type: ɵngcc1.MediaMarshaller }]; }, { inline: [{\n type: Input,\n args: ['gdInline']\n }] }); })();\n/** @type {?} */\nconst areasCache = new Map();\n/** @type {?} */\nconst areasInlineCache = new Map();\n/** @type {?} */\nconst inputs$4 = [\n 'gdAreas',\n 'gdAreas.xs', 'gdAreas.sm', 'gdAreas.md', 'gdAreas.lg', 'gdAreas.xl',\n 'gdAreas.lt-sm', 'gdAreas.lt-md', 'gdAreas.lt-lg', 'gdAreas.lt-xl',\n 'gdAreas.gt-xs', 'gdAreas.gt-sm', 'gdAreas.gt-md', 'gdAreas.gt-lg'\n];\n/** @type {?} */\nconst selector$4 = `\n [gdAreas],\n [gdAreas.xs], [gdAreas.sm], [gdAreas.md], [gdAreas.lg], [gdAreas.xl],\n [gdAreas.lt-sm], [gdAreas.lt-md], [gdAreas.lt-lg], [gdAreas.lt-xl],\n [gdAreas.gt-xs], [gdAreas.gt-sm], [gdAreas.gt-md], [gdAreas.gt-lg]\n`;\n/**\n * 'grid-template-areas' CSS Grid styling directive\n * Configures the names of elements within the grid\n * @see https://css-tricks.com/snippets/css/complete-guide-grid/#article-header-id-14\n */\nclass DefaultGridAreasDirective extends GridAreasDirective {\n constructor() {\n super(...arguments);\n this.inputs = inputs$4;\n }\n}\nDefaultGridAreasDirective.ɵfac = /*@__PURE__*/ function () { let ɵDefaultGridAreasDirective_BaseFactory; return function DefaultGridAreasDirective_Factory(t) { return (ɵDefaultGridAreasDirective_BaseFactory || (ɵDefaultGridAreasDirective_BaseFactory = ɵngcc0.ɵɵgetInheritedFactory(DefaultGridAreasDirective)))(t || DefaultGridAreasDirective); }; }();\nDefaultGridAreasDirective.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: DefaultGridAreasDirective, selectors: [[\"\", \"gdAreas\", \"\"], [\"\", \"gdAreas.xs\", \"\"], [\"\", \"gdAreas.sm\", \"\"], [\"\", \"gdAreas.md\", \"\"], [\"\", \"gdAreas.lg\", \"\"], [\"\", \"gdAreas.xl\", \"\"], [\"\", \"gdAreas.lt-sm\", \"\"], [\"\", \"gdAreas.lt-md\", \"\"], [\"\", \"gdAreas.lt-lg\", \"\"], [\"\", \"gdAreas.lt-xl\", \"\"], [\"\", \"gdAreas.gt-xs\", \"\"], [\"\", \"gdAreas.gt-sm\", \"\"], [\"\", \"gdAreas.gt-md\", \"\"], [\"\", \"gdAreas.gt-lg\", \"\"]], inputs: { gdAreas: \"gdAreas\", \"gdAreas.xs\": \"gdAreas.xs\", \"gdAreas.sm\": \"gdAreas.sm\", \"gdAreas.md\": \"gdAreas.md\", \"gdAreas.lg\": \"gdAreas.lg\", \"gdAreas.xl\": \"gdAreas.xl\", \"gdAreas.lt-sm\": \"gdAreas.lt-sm\", \"gdAreas.lt-md\": \"gdAreas.lt-md\", \"gdAreas.lt-lg\": \"gdAreas.lt-lg\", \"gdAreas.lt-xl\": \"gdAreas.lt-xl\", \"gdAreas.gt-xs\": \"gdAreas.gt-xs\", \"gdAreas.gt-sm\": \"gdAreas.gt-sm\", \"gdAreas.gt-md\": \"gdAreas.gt-md\", \"gdAreas.gt-lg\": \"gdAreas.gt-lg\" }, features: [ɵngcc0.ɵɵInheritDefinitionFeature] });\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(DefaultGridAreasDirective, [{\n type: Directive,\n args: [{ selector: selector$4, inputs: inputs$4 }]\n }], null, null); })();\n\n/**\n * @fileoverview added by tsickle\n * Generated from: grid/auto/auto.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n/** @type {?} */\nconst DEFAULT_VALUE$2 = 'initial';\nclass GridAutoStyleBuilder extends StyleBuilder {\n /**\n * @param {?} input\n * @param {?} parent\n * @return {?}\n */\n buildStyles(input, parent) {\n let [direction, dense] = (input || DEFAULT_VALUE$2).split(' ');\n if (direction !== 'column' && direction !== 'row' && direction !== 'dense') {\n direction = 'row';\n }\n dense = (dense === 'dense' && direction !== 'dense') ? ' dense' : '';\n return {\n 'display': parent.inline ? 'inline-grid' : 'grid',\n 'grid-auto-flow': direction + dense\n };\n }\n}\nGridAutoStyleBuilder.ɵfac = /*@__PURE__*/ function () { let ɵGridAutoStyleBuilder_BaseFactory; return function GridAutoStyleBuilder_Factory(t) { return (ɵGridAutoStyleBuilder_BaseFactory || (ɵGridAutoStyleBuilder_BaseFactory = ɵngcc0.ɵɵgetInheritedFactory(GridAutoStyleBuilder)))(t || GridAutoStyleBuilder); }; }();\n/** @nocollapse */ GridAutoStyleBuilder.ɵprov = ɵɵdefineInjectable({ factory: function GridAutoStyleBuilder_Factory() { return new GridAutoStyleBuilder(); }, token: GridAutoStyleBuilder, providedIn: \"root\" });\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(GridAutoStyleBuilder, [{\n type: Injectable,\n args: [{ providedIn: 'root' }]\n }], null, null); })();\nclass GridAutoDirective extends BaseDirective2 {\n /**\n * @param {?} elementRef\n * @param {?} styleBuilder\n * @param {?} styler\n * @param {?} marshal\n */\n constructor(elementRef, styleBuilder, styler, marshal) {\n super(elementRef, styleBuilder, styler, marshal);\n this._inline = false;\n this.DIRECTIVE_KEY = 'grid-auto';\n this.init();\n }\n /**\n * @return {?}\n */\n get inline() { return this._inline; }\n /**\n * @param {?} val\n * @return {?}\n */\n set inline(val) { this._inline = coerceBooleanProperty(val); }\n // *********************************************\n // Protected methods\n // *********************************************\n /**\n * @protected\n * @param {?} value\n * @return {?}\n */\n updateWithValue(value) {\n this.styleCache = this.inline ? autoInlineCache : autoCache;\n this.addStyles(value, { inline: this.inline });\n }\n}\nGridAutoDirective.ɵfac = function GridAutoDirective_Factory(t) { return new (t || GridAutoDirective)(ɵngcc0.ɵɵdirectiveInject(ɵngcc0.ElementRef), ɵngcc0.ɵɵdirectiveInject(GridAutoStyleBuilder), ɵngcc0.ɵɵdirectiveInject(ɵngcc1.StyleUtils), ɵngcc0.ɵɵdirectiveInject(ɵngcc1.MediaMarshaller)); };\nGridAutoDirective.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: GridAutoDirective, inputs: { inline: [\"gdInline\", \"inline\"] }, features: [ɵngcc0.ɵɵInheritDefinitionFeature] });\n/** @nocollapse */\nGridAutoDirective.ctorParameters = () => [\n { type: ElementRef },\n { type: GridAutoStyleBuilder },\n { type: StyleUtils },\n { type: MediaMarshaller }\n];\nGridAutoDirective.propDecorators = {\n inline: [{ type: Input, args: ['gdInline',] }]\n};\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(GridAutoDirective, [{\n type: Directive\n }], function () { return [{ type: ɵngcc0.ElementRef }, { type: GridAutoStyleBuilder }, { type: ɵngcc1.StyleUtils }, { type: ɵngcc1.MediaMarshaller }]; }, { inline: [{\n type: Input,\n args: ['gdInline']\n }] }); })();\n/** @type {?} */\nconst autoCache = new Map();\n/** @type {?} */\nconst autoInlineCache = new Map();\n/** @type {?} */\nconst inputs$5 = [\n 'gdAuto',\n 'gdAuto.xs', 'gdAuto.sm', 'gdAuto.md', 'gdAuto.lg', 'gdAuto.xl',\n 'gdAuto.lt-sm', 'gdAuto.lt-md', 'gdAuto.lt-lg', 'gdAuto.lt-xl',\n 'gdAuto.gt-xs', 'gdAuto.gt-sm', 'gdAuto.gt-md', 'gdAuto.gt-lg'\n];\n/** @type {?} */\nconst selector$5 = `\n [gdAuto],\n [gdAuto.xs], [gdAuto.sm], [gdAuto.md], [gdAuto.lg], [gdAuto.xl],\n [gdAuto.lt-sm], [gdAuto.lt-md], [gdAuto.lt-lg], [gdAuto.lt-xl],\n [gdAuto.gt-xs], [gdAuto.gt-sm], [gdAuto.gt-md], [gdAuto.gt-lg]\n`;\n/**\n * 'grid-auto-flow' CSS Grid styling directive\n * Configures the auto placement algorithm for the grid\n * @see https://css-tricks.com/snippets/css/complete-guide-grid/#article-header-id-23\n */\nclass DefaultGridAutoDirective extends GridAutoDirective {\n constructor() {\n super(...arguments);\n this.inputs = inputs$5;\n }\n}\nDefaultGridAutoDirective.ɵfac = /*@__PURE__*/ function () { let ɵDefaultGridAutoDirective_BaseFactory; return function DefaultGridAutoDirective_Factory(t) { return (ɵDefaultGridAutoDirective_BaseFactory || (ɵDefaultGridAutoDirective_BaseFactory = ɵngcc0.ɵɵgetInheritedFactory(DefaultGridAutoDirective)))(t || DefaultGridAutoDirective); }; }();\nDefaultGridAutoDirective.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: DefaultGridAutoDirective, selectors: [[\"\", \"gdAuto\", \"\"], [\"\", \"gdAuto.xs\", \"\"], [\"\", \"gdAuto.sm\", \"\"], [\"\", \"gdAuto.md\", \"\"], [\"\", \"gdAuto.lg\", \"\"], [\"\", \"gdAuto.xl\", \"\"], [\"\", \"gdAuto.lt-sm\", \"\"], [\"\", \"gdAuto.lt-md\", \"\"], [\"\", \"gdAuto.lt-lg\", \"\"], [\"\", \"gdAuto.lt-xl\", \"\"], [\"\", \"gdAuto.gt-xs\", \"\"], [\"\", \"gdAuto.gt-sm\", \"\"], [\"\", \"gdAuto.gt-md\", \"\"], [\"\", \"gdAuto.gt-lg\", \"\"]], inputs: { gdAuto: \"gdAuto\", \"gdAuto.xs\": \"gdAuto.xs\", \"gdAuto.sm\": \"gdAuto.sm\", \"gdAuto.md\": \"gdAuto.md\", \"gdAuto.lg\": \"gdAuto.lg\", \"gdAuto.xl\": \"gdAuto.xl\", \"gdAuto.lt-sm\": \"gdAuto.lt-sm\", \"gdAuto.lt-md\": \"gdAuto.lt-md\", \"gdAuto.lt-lg\": \"gdAuto.lt-lg\", \"gdAuto.lt-xl\": \"gdAuto.lt-xl\", \"gdAuto.gt-xs\": \"gdAuto.gt-xs\", \"gdAuto.gt-sm\": \"gdAuto.gt-sm\", \"gdAuto.gt-md\": \"gdAuto.gt-md\", \"gdAuto.gt-lg\": \"gdAuto.gt-lg\" }, features: [ɵngcc0.ɵɵInheritDefinitionFeature] });\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(DefaultGridAutoDirective, [{\n type: Directive,\n args: [{ selector: selector$5, inputs: inputs$5 }]\n }], null, null); })();\n\n/**\n * @fileoverview added by tsickle\n * Generated from: grid/column/column.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n/** @type {?} */\nconst DEFAULT_VALUE$3 = 'auto';\nclass GridColumnStyleBuilder extends StyleBuilder {\n /**\n * @param {?} input\n * @return {?}\n */\n buildStyles(input) {\n return { 'grid-column': input || DEFAULT_VALUE$3 };\n }\n}\nGridColumnStyleBuilder.ɵfac = /*@__PURE__*/ function () { let ɵGridColumnStyleBuilder_BaseFactory; return function GridColumnStyleBuilder_Factory(t) { return (ɵGridColumnStyleBuilder_BaseFactory || (ɵGridColumnStyleBuilder_BaseFactory = ɵngcc0.ɵɵgetInheritedFactory(GridColumnStyleBuilder)))(t || GridColumnStyleBuilder); }; }();\n/** @nocollapse */ GridColumnStyleBuilder.ɵprov = ɵɵdefineInjectable({ factory: function GridColumnStyleBuilder_Factory() { return new GridColumnStyleBuilder(); }, token: GridColumnStyleBuilder, providedIn: \"root\" });\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(GridColumnStyleBuilder, [{\n type: Injectable,\n args: [{ providedIn: 'root' }]\n }], null, null); })();\nclass GridColumnDirective extends BaseDirective2 {\n /**\n * @param {?} elementRef\n * @param {?} styleBuilder\n * @param {?} styler\n * @param {?} marshal\n */\n constructor(elementRef, styleBuilder, styler, marshal) {\n super(elementRef, styleBuilder, styler, marshal);\n this.DIRECTIVE_KEY = 'grid-column';\n this.styleCache = columnCache;\n this.init();\n }\n}\nGridColumnDirective.ɵfac = function GridColumnDirective_Factory(t) { return new (t || GridColumnDirective)(ɵngcc0.ɵɵdirectiveInject(ɵngcc0.ElementRef), ɵngcc0.ɵɵdirectiveInject(GridColumnStyleBuilder), ɵngcc0.ɵɵdirectiveInject(ɵngcc1.StyleUtils), ɵngcc0.ɵɵdirectiveInject(ɵngcc1.MediaMarshaller)); };\nGridColumnDirective.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: GridColumnDirective, features: [ɵngcc0.ɵɵInheritDefinitionFeature] });\n/** @nocollapse */\nGridColumnDirective.ctorParameters = () => [\n { type: ElementRef },\n { type: GridColumnStyleBuilder },\n { type: StyleUtils },\n { type: MediaMarshaller }\n];\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(GridColumnDirective, [{\n type: Directive\n }], function () { return [{ type: ɵngcc0.ElementRef }, { type: GridColumnStyleBuilder }, { type: ɵngcc1.StyleUtils }, { type: ɵngcc1.MediaMarshaller }]; }, null); })();\n/** @type {?} */\nconst columnCache = new Map();\n/** @type {?} */\nconst inputs$6 = [\n 'gdColumn',\n 'gdColumn.xs', 'gdColumn.sm', 'gdColumn.md', 'gdColumn.lg', 'gdColumn.xl',\n 'gdColumn.lt-sm', 'gdColumn.lt-md', 'gdColumn.lt-lg', 'gdColumn.lt-xl',\n 'gdColumn.gt-xs', 'gdColumn.gt-sm', 'gdColumn.gt-md', 'gdColumn.gt-lg'\n];\n/** @type {?} */\nconst selector$6 = `\n [gdColumn],\n [gdColumn.xs], [gdColumn.sm], [gdColumn.md], [gdColumn.lg], [gdColumn.xl],\n [gdColumn.lt-sm], [gdColumn.lt-md], [gdColumn.lt-lg], [gdColumn.lt-xl],\n [gdColumn.gt-xs], [gdColumn.gt-sm], [gdColumn.gt-md], [gdColumn.gt-lg]\n`;\n/**\n * 'grid-column' CSS Grid styling directive\n * Configures the name or position of an element within the grid\n * @see https://css-tricks.com/snippets/css/complete-guide-grid/#article-header-id-26\n */\nclass DefaultGridColumnDirective extends GridColumnDirective {\n constructor() {\n super(...arguments);\n this.inputs = inputs$6;\n }\n}\nDefaultGridColumnDirective.ɵfac = /*@__PURE__*/ function () { let ɵDefaultGridColumnDirective_BaseFactory; return function DefaultGridColumnDirective_Factory(t) { return (ɵDefaultGridColumnDirective_BaseFactory || (ɵDefaultGridColumnDirective_BaseFactory = ɵngcc0.ɵɵgetInheritedFactory(DefaultGridColumnDirective)))(t || DefaultGridColumnDirective); }; }();\nDefaultGridColumnDirective.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: DefaultGridColumnDirective, selectors: [[\"\", \"gdColumn\", \"\"], [\"\", \"gdColumn.xs\", \"\"], [\"\", \"gdColumn.sm\", \"\"], [\"\", \"gdColumn.md\", \"\"], [\"\", \"gdColumn.lg\", \"\"], [\"\", \"gdColumn.xl\", \"\"], [\"\", \"gdColumn.lt-sm\", \"\"], [\"\", \"gdColumn.lt-md\", \"\"], [\"\", \"gdColumn.lt-lg\", \"\"], [\"\", \"gdColumn.lt-xl\", \"\"], [\"\", \"gdColumn.gt-xs\", \"\"], [\"\", \"gdColumn.gt-sm\", \"\"], [\"\", \"gdColumn.gt-md\", \"\"], [\"\", \"gdColumn.gt-lg\", \"\"]], inputs: { gdColumn: \"gdColumn\", \"gdColumn.xs\": \"gdColumn.xs\", \"gdColumn.sm\": \"gdColumn.sm\", \"gdColumn.md\": \"gdColumn.md\", \"gdColumn.lg\": \"gdColumn.lg\", \"gdColumn.xl\": \"gdColumn.xl\", \"gdColumn.lt-sm\": \"gdColumn.lt-sm\", \"gdColumn.lt-md\": \"gdColumn.lt-md\", \"gdColumn.lt-lg\": \"gdColumn.lt-lg\", \"gdColumn.lt-xl\": \"gdColumn.lt-xl\", \"gdColumn.gt-xs\": \"gdColumn.gt-xs\", \"gdColumn.gt-sm\": \"gdColumn.gt-sm\", \"gdColumn.gt-md\": \"gdColumn.gt-md\", \"gdColumn.gt-lg\": \"gdColumn.gt-lg\" }, features: [ɵngcc0.ɵɵInheritDefinitionFeature] });\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(DefaultGridColumnDirective, [{\n type: Directive,\n args: [{ selector: selector$6, inputs: inputs$6 }]\n }], null, null); })();\n\n/**\n * @fileoverview added by tsickle\n * Generated from: grid/columns/columns.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n/** @type {?} */\nconst DEFAULT_VALUE$4 = 'none';\n/** @type {?} */\nconst AUTO_SPECIFIER = '!';\nclass GridColumnsStyleBuilder extends StyleBuilder {\n /**\n * @param {?} input\n * @param {?} parent\n * @return {?}\n */\n buildStyles(input, parent) {\n input = input || DEFAULT_VALUE$4;\n /** @type {?} */\n let auto = false;\n if (input.endsWith(AUTO_SPECIFIER)) {\n input = input.substring(0, input.indexOf(AUTO_SPECIFIER));\n auto = true;\n }\n /** @type {?} */\n const css = {\n 'display': parent.inline ? 'inline-grid' : 'grid',\n 'grid-auto-columns': '',\n 'grid-template-columns': '',\n };\n /** @type {?} */\n const key = (auto ? 'grid-auto-columns' : 'grid-template-columns');\n css[key] = input;\n return css;\n }\n}\nGridColumnsStyleBuilder.ɵfac = /*@__PURE__*/ function () { let ɵGridColumnsStyleBuilder_BaseFactory; return function GridColumnsStyleBuilder_Factory(t) { return (ɵGridColumnsStyleBuilder_BaseFactory || (ɵGridColumnsStyleBuilder_BaseFactory = ɵngcc0.ɵɵgetInheritedFactory(GridColumnsStyleBuilder)))(t || GridColumnsStyleBuilder); }; }();\n/** @nocollapse */ GridColumnsStyleBuilder.ɵprov = ɵɵdefineInjectable({ factory: function GridColumnsStyleBuilder_Factory() { return new GridColumnsStyleBuilder(); }, token: GridColumnsStyleBuilder, providedIn: \"root\" });\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(GridColumnsStyleBuilder, [{\n type: Injectable,\n args: [{ providedIn: 'root' }]\n }], null, null); })();\nclass GridColumnsDirective extends BaseDirective2 {\n /**\n * @param {?} elementRef\n * @param {?} styleBuilder\n * @param {?} styler\n * @param {?} marshal\n */\n constructor(elementRef, styleBuilder, styler, marshal) {\n super(elementRef, styleBuilder, styler, marshal);\n this.DIRECTIVE_KEY = 'grid-columns';\n this._inline = false;\n this.init();\n }\n /**\n * @return {?}\n */\n get inline() { return this._inline; }\n /**\n * @param {?} val\n * @return {?}\n */\n set inline(val) { this._inline = coerceBooleanProperty(val); }\n // *********************************************\n // Protected methods\n // *********************************************\n /**\n * @protected\n * @param {?} value\n * @return {?}\n */\n updateWithValue(value) {\n this.styleCache = this.inline ? columnsInlineCache : columnsCache;\n this.addStyles(value, { inline: this.inline });\n }\n}\nGridColumnsDirective.ɵfac = function GridColumnsDirective_Factory(t) { return new (t || GridColumnsDirective)(ɵngcc0.ɵɵdirectiveInject(ɵngcc0.ElementRef), ɵngcc0.ɵɵdirectiveInject(GridColumnsStyleBuilder), ɵngcc0.ɵɵdirectiveInject(ɵngcc1.StyleUtils), ɵngcc0.ɵɵdirectiveInject(ɵngcc1.MediaMarshaller)); };\nGridColumnsDirective.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: GridColumnsDirective, inputs: { inline: [\"gdInline\", \"inline\"] }, features: [ɵngcc0.ɵɵInheritDefinitionFeature] });\n/** @nocollapse */\nGridColumnsDirective.ctorParameters = () => [\n { type: ElementRef },\n { type: GridColumnsStyleBuilder },\n { type: StyleUtils },\n { type: MediaMarshaller }\n];\nGridColumnsDirective.propDecorators = {\n inline: [{ type: Input, args: ['gdInline',] }]\n};\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(GridColumnsDirective, [{\n type: Directive\n }], function () { return [{ type: ɵngcc0.ElementRef }, { type: GridColumnsStyleBuilder }, { type: ɵngcc1.StyleUtils }, { type: ɵngcc1.MediaMarshaller }]; }, { inline: [{\n type: Input,\n args: ['gdInline']\n }] }); })();\n/** @type {?} */\nconst columnsCache = new Map();\n/** @type {?} */\nconst columnsInlineCache = new Map();\n/** @type {?} */\nconst inputs$7 = [\n 'gdColumns',\n 'gdColumns.xs', 'gdColumns.sm', 'gdColumns.md', 'gdColumns.lg', 'gdColumns.xl',\n 'gdColumns.lt-sm', 'gdColumns.lt-md', 'gdColumns.lt-lg', 'gdColumns.lt-xl',\n 'gdColumns.gt-xs', 'gdColumns.gt-sm', 'gdColumns.gt-md', 'gdColumns.gt-lg'\n];\n/** @type {?} */\nconst selector$7 = `\n [gdColumns],\n [gdColumns.xs], [gdColumns.sm], [gdColumns.md], [gdColumns.lg], [gdColumns.xl],\n [gdColumns.lt-sm], [gdColumns.lt-md], [gdColumns.lt-lg], [gdColumns.lt-xl],\n [gdColumns.gt-xs], [gdColumns.gt-sm], [gdColumns.gt-md], [gdColumns.gt-lg]\n`;\n/**\n * 'grid-template-columns' CSS Grid styling directive\n * Configures the sizing for the columns in the grid\n * Syntax: [auto]\n * @see https://css-tricks.com/snippets/css/complete-guide-grid/#article-header-id-13\n */\nclass DefaultGridColumnsDirective extends GridColumnsDirective {\n constructor() {\n super(...arguments);\n this.inputs = inputs$7;\n }\n}\nDefaultGridColumnsDirective.ɵfac = /*@__PURE__*/ function () { let ɵDefaultGridColumnsDirective_BaseFactory; return function DefaultGridColumnsDirective_Factory(t) { return (ɵDefaultGridColumnsDirective_BaseFactory || (ɵDefaultGridColumnsDirective_BaseFactory = ɵngcc0.ɵɵgetInheritedFactory(DefaultGridColumnsDirective)))(t || DefaultGridColumnsDirective); }; }();\nDefaultGridColumnsDirective.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: DefaultGridColumnsDirective, selectors: [[\"\", \"gdColumns\", \"\"], [\"\", \"gdColumns.xs\", \"\"], [\"\", \"gdColumns.sm\", \"\"], [\"\", \"gdColumns.md\", \"\"], [\"\", \"gdColumns.lg\", \"\"], [\"\", \"gdColumns.xl\", \"\"], [\"\", \"gdColumns.lt-sm\", \"\"], [\"\", \"gdColumns.lt-md\", \"\"], [\"\", \"gdColumns.lt-lg\", \"\"], [\"\", \"gdColumns.lt-xl\", \"\"], [\"\", \"gdColumns.gt-xs\", \"\"], [\"\", \"gdColumns.gt-sm\", \"\"], [\"\", \"gdColumns.gt-md\", \"\"], [\"\", \"gdColumns.gt-lg\", \"\"]], inputs: { gdColumns: \"gdColumns\", \"gdColumns.xs\": \"gdColumns.xs\", \"gdColumns.sm\": \"gdColumns.sm\", \"gdColumns.md\": \"gdColumns.md\", \"gdColumns.lg\": \"gdColumns.lg\", \"gdColumns.xl\": \"gdColumns.xl\", \"gdColumns.lt-sm\": \"gdColumns.lt-sm\", \"gdColumns.lt-md\": \"gdColumns.lt-md\", \"gdColumns.lt-lg\": \"gdColumns.lt-lg\", \"gdColumns.lt-xl\": \"gdColumns.lt-xl\", \"gdColumns.gt-xs\": \"gdColumns.gt-xs\", \"gdColumns.gt-sm\": \"gdColumns.gt-sm\", \"gdColumns.gt-md\": \"gdColumns.gt-md\", \"gdColumns.gt-lg\": \"gdColumns.gt-lg\" }, features: [ɵngcc0.ɵɵInheritDefinitionFeature] });\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(DefaultGridColumnsDirective, [{\n type: Directive,\n args: [{ selector: selector$7, inputs: inputs$7 }]\n }], null, null); })();\n\n/**\n * @fileoverview added by tsickle\n * Generated from: grid/gap/gap.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n/** @type {?} */\nconst DEFAULT_VALUE$5 = '0';\nclass GridGapStyleBuilder extends StyleBuilder {\n /**\n * @param {?} input\n * @param {?} parent\n * @return {?}\n */\n buildStyles(input, parent) {\n return {\n 'display': parent.inline ? 'inline-grid' : 'grid',\n 'grid-gap': input || DEFAULT_VALUE$5\n };\n }\n}\nGridGapStyleBuilder.ɵfac = /*@__PURE__*/ function () { let ɵGridGapStyleBuilder_BaseFactory; return function GridGapStyleBuilder_Factory(t) { return (ɵGridGapStyleBuilder_BaseFactory || (ɵGridGapStyleBuilder_BaseFactory = ɵngcc0.ɵɵgetInheritedFactory(GridGapStyleBuilder)))(t || GridGapStyleBuilder); }; }();\n/** @nocollapse */ GridGapStyleBuilder.ɵprov = ɵɵdefineInjectable({ factory: function GridGapStyleBuilder_Factory() { return new GridGapStyleBuilder(); }, token: GridGapStyleBuilder, providedIn: \"root\" });\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(GridGapStyleBuilder, [{\n type: Injectable,\n args: [{ providedIn: 'root' }]\n }], null, null); })();\nclass GridGapDirective extends BaseDirective2 {\n /**\n * @param {?} elRef\n * @param {?} styleUtils\n * @param {?} styleBuilder\n * @param {?} marshal\n */\n constructor(elRef, styleUtils, styleBuilder, marshal) {\n super(elRef, styleBuilder, styleUtils, marshal);\n this.DIRECTIVE_KEY = 'grid-gap';\n this._inline = false;\n this.init();\n }\n /**\n * @return {?}\n */\n get inline() { return this._inline; }\n /**\n * @param {?} val\n * @return {?}\n */\n set inline(val) { this._inline = coerceBooleanProperty(val); }\n // *********************************************\n // Protected methods\n // *********************************************\n /**\n * @protected\n * @param {?} value\n * @return {?}\n */\n updateWithValue(value) {\n this.styleCache = this.inline ? gapInlineCache : gapCache;\n this.addStyles(value, { inline: this.inline });\n }\n}\nGridGapDirective.ɵfac = function GridGapDirective_Factory(t) { return new (t || GridGapDirective)(ɵngcc0.ɵɵdirectiveInject(ɵngcc0.ElementRef), ɵngcc0.ɵɵdirectiveInject(ɵngcc1.StyleUtils), ɵngcc0.ɵɵdirectiveInject(GridGapStyleBuilder), ɵngcc0.ɵɵdirectiveInject(ɵngcc1.MediaMarshaller)); };\nGridGapDirective.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: GridGapDirective, inputs: { inline: [\"gdInline\", \"inline\"] }, features: [ɵngcc0.ɵɵInheritDefinitionFeature] });\n/** @nocollapse */\nGridGapDirective.ctorParameters = () => [\n { type: ElementRef },\n { type: StyleUtils },\n { type: GridGapStyleBuilder },\n { type: MediaMarshaller }\n];\nGridGapDirective.propDecorators = {\n inline: [{ type: Input, args: ['gdInline',] }]\n};\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(GridGapDirective, [{\n type: Directive\n }], function () { return [{ type: ɵngcc0.ElementRef }, { type: ɵngcc1.StyleUtils }, { type: GridGapStyleBuilder }, { type: ɵngcc1.MediaMarshaller }]; }, { inline: [{\n type: Input,\n args: ['gdInline']\n }] }); })();\n/** @type {?} */\nconst gapCache = new Map();\n/** @type {?} */\nconst gapInlineCache = new Map();\n/** @type {?} */\nconst inputs$8 = [\n 'gdGap',\n 'gdGap.xs', 'gdGap.sm', 'gdGap.md', 'gdGap.lg', 'gdGap.xl',\n 'gdGap.lt-sm', 'gdGap.lt-md', 'gdGap.lt-lg', 'gdGap.lt-xl',\n 'gdGap.gt-xs', 'gdGap.gt-sm', 'gdGap.gt-md', 'gdGap.gt-lg'\n];\n/** @type {?} */\nconst selector$8 = `\n [gdGap],\n [gdGap.xs], [gdGap.sm], [gdGap.md], [gdGap.lg], [gdGap.xl],\n [gdGap.lt-sm], [gdGap.lt-md], [gdGap.lt-lg], [gdGap.lt-xl],\n [gdGap.gt-xs], [gdGap.gt-sm], [gdGap.gt-md], [gdGap.gt-lg]\n`;\n/**\n * 'grid-gap' CSS Grid styling directive\n * Configures the gap between items in the grid\n * Syntax: []\n * @see https://css-tricks.com/snippets/css/complete-guide-grid/#article-header-id-17\n */\nclass DefaultGridGapDirective extends GridGapDirective {\n constructor() {\n super(...arguments);\n this.inputs = inputs$8;\n }\n}\nDefaultGridGapDirective.ɵfac = /*@__PURE__*/ function () { let ɵDefaultGridGapDirective_BaseFactory; return function DefaultGridGapDirective_Factory(t) { return (ɵDefaultGridGapDirective_BaseFactory || (ɵDefaultGridGapDirective_BaseFactory = ɵngcc0.ɵɵgetInheritedFactory(DefaultGridGapDirective)))(t || DefaultGridGapDirective); }; }();\nDefaultGridGapDirective.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: DefaultGridGapDirective, selectors: [[\"\", \"gdGap\", \"\"], [\"\", \"gdGap.xs\", \"\"], [\"\", \"gdGap.sm\", \"\"], [\"\", \"gdGap.md\", \"\"], [\"\", \"gdGap.lg\", \"\"], [\"\", \"gdGap.xl\", \"\"], [\"\", \"gdGap.lt-sm\", \"\"], [\"\", \"gdGap.lt-md\", \"\"], [\"\", \"gdGap.lt-lg\", \"\"], [\"\", \"gdGap.lt-xl\", \"\"], [\"\", \"gdGap.gt-xs\", \"\"], [\"\", \"gdGap.gt-sm\", \"\"], [\"\", \"gdGap.gt-md\", \"\"], [\"\", \"gdGap.gt-lg\", \"\"]], inputs: { gdGap: \"gdGap\", \"gdGap.xs\": \"gdGap.xs\", \"gdGap.sm\": \"gdGap.sm\", \"gdGap.md\": \"gdGap.md\", \"gdGap.lg\": \"gdGap.lg\", \"gdGap.xl\": \"gdGap.xl\", \"gdGap.lt-sm\": \"gdGap.lt-sm\", \"gdGap.lt-md\": \"gdGap.lt-md\", \"gdGap.lt-lg\": \"gdGap.lt-lg\", \"gdGap.lt-xl\": \"gdGap.lt-xl\", \"gdGap.gt-xs\": \"gdGap.gt-xs\", \"gdGap.gt-sm\": \"gdGap.gt-sm\", \"gdGap.gt-md\": \"gdGap.gt-md\", \"gdGap.gt-lg\": \"gdGap.gt-lg\" }, features: [ɵngcc0.ɵɵInheritDefinitionFeature] });\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(DefaultGridGapDirective, [{\n type: Directive,\n args: [{ selector: selector$8, inputs: inputs$8 }]\n }], null, null); })();\n\n/**\n * @fileoverview added by tsickle\n * Generated from: grid/row/row.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n/** @type {?} */\nconst DEFAULT_VALUE$6 = 'auto';\nclass GridRowStyleBuilder extends StyleBuilder {\n /**\n * @param {?} input\n * @return {?}\n */\n buildStyles(input) {\n return { 'grid-row': input || DEFAULT_VALUE$6 };\n }\n}\nGridRowStyleBuilder.ɵfac = /*@__PURE__*/ function () { let ɵGridRowStyleBuilder_BaseFactory; return function GridRowStyleBuilder_Factory(t) { return (ɵGridRowStyleBuilder_BaseFactory || (ɵGridRowStyleBuilder_BaseFactory = ɵngcc0.ɵɵgetInheritedFactory(GridRowStyleBuilder)))(t || GridRowStyleBuilder); }; }();\n/** @nocollapse */ GridRowStyleBuilder.ɵprov = ɵɵdefineInjectable({ factory: function GridRowStyleBuilder_Factory() { return new GridRowStyleBuilder(); }, token: GridRowStyleBuilder, providedIn: \"root\" });\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(GridRowStyleBuilder, [{\n type: Injectable,\n args: [{ providedIn: 'root' }]\n }], null, null); })();\nclass GridRowDirective extends BaseDirective2 {\n /**\n * @param {?} elementRef\n * @param {?} styleBuilder\n * @param {?} styler\n * @param {?} marshal\n */\n constructor(elementRef, styleBuilder, styler, marshal) {\n super(elementRef, styleBuilder, styler, marshal);\n this.DIRECTIVE_KEY = 'grid-row';\n this.styleCache = rowCache;\n this.init();\n }\n}\nGridRowDirective.ɵfac = function GridRowDirective_Factory(t) { return new (t || GridRowDirective)(ɵngcc0.ɵɵdirectiveInject(ɵngcc0.ElementRef), ɵngcc0.ɵɵdirectiveInject(GridRowStyleBuilder), ɵngcc0.ɵɵdirectiveInject(ɵngcc1.StyleUtils), ɵngcc0.ɵɵdirectiveInject(ɵngcc1.MediaMarshaller)); };\nGridRowDirective.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: GridRowDirective, features: [ɵngcc0.ɵɵInheritDefinitionFeature] });\n/** @nocollapse */\nGridRowDirective.ctorParameters = () => [\n { type: ElementRef },\n { type: GridRowStyleBuilder },\n { type: StyleUtils },\n { type: MediaMarshaller }\n];\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(GridRowDirective, [{\n type: Directive\n }], function () { return [{ type: ɵngcc0.ElementRef }, { type: GridRowStyleBuilder }, { type: ɵngcc1.StyleUtils }, { type: ɵngcc1.MediaMarshaller }]; }, null); })();\n/** @type {?} */\nconst rowCache = new Map();\n/** @type {?} */\nconst inputs$9 = [\n 'gdRow',\n 'gdRow.xs', 'gdRow.sm', 'gdRow.md', 'gdRow.lg', 'gdRow.xl',\n 'gdRow.lt-sm', 'gdRow.lt-md', 'gdRow.lt-lg', 'gdRow.lt-xl',\n 'gdRow.gt-xs', 'gdRow.gt-sm', 'gdRow.gt-md', 'gdRow.gt-lg'\n];\n/** @type {?} */\nconst selector$9 = `\n [gdRow],\n [gdRow.xs], [gdRow.sm], [gdRow.md], [gdRow.lg], [gdRow.xl],\n [gdRow.lt-sm], [gdRow.lt-md], [gdRow.lt-lg], [gdRow.lt-xl],\n [gdRow.gt-xs], [gdRow.gt-sm], [gdRow.gt-md], [gdRow.gt-lg]\n`;\n/**\n * 'grid-row' CSS Grid styling directive\n * Configures the name or position of an element within the grid\n * @see https://css-tricks.com/snippets/css/complete-guide-grid/#article-header-id-26\n */\nclass DefaultGridRowDirective extends GridRowDirective {\n constructor() {\n super(...arguments);\n this.inputs = inputs$9;\n }\n}\nDefaultGridRowDirective.ɵfac = /*@__PURE__*/ function () { let ɵDefaultGridRowDirective_BaseFactory; return function DefaultGridRowDirective_Factory(t) { return (ɵDefaultGridRowDirective_BaseFactory || (ɵDefaultGridRowDirective_BaseFactory = ɵngcc0.ɵɵgetInheritedFactory(DefaultGridRowDirective)))(t || DefaultGridRowDirective); }; }();\nDefaultGridRowDirective.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: DefaultGridRowDirective, selectors: [[\"\", \"gdRow\", \"\"], [\"\", \"gdRow.xs\", \"\"], [\"\", \"gdRow.sm\", \"\"], [\"\", \"gdRow.md\", \"\"], [\"\", \"gdRow.lg\", \"\"], [\"\", \"gdRow.xl\", \"\"], [\"\", \"gdRow.lt-sm\", \"\"], [\"\", \"gdRow.lt-md\", \"\"], [\"\", \"gdRow.lt-lg\", \"\"], [\"\", \"gdRow.lt-xl\", \"\"], [\"\", \"gdRow.gt-xs\", \"\"], [\"\", \"gdRow.gt-sm\", \"\"], [\"\", \"gdRow.gt-md\", \"\"], [\"\", \"gdRow.gt-lg\", \"\"]], inputs: { gdRow: \"gdRow\", \"gdRow.xs\": \"gdRow.xs\", \"gdRow.sm\": \"gdRow.sm\", \"gdRow.md\": \"gdRow.md\", \"gdRow.lg\": \"gdRow.lg\", \"gdRow.xl\": \"gdRow.xl\", \"gdRow.lt-sm\": \"gdRow.lt-sm\", \"gdRow.lt-md\": \"gdRow.lt-md\", \"gdRow.lt-lg\": \"gdRow.lt-lg\", \"gdRow.lt-xl\": \"gdRow.lt-xl\", \"gdRow.gt-xs\": \"gdRow.gt-xs\", \"gdRow.gt-sm\": \"gdRow.gt-sm\", \"gdRow.gt-md\": \"gdRow.gt-md\", \"gdRow.gt-lg\": \"gdRow.gt-lg\" }, features: [ɵngcc0.ɵɵInheritDefinitionFeature] });\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(DefaultGridRowDirective, [{\n type: Directive,\n args: [{ selector: selector$9, inputs: inputs$9 }]\n }], null, null); })();\n\n/**\n * @fileoverview added by tsickle\n * Generated from: grid/rows/rows.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n/** @type {?} */\nconst DEFAULT_VALUE$7 = 'none';\n/** @type {?} */\nconst AUTO_SPECIFIER$1 = '!';\nclass GridRowsStyleBuilder extends StyleBuilder {\n /**\n * @param {?} input\n * @param {?} parent\n * @return {?}\n */\n buildStyles(input, parent) {\n input = input || DEFAULT_VALUE$7;\n /** @type {?} */\n let auto = false;\n if (input.endsWith(AUTO_SPECIFIER$1)) {\n input = input.substring(0, input.indexOf(AUTO_SPECIFIER$1));\n auto = true;\n }\n /** @type {?} */\n const css = {\n 'display': parent.inline ? 'inline-grid' : 'grid',\n 'grid-auto-rows': '',\n 'grid-template-rows': '',\n };\n /** @type {?} */\n const key = (auto ? 'grid-auto-rows' : 'grid-template-rows');\n css[key] = input;\n return css;\n }\n}\nGridRowsStyleBuilder.ɵfac = /*@__PURE__*/ function () { let ɵGridRowsStyleBuilder_BaseFactory; return function GridRowsStyleBuilder_Factory(t) { return (ɵGridRowsStyleBuilder_BaseFactory || (ɵGridRowsStyleBuilder_BaseFactory = ɵngcc0.ɵɵgetInheritedFactory(GridRowsStyleBuilder)))(t || GridRowsStyleBuilder); }; }();\n/** @nocollapse */ GridRowsStyleBuilder.ɵprov = ɵɵdefineInjectable({ factory: function GridRowsStyleBuilder_Factory() { return new GridRowsStyleBuilder(); }, token: GridRowsStyleBuilder, providedIn: \"root\" });\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(GridRowsStyleBuilder, [{\n type: Injectable,\n args: [{ providedIn: 'root' }]\n }], null, null); })();\nclass GridRowsDirective extends BaseDirective2 {\n /**\n * @param {?} elementRef\n * @param {?} styleBuilder\n * @param {?} styler\n * @param {?} marshal\n */\n constructor(elementRef, styleBuilder, styler, marshal) {\n super(elementRef, styleBuilder, styler, marshal);\n this.DIRECTIVE_KEY = 'grid-rows';\n this._inline = false;\n this.init();\n }\n /**\n * @return {?}\n */\n get inline() { return this._inline; }\n /**\n * @param {?} val\n * @return {?}\n */\n set inline(val) { this._inline = coerceBooleanProperty(val); }\n // *********************************************\n // Protected methods\n // *********************************************\n /**\n * @protected\n * @param {?} value\n * @return {?}\n */\n updateWithValue(value) {\n this.styleCache = this.inline ? rowsInlineCache : rowsCache;\n this.addStyles(value, { inline: this.inline });\n }\n}\nGridRowsDirective.ɵfac = function GridRowsDirective_Factory(t) { return new (t || GridRowsDirective)(ɵngcc0.ɵɵdirectiveInject(ɵngcc0.ElementRef), ɵngcc0.ɵɵdirectiveInject(GridRowsStyleBuilder), ɵngcc0.ɵɵdirectiveInject(ɵngcc1.StyleUtils), ɵngcc0.ɵɵdirectiveInject(ɵngcc1.MediaMarshaller)); };\nGridRowsDirective.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: GridRowsDirective, inputs: { inline: [\"gdInline\", \"inline\"] }, features: [ɵngcc0.ɵɵInheritDefinitionFeature] });\n/** @nocollapse */\nGridRowsDirective.ctorParameters = () => [\n { type: ElementRef },\n { type: GridRowsStyleBuilder },\n { type: StyleUtils },\n { type: MediaMarshaller }\n];\nGridRowsDirective.propDecorators = {\n inline: [{ type: Input, args: ['gdInline',] }]\n};\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(GridRowsDirective, [{\n type: Directive\n }], function () { return [{ type: ɵngcc0.ElementRef }, { type: GridRowsStyleBuilder }, { type: ɵngcc1.StyleUtils }, { type: ɵngcc1.MediaMarshaller }]; }, { inline: [{\n type: Input,\n args: ['gdInline']\n }] }); })();\n/** @type {?} */\nconst rowsCache = new Map();\n/** @type {?} */\nconst rowsInlineCache = new Map();\n/** @type {?} */\nconst inputs$10 = [\n 'gdRows',\n 'gdRows.xs', 'gdRows.sm', 'gdRows.md', 'gdRows.lg', 'gdRows.xl',\n 'gdRows.lt-sm', 'gdRows.lt-md', 'gdRows.lt-lg', 'gdRows.lt-xl',\n 'gdRows.gt-xs', 'gdRows.gt-sm', 'gdRows.gt-md', 'gdRows.gt-lg'\n];\n/** @type {?} */\nconst selector$10 = `\n [gdRows],\n [gdRows.xs], [gdRows.sm], [gdRows.md], [gdRows.lg], [gdRows.xl],\n [gdRows.lt-sm], [gdRows.lt-md], [gdRows.lt-lg], [gdRows.lt-xl],\n [gdRows.gt-xs], [gdRows.gt-sm], [gdRows.gt-md], [gdRows.gt-lg]\n`;\n/**\n * 'grid-template-rows' CSS Grid styling directive\n * Configures the sizing for the rows in the grid\n * Syntax: [auto]\n * @see https://css-tricks.com/snippets/css/complete-guide-grid/#article-header-id-13\n */\nclass DefaultGridRowsDirective extends GridRowsDirective {\n constructor() {\n super(...arguments);\n this.inputs = inputs$10;\n }\n}\nDefaultGridRowsDirective.ɵfac = /*@__PURE__*/ function () { let ɵDefaultGridRowsDirective_BaseFactory; return function DefaultGridRowsDirective_Factory(t) { return (ɵDefaultGridRowsDirective_BaseFactory || (ɵDefaultGridRowsDirective_BaseFactory = ɵngcc0.ɵɵgetInheritedFactory(DefaultGridRowsDirective)))(t || DefaultGridRowsDirective); }; }();\nDefaultGridRowsDirective.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: DefaultGridRowsDirective, selectors: [[\"\", \"gdRows\", \"\"], [\"\", \"gdRows.xs\", \"\"], [\"\", \"gdRows.sm\", \"\"], [\"\", \"gdRows.md\", \"\"], [\"\", \"gdRows.lg\", \"\"], [\"\", \"gdRows.xl\", \"\"], [\"\", \"gdRows.lt-sm\", \"\"], [\"\", \"gdRows.lt-md\", \"\"], [\"\", \"gdRows.lt-lg\", \"\"], [\"\", \"gdRows.lt-xl\", \"\"], [\"\", \"gdRows.gt-xs\", \"\"], [\"\", \"gdRows.gt-sm\", \"\"], [\"\", \"gdRows.gt-md\", \"\"], [\"\", \"gdRows.gt-lg\", \"\"]], inputs: { gdRows: \"gdRows\", \"gdRows.xs\": \"gdRows.xs\", \"gdRows.sm\": \"gdRows.sm\", \"gdRows.md\": \"gdRows.md\", \"gdRows.lg\": \"gdRows.lg\", \"gdRows.xl\": \"gdRows.xl\", \"gdRows.lt-sm\": \"gdRows.lt-sm\", \"gdRows.lt-md\": \"gdRows.lt-md\", \"gdRows.lt-lg\": \"gdRows.lt-lg\", \"gdRows.lt-xl\": \"gdRows.lt-xl\", \"gdRows.gt-xs\": \"gdRows.gt-xs\", \"gdRows.gt-sm\": \"gdRows.gt-sm\", \"gdRows.gt-md\": \"gdRows.gt-md\", \"gdRows.gt-lg\": \"gdRows.gt-lg\" }, features: [ɵngcc0.ɵɵInheritDefinitionFeature] });\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(DefaultGridRowsDirective, [{\n type: Directive,\n args: [{ selector: selector$10, inputs: inputs$10 }]\n }], null, null); })();\n\n/**\n * @fileoverview added by tsickle\n * Generated from: grid/module.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n/** @type {?} */\nconst ALL_DIRECTIVES = [\n DefaultGridAlignDirective,\n DefaultGridAlignColumnsDirective,\n DefaultGridAlignRowsDirective,\n DefaultGridAreaDirective,\n DefaultGridAreasDirective,\n DefaultGridAutoDirective,\n DefaultGridColumnDirective,\n DefaultGridColumnsDirective,\n DefaultGridGapDirective,\n DefaultGridRowDirective,\n DefaultGridRowsDirective,\n];\n/**\n * *****************************************************************\n * Define module for the CSS Grid API\n * *****************************************************************\n */\nclass GridModule {\n}\nGridModule.ɵfac = function GridModule_Factory(t) { return new (t || GridModule)(); };\nGridModule.ɵmod = /*@__PURE__*/ ɵngcc0.ɵɵdefineNgModule({ type: GridModule });\nGridModule.ɵinj = /*@__PURE__*/ ɵngcc0.ɵɵdefineInjector({ imports: [[CoreModule]] });\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(GridModule, [{\n type: NgModule,\n args: [{\n imports: [CoreModule],\n declarations: [...ALL_DIRECTIVES],\n exports: [...ALL_DIRECTIVES]\n }]\n }], null, null); })();\n(function () { (typeof ngJitMode === \"undefined\" || ngJitMode) && ɵngcc0.ɵɵsetNgModuleScope(GridModule, { declarations: function () { return [DefaultGridAlignDirective, DefaultGridAlignColumnsDirective, DefaultGridAlignRowsDirective, DefaultGridAreaDirective, DefaultGridAreasDirective, DefaultGridAutoDirective, DefaultGridColumnDirective, DefaultGridColumnsDirective, DefaultGridGapDirective, DefaultGridRowDirective, DefaultGridRowsDirective]; }, imports: function () { return [CoreModule]; }, exports: function () { return [DefaultGridAlignDirective, DefaultGridAlignColumnsDirective, DefaultGridAlignRowsDirective, DefaultGridAreaDirective, DefaultGridAreasDirective, DefaultGridAutoDirective, DefaultGridColumnDirective, DefaultGridColumnsDirective, DefaultGridGapDirective, DefaultGridRowDirective, DefaultGridRowsDirective]; } }); })();\n\n/**\n * @fileoverview added by tsickle\n * Generated from: grid/public-api.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n\n/**\n * @fileoverview added by tsickle\n * Generated from: grid/index.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n\nexport { GridModule, DefaultGridAlignColumnsDirective as ɵgrid_privatef, GridAlignColumnsDirective as ɵgrid_privatee, GridAlignColumnsStyleBuilder as ɵgrid_privated, DefaultGridAlignRowsDirective as ɵgrid_privatei, GridAlignRowsDirective as ɵgrid_privateh, GridAlignRowsStyleBuilder as ɵgrid_privateg, DefaultGridAreaDirective as ɵgrid_privatel, GridAreaDirective as ɵgrid_privatek, GridAreaStyleBuilder as ɵgrid_privatej, DefaultGridAreasDirective as ɵgrid_privateo, GridAreasDirective as ɵgrid_privaten, GridAreasStyleBuiler as ɵgrid_privatem, DefaultGridAutoDirective as ɵgrid_privater, GridAutoDirective as ɵgrid_privateq, GridAutoStyleBuilder as ɵgrid_privatep, DefaultGridColumnDirective as ɵgrid_privateu, GridColumnDirective as ɵgrid_privatet, GridColumnStyleBuilder as ɵgrid_privates, DefaultGridColumnsDirective as ɵgrid_privatex, GridColumnsDirective as ɵgrid_privatew, GridColumnsStyleBuilder as ɵgrid_privatev, DefaultGridGapDirective as ɵgrid_privateba, GridGapDirective as ɵgrid_privatez, GridGapStyleBuilder as ɵgrid_privatey, DefaultGridAlignDirective as ɵgrid_privatec, GridAlignDirective as ɵgrid_privateb, GridAlignStyleBuilder as ɵgrid_privatea, DefaultGridRowDirective as ɵgrid_privatebd, GridRowDirective as ɵgrid_privatebc, GridRowStyleBuilder as ɵgrid_privatebb, DefaultGridRowsDirective as ɵgrid_privatebg, GridRowsDirective as ɵgrid_privatebf, GridRowsStyleBuilder as ɵgrid_privatebe };\n\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\nimport { Version, Inject, NgModule, PLATFORM_ID } from '@angular/core';\nimport { isPlatformServer } from '@angular/common';\nimport { SERVER_TOKEN, LAYOUT_CONFIG, DEFAULT_CONFIG, BREAKPOINT } from '@angular/flex-layout/core';\nimport * as ɵngcc0 from '@angular/core';\nexport { ɵMatchMedia, ɵMockMatchMedia, ɵMockMatchMediaProvider, CoreModule, removeStyles, BROWSER_PROVIDER, CLASS_NAME, MediaChange, StylesheetMap, DEFAULT_CONFIG, LAYOUT_CONFIG, SERVER_TOKEN, BREAKPOINT, mergeAlias, BaseDirective2, DEFAULT_BREAKPOINTS, ScreenTypes, ORIENTATION_BREAKPOINTS, BreakPointRegistry, BREAKPOINTS, MediaObserver, MediaTrigger, sortDescendingPriority, sortAscendingPriority, coerceArray, StyleUtils, StyleBuilder, validateBasis, MediaMarshaller, BREAKPOINT_PRINT, PrintHook } from '@angular/flex-layout/core';\nimport { ExtendedModule } from '@angular/flex-layout/extended';\nexport { ExtendedModule, ClassDirective, DefaultClassDirective, ImgSrcStyleBuilder, ImgSrcDirective, DefaultImgSrcDirective, ShowHideStyleBuilder, ShowHideDirective, DefaultShowHideDirective, StyleDirective, DefaultStyleDirective } from '@angular/flex-layout/extended';\nimport { FlexModule } from '@angular/flex-layout/flex';\nexport { FlexModule, FlexStyleBuilder, FlexDirective, DefaultFlexDirective, FlexAlignStyleBuilder, FlexAlignDirective, DefaultFlexAlignDirective, FlexFillStyleBuilder, FlexFillDirective, FlexOffsetStyleBuilder, FlexOffsetDirective, DefaultFlexOffsetDirective, FlexOrderStyleBuilder, FlexOrderDirective, DefaultFlexOrderDirective, LayoutStyleBuilder, LayoutDirective, DefaultLayoutDirective, LayoutAlignStyleBuilder, LayoutAlignDirective, DefaultLayoutAlignDirective, LayoutGapStyleBuilder, LayoutGapDirective, DefaultLayoutGapDirective } from '@angular/flex-layout/flex';\nimport { GridModule } from '@angular/flex-layout/grid';\nexport { ɵgrid_privatef, ɵgrid_privatee, ɵgrid_privated, ɵgrid_privatei, ɵgrid_privateh, ɵgrid_privateg, ɵgrid_privatel, ɵgrid_privatek, ɵgrid_privatej, ɵgrid_privateo, ɵgrid_privaten, ɵgrid_privatem, ɵgrid_privater, ɵgrid_privateq, ɵgrid_privatep, ɵgrid_privateu, ɵgrid_privatet, ɵgrid_privates, ɵgrid_privatex, ɵgrid_privatew, ɵgrid_privatev, ɵgrid_privateba, ɵgrid_privatez, ɵgrid_privatey, ɵgrid_privatec, ɵgrid_privateb, ɵgrid_privatea, ɵgrid_privatebd, ɵgrid_privatebc, ɵgrid_privatebb, ɵgrid_privatebg, ɵgrid_privatebf, ɵgrid_privatebe, GridModule } from '@angular/flex-layout/grid';\n\n/**\n * @fileoverview added by tsickle\n * Generated from: version.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n/**\n * Current version of Angular Flex-Layout.\n * @type {?}\n */\nconst VERSION = new Version('12.0.0-beta.34');\n\n/**\n * @fileoverview added by tsickle\n * Generated from: module.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n/**\n * FlexLayoutModule -- the main import for all utilities in the Angular Layout library\n * * Will automatically provide Flex, Grid, and Extended modules for use in the application\n * * Can be configured using the static withConfig method, options viewable on the Wiki's\n * Configuration page\n */\nclass FlexLayoutModule {\n /**\n * @param {?} serverModuleLoaded\n * @param {?} platformId\n */\n constructor(serverModuleLoaded, platformId) {\n if (isPlatformServer(platformId) && !serverModuleLoaded) {\n console.warn('Warning: Flex Layout loaded on the server without FlexLayoutServerModule');\n }\n }\n /**\n * Initialize the FlexLayoutModule with a set of config options,\n * which sets the corresponding tokens accordingly\n * @param {?} configOptions\n * @param {?=} breakpoints\n * @return {?}\n */\n static withConfig(configOptions, \n // tslint:disable-next-line:max-line-length\n breakpoints = []) {\n return {\n ngModule: FlexLayoutModule,\n providers: configOptions.serverLoaded ?\n [\n { provide: LAYOUT_CONFIG, useValue: Object.assign(Object.assign({}, DEFAULT_CONFIG), configOptions) },\n { provide: BREAKPOINT, useValue: breakpoints, multi: true },\n { provide: SERVER_TOKEN, useValue: true },\n ] : [\n { provide: LAYOUT_CONFIG, useValue: Object.assign(Object.assign({}, DEFAULT_CONFIG), configOptions) },\n { provide: BREAKPOINT, useValue: breakpoints, multi: true },\n ]\n };\n }\n}\nFlexLayoutModule.ɵfac = function FlexLayoutModule_Factory(t) { return new (t || FlexLayoutModule)(ɵngcc0.ɵɵinject(SERVER_TOKEN), ɵngcc0.ɵɵinject(PLATFORM_ID)); };\nFlexLayoutModule.ɵmod = /*@__PURE__*/ ɵngcc0.ɵɵdefineNgModule({ type: FlexLayoutModule });\nFlexLayoutModule.ɵinj = /*@__PURE__*/ ɵngcc0.ɵɵdefineInjector({ imports: [[FlexModule, ExtendedModule, GridModule], FlexModule, ExtendedModule, GridModule] });\n/** @nocollapse */\nFlexLayoutModule.ctorParameters = () => [\n { type: Boolean, decorators: [{ type: Inject, args: [SERVER_TOKEN,] }] },\n { type: Object, decorators: [{ type: Inject, args: [PLATFORM_ID,] }] }\n];\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(FlexLayoutModule, [{\n type: NgModule,\n args: [{\n imports: [FlexModule, ExtendedModule, GridModule],\n exports: [FlexModule, ExtendedModule, GridModule]\n }]\n }], function () { return [{ type: Boolean, decorators: [{\n type: Inject,\n args: [SERVER_TOKEN]\n }] }, { type: Object, decorators: [{\n type: Inject,\n args: [PLATFORM_ID]\n }] }]; }, null); })();\n(function () { (typeof ngJitMode === \"undefined\" || ngJitMode) && ɵngcc0.ɵɵsetNgModuleScope(FlexLayoutModule, { imports: function () { return [FlexModule, ExtendedModule, GridModule]; }, exports: function () { return [FlexModule, ExtendedModule, GridModule]; } }); })();\n\n/**\n * @fileoverview added by tsickle\n * Generated from: public-api.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n\n/**\n * @fileoverview added by tsickle\n * Generated from: index.ts\n * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n\nexport { VERSION, FlexLayoutModule };\n\n","import * as i0 from '@angular/core';\nimport { EventEmitter, Component, ChangeDetectionStrategy, ViewEncapsulation, ElementRef, NgZone, Inject, PLATFORM_ID, Input, Output, Directive, ContentChildren, NgModule, Injectable } from '@angular/core';\nimport { isPlatformBrowser } from '@angular/common';\nimport { BehaviorSubject, Observable, Subject, combineLatest } from 'rxjs';\nimport { switchMap, take, map, takeUntil } from 'rxjs/operators';\n\n/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n/** Manages event on a Google Maps object, ensuring that events are added only when necessary. */\nimport * as ɵngcc0 from '@angular/core';\n\nconst _c0 = [\"*\"];\nclass MapEventManager {\n constructor(_ngZone) {\n this._ngZone = _ngZone;\n /** Pending listeners that were added before the target was set. */\n this._pending = [];\n this._listeners = [];\n this._targetStream = new BehaviorSubject(undefined);\n }\n /** Clears all currently-registered event listeners. */\n _clearListeners() {\n for (const listener of this._listeners) {\n listener.remove();\n }\n this._listeners = [];\n }\n /** Gets an observable that adds an event listener to the map when a consumer subscribes to it. */\n getLazyEmitter(name) {\n return this._targetStream.pipe(switchMap(target => {\n const observable = new Observable(observer => {\n // If the target hasn't been initialized yet, cache the observer so it can be added later.\n if (!target) {\n this._pending.push({ observable, observer });\n return undefined;\n }\n const listener = target.addListener(name, (event) => {\n this._ngZone.run(() => observer.next(event));\n });\n this._listeners.push(listener);\n return () => listener.remove();\n });\n return observable;\n }));\n }\n /** Sets the current target that the manager should bind events to. */\n setTarget(target) {\n const currentTarget = this._targetStream.value;\n if (target === currentTarget) {\n return;\n }\n // Clear the listeners from the pre-existing target.\n if (currentTarget) {\n this._clearListeners();\n this._pending = [];\n }\n this._targetStream.next(target);\n // Add the listeners that were bound before the map was initialized.\n this._pending.forEach(subscriber => subscriber.observable.subscribe(subscriber.observer));\n this._pending = [];\n }\n /** Destroys the manager and clears the event listeners. */\n destroy() {\n this._clearListeners();\n this._pending = [];\n this._targetStream.complete();\n }\n}\n\n/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n/** default options set to the Googleplex */\nconst DEFAULT_OPTIONS = {\n center: { lat: 37.421995, lng: -122.084092 },\n zoom: 17,\n // Note: the type conversion here isn't necessary for our CI, but it resolves a g3 failure.\n mapTypeId: 'roadmap'\n};\n/** Arbitrary default height for the map element */\nconst DEFAULT_HEIGHT = '500px';\n/** Arbitrary default width for the map element */\nconst DEFAULT_WIDTH = '500px';\n/**\n * Angular component that renders a Google Map via the Google Maps JavaScript\n * API.\n * @see https://developers.google.com/maps/documentation/javascript/reference/\n */\nclass GoogleMap {\n constructor(_elementRef, _ngZone, platformId) {\n this._elementRef = _elementRef;\n this._ngZone = _ngZone;\n this._eventManager = new MapEventManager(this._ngZone);\n /** Height of the map. Set this to `null` if you'd like to control the height through CSS. */\n this.height = DEFAULT_HEIGHT;\n /** Width of the map. Set this to `null` if you'd like to control the width through CSS. */\n this.width = DEFAULT_WIDTH;\n this._options = DEFAULT_OPTIONS;\n /**\n * See\n * https://developers.google.com/maps/documentation/javascript/events#auth-errors\n */\n this.authFailure = new EventEmitter();\n /**\n * See\n * https://developers.google.com/maps/documentation/javascript/reference/map#Map.bounds_changed\n */\n this.boundsChanged = this._eventManager.getLazyEmitter('bounds_changed');\n /**\n * See\n * https://developers.google.com/maps/documentation/javascript/reference/map#Map.center_changed\n */\n this.centerChanged = this._eventManager.getLazyEmitter('center_changed');\n /**\n * See\n * https://developers.google.com/maps/documentation/javascript/reference/map#Map.click\n */\n this.mapClick = this._eventManager\n .getLazyEmitter('click');\n /**\n * See\n * https://developers.google.com/maps/documentation/javascript/reference/map#Map.dblclick\n */\n this.mapDblclick = this._eventManager.getLazyEmitter('dblclick');\n /**\n * See\n * https://developers.google.com/maps/documentation/javascript/reference/map#Map.drag\n */\n this.mapDrag = this._eventManager.getLazyEmitter('drag');\n /**\n * See\n * https://developers.google.com/maps/documentation/javascript/reference/map#Map.dragend\n */\n this.mapDragend = this._eventManager.getLazyEmitter('dragend');\n /**\n * See\n * https://developers.google.com/maps/documentation/javascript/reference/map#Map.dragstart\n */\n this.mapDragstart = this._eventManager.getLazyEmitter('dragstart');\n /**\n * See\n * https://developers.google.com/maps/documentation/javascript/reference/map#Map.heading_changed\n */\n this.headingChanged = this._eventManager.getLazyEmitter('heading_changed');\n /**\n * See\n * https://developers.google.com/maps/documentation/javascript/reference/map#Map.idle\n */\n this.idle = this._eventManager.getLazyEmitter('idle');\n /**\n * See\n * https://developers.google.com/maps/documentation/javascript/reference/map#Map.maptypeid_changed\n */\n this.maptypeidChanged = this._eventManager.getLazyEmitter('maptypeid_changed');\n /**\n * See\n * https://developers.google.com/maps/documentation/javascript/reference/map#Map.mousemove\n */\n this.mapMousemove = this._eventManager.getLazyEmitter('mousemove');\n /**\n * See\n * https://developers.google.com/maps/documentation/javascript/reference/map#Map.mouseout\n */\n this.mapMouseout = this._eventManager.getLazyEmitter('mouseout');\n /**\n * See\n * https://developers.google.com/maps/documentation/javascript/reference/map#Map.mouseover\n */\n this.mapMouseover = this._eventManager.getLazyEmitter('mouseover');\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/map#Map.projection_changed\n */\n this.projectionChanged = this._eventManager.getLazyEmitter('projection_changed');\n /**\n * See\n * https://developers.google.com/maps/documentation/javascript/reference/map#Map.rightclick\n */\n this.mapRightclick = this._eventManager.getLazyEmitter('rightclick');\n /**\n * See\n * https://developers.google.com/maps/documentation/javascript/reference/map#Map.tilesloaded\n */\n this.tilesloaded = this._eventManager.getLazyEmitter('tilesloaded');\n /**\n * See\n * https://developers.google.com/maps/documentation/javascript/reference/map#Map.tilt_changed\n */\n this.tiltChanged = this._eventManager.getLazyEmitter('tilt_changed');\n /**\n * See\n * https://developers.google.com/maps/documentation/javascript/reference/map#Map.zoom_changed\n */\n this.zoomChanged = this._eventManager.getLazyEmitter('zoom_changed');\n this._isBrowser = isPlatformBrowser(platformId);\n if (this._isBrowser) {\n const googleMapsWindow = window;\n if (!googleMapsWindow.google && (typeof ngDevMode === 'undefined' || ngDevMode)) {\n throw Error('Namespace google not found, cannot construct embedded google ' +\n 'map. Please install the Google Maps JavaScript API: ' +\n 'https://developers.google.com/maps/documentation/javascript/' +\n 'tutorial#Loading_the_Maps_API');\n }\n this._existingAuthFailureCallback = googleMapsWindow.gm_authFailure;\n googleMapsWindow.gm_authFailure = () => {\n if (this._existingAuthFailureCallback) {\n this._existingAuthFailureCallback();\n }\n this.authFailure.emit();\n };\n }\n }\n set center(center) {\n this._center = center;\n }\n set zoom(zoom) {\n this._zoom = zoom;\n }\n set options(options) {\n this._options = options || DEFAULT_OPTIONS;\n }\n ngOnChanges(changes) {\n if (changes['height'] || changes['width']) {\n this._setSize();\n }\n const googleMap = this.googleMap;\n if (googleMap) {\n if (changes['options']) {\n googleMap.setOptions(this._combineOptions());\n }\n if (changes['center'] && this._center) {\n googleMap.setCenter(this._center);\n }\n // Note that the zoom can be zero.\n if (changes['zoom'] && this._zoom != null) {\n googleMap.setZoom(this._zoom);\n }\n if (changes['mapTypeId'] && this.mapTypeId) {\n googleMap.setMapTypeId(this.mapTypeId);\n }\n }\n }\n ngOnInit() {\n // It should be a noop during server-side rendering.\n if (this._isBrowser) {\n this._mapEl = this._elementRef.nativeElement.querySelector('.map-container');\n this._setSize();\n // Create the object outside the zone so its events don't trigger change detection.\n // We'll bring it back in inside the `MapEventManager` only for the events that the\n // user has subscribed to.\n this._ngZone.runOutsideAngular(() => {\n this.googleMap = new google.maps.Map(this._mapEl, this._combineOptions());\n });\n this._eventManager.setTarget(this.googleMap);\n }\n }\n ngOnDestroy() {\n this._eventManager.destroy();\n if (this._isBrowser) {\n const googleMapsWindow = window;\n googleMapsWindow.gm_authFailure = this._existingAuthFailureCallback;\n }\n }\n /**\n * See\n * https://developers.google.com/maps/documentation/javascript/reference/map#Map.fitBounds\n */\n fitBounds(bounds, padding) {\n this._assertInitialized();\n this.googleMap.fitBounds(bounds, padding);\n }\n /**\n * See\n * https://developers.google.com/maps/documentation/javascript/reference/map#Map.panBy\n */\n panBy(x, y) {\n this._assertInitialized();\n this.googleMap.panBy(x, y);\n }\n /**\n * See\n * https://developers.google.com/maps/documentation/javascript/reference/map#Map.panTo\n */\n panTo(latLng) {\n this._assertInitialized();\n this.googleMap.panTo(latLng);\n }\n /**\n * See\n * https://developers.google.com/maps/documentation/javascript/reference/map#Map.panToBounds\n */\n panToBounds(latLngBounds, padding) {\n this._assertInitialized();\n this.googleMap.panToBounds(latLngBounds, padding);\n }\n /**\n * See\n * https://developers.google.com/maps/documentation/javascript/reference/map#Map.getBounds\n */\n getBounds() {\n this._assertInitialized();\n return this.googleMap.getBounds() || null;\n }\n /**\n * See\n * https://developers.google.com/maps/documentation/javascript/reference/map#Map.getCenter\n */\n getCenter() {\n this._assertInitialized();\n return this.googleMap.getCenter();\n }\n /**\n * See\n * https://developers.google.com/maps/documentation/javascript/reference/map#Map.getClickableIcons\n */\n getClickableIcons() {\n this._assertInitialized();\n return this.googleMap.getClickableIcons();\n }\n /**\n * See\n * https://developers.google.com/maps/documentation/javascript/reference/map#Map.getHeading\n */\n getHeading() {\n this._assertInitialized();\n return this.googleMap.getHeading();\n }\n /**\n * See\n * https://developers.google.com/maps/documentation/javascript/reference/map#Map.getMapTypeId\n */\n getMapTypeId() {\n this._assertInitialized();\n return this.googleMap.getMapTypeId();\n }\n /**\n * See\n * https://developers.google.com/maps/documentation/javascript/reference/map#Map.getProjection\n */\n getProjection() {\n this._assertInitialized();\n return this.googleMap.getProjection();\n }\n /**\n * See\n * https://developers.google.com/maps/documentation/javascript/reference/map#Map.getStreetView\n */\n getStreetView() {\n this._assertInitialized();\n return this.googleMap.getStreetView();\n }\n /**\n * See\n * https://developers.google.com/maps/documentation/javascript/reference/map#Map.getTilt\n */\n getTilt() {\n this._assertInitialized();\n return this.googleMap.getTilt();\n }\n /**\n * See\n * https://developers.google.com/maps/documentation/javascript/reference/map#Map.getZoom\n */\n getZoom() {\n this._assertInitialized();\n return this.googleMap.getZoom();\n }\n /**\n * See\n * https://developers.google.com/maps/documentation/javascript/reference/map#Map.controls\n */\n get controls() {\n this._assertInitialized();\n return this.googleMap.controls;\n }\n /**\n * See\n * https://developers.google.com/maps/documentation/javascript/reference/map#Map.data\n */\n get data() {\n this._assertInitialized();\n return this.googleMap.data;\n }\n /**\n * See\n * https://developers.google.com/maps/documentation/javascript/reference/map#Map.mapTypes\n */\n get mapTypes() {\n this._assertInitialized();\n return this.googleMap.mapTypes;\n }\n /**\n * See\n * https://developers.google.com/maps/documentation/javascript/reference/map#Map.overlayMapTypes\n */\n get overlayMapTypes() {\n this._assertInitialized();\n return this.googleMap.overlayMapTypes;\n }\n _setSize() {\n if (this._mapEl) {\n const styles = this._mapEl.style;\n styles.height =\n this.height === null ? '' : (coerceCssPixelValue(this.height) || DEFAULT_HEIGHT);\n styles.width = this.width === null ? '' : (coerceCssPixelValue(this.width) || DEFAULT_WIDTH);\n }\n }\n /** Combines the center and zoom and the other map options into a single object */\n _combineOptions() {\n var _a, _b;\n const options = this._options || {};\n return Object.assign(Object.assign({}, options), { \n // It's important that we set **some** kind of `center` and `zoom`, otherwise\n // Google Maps will render a blank rectangle which looks broken.\n center: this._center || options.center || DEFAULT_OPTIONS.center, zoom: (_b = (_a = this._zoom) !== null && _a !== void 0 ? _a : options.zoom) !== null && _b !== void 0 ? _b : DEFAULT_OPTIONS.zoom, \n // Passing in an undefined `mapTypeId` seems to break tile loading\n // so make sure that we have some kind of default (see #22082).\n mapTypeId: this.mapTypeId || options.mapTypeId || DEFAULT_OPTIONS.mapTypeId });\n }\n /** Asserts that the map has been initialized. */\n _assertInitialized() {\n if (!this.googleMap && (typeof ngDevMode === 'undefined' || ngDevMode)) {\n throw Error('Cannot access Google Map information before the API has been initialized. ' +\n 'Please wait for the API to load before trying to interact with it.');\n }\n }\n}\nGoogleMap.ɵfac = function GoogleMap_Factory(t) { return new (t || GoogleMap)(ɵngcc0.ɵɵdirectiveInject(ɵngcc0.ElementRef), ɵngcc0.ɵɵdirectiveInject(ɵngcc0.NgZone), ɵngcc0.ɵɵdirectiveInject(PLATFORM_ID)); };\nGoogleMap.ɵcmp = /*@__PURE__*/ ɵngcc0.ɵɵdefineComponent({ type: GoogleMap, selectors: [[\"google-map\"]], inputs: { height: \"height\", width: \"width\", center: \"center\", zoom: \"zoom\", options: \"options\", mapTypeId: \"mapTypeId\" }, outputs: { authFailure: \"authFailure\", boundsChanged: \"boundsChanged\", centerChanged: \"centerChanged\", mapClick: \"mapClick\", mapDblclick: \"mapDblclick\", mapDrag: \"mapDrag\", mapDragend: \"mapDragend\", mapDragstart: \"mapDragstart\", headingChanged: \"headingChanged\", idle: \"idle\", maptypeidChanged: \"maptypeidChanged\", mapMousemove: \"mapMousemove\", mapMouseout: \"mapMouseout\", mapMouseover: \"mapMouseover\", projectionChanged: \"projectionChanged\", mapRightclick: \"mapRightclick\", tilesloaded: \"tilesloaded\", tiltChanged: \"tiltChanged\", zoomChanged: \"zoomChanged\" }, exportAs: [\"googleMap\"], features: [ɵngcc0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 2, vars: 0, consts: [[1, \"map-container\"]], template: function GoogleMap_Template(rf, ctx) { if (rf & 1) {\n ɵngcc0.ɵɵprojectionDef();\n ɵngcc0.ɵɵelement(0, \"div\", 0);\n ɵngcc0.ɵɵprojection(1);\n } }, encapsulation: 2, changeDetection: 0 });\nGoogleMap.ctorParameters = () => [\n { type: ElementRef },\n { type: NgZone },\n { type: Object, decorators: [{ type: Inject, args: [PLATFORM_ID,] }] }\n];\nGoogleMap.propDecorators = {\n height: [{ type: Input }],\n width: [{ type: Input }],\n mapTypeId: [{ type: Input }],\n center: [{ type: Input }],\n zoom: [{ type: Input }],\n options: [{ type: Input }],\n authFailure: [{ type: Output }],\n boundsChanged: [{ type: Output }],\n centerChanged: [{ type: Output }],\n mapClick: [{ type: Output }],\n mapDblclick: [{ type: Output }],\n mapDrag: [{ type: Output }],\n mapDragend: [{ type: Output }],\n mapDragstart: [{ type: Output }],\n headingChanged: [{ type: Output }],\n idle: [{ type: Output }],\n maptypeidChanged: [{ type: Output }],\n mapMousemove: [{ type: Output }],\n mapMouseout: [{ type: Output }],\n mapMouseover: [{ type: Output }],\n projectionChanged: [{ type: Output }],\n mapRightclick: [{ type: Output }],\n tilesloaded: [{ type: Output }],\n tiltChanged: [{ type: Output }],\n zoomChanged: [{ type: Output }]\n};\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(GoogleMap, [{\n type: Component,\n args: [{\n selector: 'google-map',\n exportAs: 'googleMap',\n changeDetection: ChangeDetectionStrategy.OnPush,\n template: '',\n encapsulation: ViewEncapsulation.None\n }]\n }], function () { return [{ type: ɵngcc0.ElementRef }, { type: ɵngcc0.NgZone }, { type: Object, decorators: [{\n type: Inject,\n args: [PLATFORM_ID]\n }] }]; }, { height: [{\n type: Input\n }], width: [{\n type: Input\n }], authFailure: [{\n type: Output\n }], boundsChanged: [{\n type: Output\n }], centerChanged: [{\n type: Output\n }], mapClick: [{\n type: Output\n }], mapDblclick: [{\n type: Output\n }], mapDrag: [{\n type: Output\n }], mapDragend: [{\n type: Output\n }], mapDragstart: [{\n type: Output\n }], headingChanged: [{\n type: Output\n }], idle: [{\n type: Output\n }], maptypeidChanged: [{\n type: Output\n }], mapMousemove: [{\n type: Output\n }], mapMouseout: [{\n type: Output\n }], mapMouseover: [{\n type: Output\n }], projectionChanged: [{\n type: Output\n }], mapRightclick: [{\n type: Output\n }], tilesloaded: [{\n type: Output\n }], tiltChanged: [{\n type: Output\n }], zoomChanged: [{\n type: Output\n }], center: [{\n type: Input\n }], zoom: [{\n type: Input\n }], options: [{\n type: Input\n }], mapTypeId: [{\n type: Input\n }] }); })();\nconst cssUnitsPattern = /([A-Za-z%]+)$/;\n/** Coerces a value to a CSS pixel value. */\nfunction coerceCssPixelValue(value) {\n if (value == null) {\n return '';\n }\n return cssUnitsPattern.test(value) ? value : `${value}px`;\n}\n\n/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\nclass MapBaseLayer {\n constructor(_map, _ngZone) {\n this._map = _map;\n this._ngZone = _ngZone;\n }\n ngOnInit() {\n if (this._map._isBrowser) {\n this._ngZone.runOutsideAngular(() => {\n this._initializeObject();\n });\n this._assertInitialized();\n this._setMap();\n }\n }\n ngOnDestroy() {\n this._unsetMap();\n }\n _assertInitialized() {\n if (!this._map.googleMap) {\n throw Error('Cannot access Google Map information before the API has been initialized. ' +\n 'Please wait for the API to load before trying to interact with it.');\n }\n }\n _initializeObject() { }\n _setMap() { }\n _unsetMap() { }\n}\nMapBaseLayer.ɵfac = function MapBaseLayer_Factory(t) { return new (t || MapBaseLayer)(ɵngcc0.ɵɵdirectiveInject(GoogleMap), ɵngcc0.ɵɵdirectiveInject(ɵngcc0.NgZone)); };\nMapBaseLayer.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: MapBaseLayer, selectors: [[\"map-base-layer\"]], exportAs: [\"mapBaseLayer\"] });\nMapBaseLayer.ctorParameters = () => [\n { type: GoogleMap },\n { type: NgZone }\n];\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(MapBaseLayer, [{\n type: Directive,\n args: [{\n selector: 'map-base-layer',\n exportAs: 'mapBaseLayer'\n }]\n }], function () { return [{ type: GoogleMap }, { type: ɵngcc0.NgZone }]; }, null); })();\n\n/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n/**\n * Angular component that renders a Google Maps Bicycling Layer via the Google Maps JavaScript API.\n *\n * See developers.google.com/maps/documentation/javascript/reference/map#BicyclingLayer\n */\nclass MapBicyclingLayer extends MapBaseLayer {\n _initializeObject() {\n this.bicyclingLayer = new google.maps.BicyclingLayer();\n }\n _setMap() {\n this._assertLayerInitialized();\n this.bicyclingLayer.setMap(this._map.googleMap);\n }\n _unsetMap() {\n if (this.bicyclingLayer) {\n this.bicyclingLayer.setMap(null);\n }\n }\n _assertLayerInitialized() {\n if (!this.bicyclingLayer) {\n throw Error('Cannot interact with a Google Map Bicycling Layer before it has been initialized. ' +\n 'Please wait for the Transit Layer to load before trying to interact with it.');\n }\n }\n}\nMapBicyclingLayer.ɵfac = /*@__PURE__*/ function () { let ɵMapBicyclingLayer_BaseFactory; return function MapBicyclingLayer_Factory(t) { return (ɵMapBicyclingLayer_BaseFactory || (ɵMapBicyclingLayer_BaseFactory = ɵngcc0.ɵɵgetInheritedFactory(MapBicyclingLayer)))(t || MapBicyclingLayer); }; }();\nMapBicyclingLayer.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: MapBicyclingLayer, selectors: [[\"map-bicycling-layer\"]], exportAs: [\"mapBicyclingLayer\"], features: [ɵngcc0.ɵɵInheritDefinitionFeature] });\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(MapBicyclingLayer, [{\n type: Directive,\n args: [{\n selector: 'map-bicycling-layer',\n exportAs: 'mapBicyclingLayer'\n }]\n }], null, null); })();\n\n/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n/**\n * Angular component that renders a Google Maps Circle via the Google Maps JavaScript API.\n * @see developers.google.com/maps/documentation/javascript/reference/polygon#Circle\n */\nclass MapCircle {\n constructor(_map, _ngZone) {\n this._map = _map;\n this._ngZone = _ngZone;\n this._eventManager = new MapEventManager(this._ngZone);\n this._options = new BehaviorSubject({});\n this._center = new BehaviorSubject(undefined);\n this._radius = new BehaviorSubject(undefined);\n this._destroyed = new Subject();\n /**\n * @see\n * developers.google.com/maps/documentation/javascript/reference/polygon#Circle.center_changed\n */\n this.centerChanged = this._eventManager.getLazyEmitter('center_changed');\n /**\n * @see\n * developers.google.com/maps/documentation/javascript/reference/polygon#Circle.click\n */\n this.circleClick = this._eventManager.getLazyEmitter('click');\n /**\n * @see\n * developers.google.com/maps/documentation/javascript/reference/polygon#Circle.dblclick\n */\n this.circleDblclick = this._eventManager.getLazyEmitter('dblclick');\n /**\n * @see\n * developers.google.com/maps/documentation/javascript/reference/polygon#Circle.drag\n */\n this.circleDrag = this._eventManager.getLazyEmitter('drag');\n /**\n * @see\n * developers.google.com/maps/documentation/javascript/reference/polygon#Circle.dragend\n */\n this.circleDragend = this._eventManager.getLazyEmitter('dragend');\n /**\n * @see\n * developers.google.com/maps/documentation/javascript/reference/polygon#Circle.dragstart\n */\n this.circleDragstart = this._eventManager.getLazyEmitter('dragstart');\n /**\n * @see\n * developers.google.com/maps/documentation/javascript/reference/polygon#Circle.mousedown\n */\n this.circleMousedown = this._eventManager.getLazyEmitter('mousedown');\n /**\n * @see\n * developers.google.com/maps/documentation/javascript/reference/polygon#Circle.mousemove\n */\n this.circleMousemove = this._eventManager.getLazyEmitter('mousemove');\n /**\n * @see\n * developers.google.com/maps/documentation/javascript/reference/polygon#Circle.mouseout\n */\n this.circleMouseout = this._eventManager.getLazyEmitter('mouseout');\n /**\n * @see\n * developers.google.com/maps/documentation/javascript/reference/polygon#Circle.mouseover\n */\n this.circleMouseover = this._eventManager.getLazyEmitter('mouseover');\n /**\n * @see\n * developers.google.com/maps/documentation/javascript/reference/polygon#Circle.mouseup\n */\n this.circleMouseup = this._eventManager.getLazyEmitter('mouseup');\n /**\n * @see\n * developers.google.com/maps/documentation/javascript/reference/polygon#Circle.radius_changed\n */\n this.radiusChanged = this._eventManager.getLazyEmitter('radius_changed');\n /**\n * @see\n * developers.google.com/maps/documentation/javascript/reference/polygon#Circle.rightclick\n */\n this.circleRightclick = this._eventManager.getLazyEmitter('rightclick');\n }\n set options(options) {\n this._options.next(options || {});\n }\n set center(center) {\n this._center.next(center);\n }\n set radius(radius) {\n this._radius.next(radius);\n }\n ngOnInit() {\n if (this._map._isBrowser) {\n this._combineOptions().pipe(take(1)).subscribe(options => {\n // Create the object outside the zone so its events don't trigger change detection.\n // We'll bring it back in inside the `MapEventManager` only for the events that the\n // user has subscribed to.\n this._ngZone.runOutsideAngular(() => {\n this.circle = new google.maps.Circle(options);\n });\n this._assertInitialized();\n this.circle.setMap(this._map.googleMap);\n this._eventManager.setTarget(this.circle);\n });\n this._watchForOptionsChanges();\n this._watchForCenterChanges();\n this._watchForRadiusChanges();\n }\n }\n ngOnDestroy() {\n this._eventManager.destroy();\n this._destroyed.next();\n this._destroyed.complete();\n if (this.circle) {\n this.circle.setMap(null);\n }\n }\n /**\n * @see\n * developers.google.com/maps/documentation/javascript/reference/polygon#Circle.getBounds\n */\n getBounds() {\n this._assertInitialized();\n return this.circle.getBounds();\n }\n /**\n * @see\n * developers.google.com/maps/documentation/javascript/reference/polygon#Circle.getCenter\n */\n getCenter() {\n this._assertInitialized();\n return this.circle.getCenter();\n }\n /**\n * @see\n * developers.google.com/maps/documentation/javascript/reference/polygon#Circle.getDraggable\n */\n getDraggable() {\n this._assertInitialized();\n return this.circle.getDraggable();\n }\n /**\n * @see\n * developers.google.com/maps/documentation/javascript/reference/polygon#Circle.getEditable\n */\n getEditable() {\n this._assertInitialized();\n return this.circle.getEditable();\n }\n /**\n * @see\n * developers.google.com/maps/documentation/javascript/reference/polygon#Circle.getRadius\n */\n getRadius() {\n this._assertInitialized();\n return this.circle.getRadius();\n }\n /**\n * @see\n * developers.google.com/maps/documentation/javascript/reference/polygon#Circle.getVisible\n */\n getVisible() {\n this._assertInitialized();\n return this.circle.getVisible();\n }\n _combineOptions() {\n return combineLatest([this._options, this._center, this._radius])\n .pipe(map(([options, center, radius]) => {\n const combinedOptions = Object.assign(Object.assign({}, options), { center: center || options.center, radius: radius !== undefined ? radius : options.radius });\n return combinedOptions;\n }));\n }\n _watchForOptionsChanges() {\n this._options.pipe(takeUntil(this._destroyed)).subscribe(options => {\n this._assertInitialized();\n this.circle.setOptions(options);\n });\n }\n _watchForCenterChanges() {\n this._center.pipe(takeUntil(this._destroyed)).subscribe(center => {\n if (center) {\n this._assertInitialized();\n this.circle.setCenter(center);\n }\n });\n }\n _watchForRadiusChanges() {\n this._radius.pipe(takeUntil(this._destroyed)).subscribe(radius => {\n if (radius !== undefined) {\n this._assertInitialized();\n this.circle.setRadius(radius);\n }\n });\n }\n _assertInitialized() {\n if (typeof ngDevMode === 'undefined' || ngDevMode) {\n if (!this._map.googleMap) {\n throw Error('Cannot access Google Map information before the API has been initialized. ' +\n 'Please wait for the API to load before trying to interact with it.');\n }\n if (!this.circle) {\n throw Error('Cannot interact with a Google Map Circle before it has been ' +\n 'initialized. Please wait for the Circle to load before trying to interact with it.');\n }\n }\n }\n}\nMapCircle.ɵfac = function MapCircle_Factory(t) { return new (t || MapCircle)(ɵngcc0.ɵɵdirectiveInject(GoogleMap), ɵngcc0.ɵɵdirectiveInject(ɵngcc0.NgZone)); };\nMapCircle.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: MapCircle, selectors: [[\"map-circle\"]], inputs: { options: \"options\", center: \"center\", radius: \"radius\" }, outputs: { centerChanged: \"centerChanged\", circleClick: \"circleClick\", circleDblclick: \"circleDblclick\", circleDrag: \"circleDrag\", circleDragend: \"circleDragend\", circleDragstart: \"circleDragstart\", circleMousedown: \"circleMousedown\", circleMousemove: \"circleMousemove\", circleMouseout: \"circleMouseout\", circleMouseover: \"circleMouseover\", circleMouseup: \"circleMouseup\", radiusChanged: \"radiusChanged\", circleRightclick: \"circleRightclick\" }, exportAs: [\"mapCircle\"] });\nMapCircle.ctorParameters = () => [\n { type: GoogleMap },\n { type: NgZone }\n];\nMapCircle.propDecorators = {\n options: [{ type: Input }],\n center: [{ type: Input }],\n radius: [{ type: Input }],\n centerChanged: [{ type: Output }],\n circleClick: [{ type: Output }],\n circleDblclick: [{ type: Output }],\n circleDrag: [{ type: Output }],\n circleDragend: [{ type: Output }],\n circleDragstart: [{ type: Output }],\n circleMousedown: [{ type: Output }],\n circleMousemove: [{ type: Output }],\n circleMouseout: [{ type: Output }],\n circleMouseover: [{ type: Output }],\n circleMouseup: [{ type: Output }],\n radiusChanged: [{ type: Output }],\n circleRightclick: [{ type: Output }]\n};\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(MapCircle, [{\n type: Directive,\n args: [{\n selector: 'map-circle',\n exportAs: 'mapCircle'\n }]\n }], function () { return [{ type: GoogleMap }, { type: ɵngcc0.NgZone }]; }, { centerChanged: [{\n type: Output\n }], circleClick: [{\n type: Output\n }], circleDblclick: [{\n type: Output\n }], circleDrag: [{\n type: Output\n }], circleDragend: [{\n type: Output\n }], circleDragstart: [{\n type: Output\n }], circleMousedown: [{\n type: Output\n }], circleMousemove: [{\n type: Output\n }], circleMouseout: [{\n type: Output\n }], circleMouseover: [{\n type: Output\n }], circleMouseup: [{\n type: Output\n }], radiusChanged: [{\n type: Output\n }], circleRightclick: [{\n type: Output\n }], options: [{\n type: Input\n }], center: [{\n type: Input\n }], radius: [{\n type: Input\n }] }); })();\n\n/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n/**\n * Angular component that renders a Google Maps Directions Renderer via the Google Maps\n * JavaScript API.\n *\n * See developers.google.com/maps/documentation/javascript/reference/directions#DirectionsRenderer\n */\nclass MapDirectionsRenderer {\n constructor(_googleMap, _ngZone) {\n this._googleMap = _googleMap;\n this._ngZone = _ngZone;\n this._eventManager = new MapEventManager(this._ngZone);\n /**\n * See developers.google.com/maps/documentation/javascript/reference/directions\n * #DirectionsRenderer.directions_changed\n */\n this.directionsChanged = this._eventManager.getLazyEmitter('directions_changed');\n }\n /**\n * See developers.google.com/maps/documentation/javascript/reference/directions\n * #DirectionsRendererOptions.directions\n */\n set directions(directions) {\n this._directions = directions;\n }\n /**\n * See developers.google.com/maps/documentation/javascript/reference/directions\n * #DirectionsRendererOptions\n */\n set options(options) {\n this._options = options;\n }\n ngOnInit() {\n if (this._googleMap._isBrowser) {\n // Create the object outside the zone so its events don't trigger change detection.\n // We'll bring it back in inside the `MapEventManager` only for the events that the\n // user has subscribed to.\n this._ngZone.runOutsideAngular(() => {\n this.directionsRenderer = new google.maps.DirectionsRenderer(this._combineOptions());\n });\n this._assertInitialized();\n this.directionsRenderer.setMap(this._googleMap.googleMap);\n this._eventManager.setTarget(this.directionsRenderer);\n }\n }\n ngOnChanges(changes) {\n if (this.directionsRenderer) {\n if (changes['options']) {\n this.directionsRenderer.setOptions(this._combineOptions());\n }\n if (changes['directions'] && this._directions !== undefined) {\n this.directionsRenderer.setDirections(this._directions);\n }\n }\n }\n ngOnDestroy() {\n this._eventManager.destroy();\n if (this.directionsRenderer) {\n this.directionsRenderer.setMap(null);\n }\n }\n /**\n * See developers.google.com/maps/documentation/javascript/reference/directions\n * #DirectionsRenderer.getDirections\n */\n getDirections() {\n this._assertInitialized();\n return this.directionsRenderer.getDirections();\n }\n /**\n * See developers.google.com/maps/documentation/javascript/reference/directions\n * #DirectionsRenderer.getPanel\n */\n getPanel() {\n this._assertInitialized();\n return this.directionsRenderer.getPanel();\n }\n /**\n * See developers.google.com/maps/documentation/javascript/reference/directions\n * #DirectionsRenderer.getRouteIndex\n */\n getRouteIndex() {\n this._assertInitialized();\n return this.directionsRenderer.getRouteIndex();\n }\n _combineOptions() {\n const options = this._options || {};\n return Object.assign(Object.assign({}, options), { directions: this._directions || options.directions, map: this._googleMap.googleMap });\n }\n _assertInitialized() {\n if (typeof ngDevMode === 'undefined' || ngDevMode) {\n if (!this._googleMap.googleMap) {\n throw Error('Cannot access Google Map information before the API has been initialized. ' +\n 'Please wait for the API to load before trying to interact with it.');\n }\n if (!this.directionsRenderer) {\n throw Error('Cannot interact with a Google Map Directions Renderer before it has been ' +\n 'initialized. Please wait for the Directions Renderer to load before trying ' +\n 'to interact with it.');\n }\n }\n }\n}\nMapDirectionsRenderer.ɵfac = function MapDirectionsRenderer_Factory(t) { return new (t || MapDirectionsRenderer)(ɵngcc0.ɵɵdirectiveInject(GoogleMap), ɵngcc0.ɵɵdirectiveInject(ɵngcc0.NgZone)); };\nMapDirectionsRenderer.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: MapDirectionsRenderer, selectors: [[\"map-directions-renderer\"]], inputs: { directions: \"directions\", options: \"options\" }, outputs: { directionsChanged: \"directionsChanged\" }, exportAs: [\"mapDirectionsRenderer\"], features: [ɵngcc0.ɵɵNgOnChangesFeature] });\nMapDirectionsRenderer.ctorParameters = () => [\n { type: GoogleMap },\n { type: NgZone }\n];\nMapDirectionsRenderer.propDecorators = {\n directions: [{ type: Input }],\n options: [{ type: Input }],\n directionsChanged: [{ type: Output }]\n};\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(MapDirectionsRenderer, [{\n type: Directive,\n args: [{\n selector: 'map-directions-renderer',\n exportAs: 'mapDirectionsRenderer'\n }]\n }], function () { return [{ type: GoogleMap }, { type: ɵngcc0.NgZone }]; }, { directionsChanged: [{\n type: Output\n }], directions: [{\n type: Input\n }], options: [{\n type: Input\n }] }); })();\n\n/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n/**\n * Angular component that renders a Google Maps Ground Overlay via the Google Maps JavaScript API.\n *\n * See developers.google.com/maps/documentation/javascript/reference/image-overlay#GroundOverlay\n */\nclass MapGroundOverlay {\n constructor(_map, _ngZone) {\n this._map = _map;\n this._ngZone = _ngZone;\n this._eventManager = new MapEventManager(this._ngZone);\n this._opacity = new BehaviorSubject(1);\n this._url = new BehaviorSubject('');\n this._bounds = new BehaviorSubject(undefined);\n this._destroyed = new Subject();\n /** Whether the overlay is clickable */\n this.clickable = false;\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/image-overlay#GroundOverlay.click\n */\n this.mapClick = this._eventManager.getLazyEmitter('click');\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/image-overlay\n * #GroundOverlay.dblclick\n */\n this.mapDblclick = this._eventManager.getLazyEmitter('dblclick');\n }\n /** URL of the image that will be shown in the overlay. */\n set url(url) {\n this._url.next(url);\n }\n /** Bounds for the overlay. */\n get bounds() {\n return this._bounds.value;\n }\n set bounds(bounds) {\n this._bounds.next(bounds);\n }\n /** Opacity of the overlay. */\n set opacity(opacity) {\n this._opacity.next(opacity);\n }\n ngOnInit() {\n if (this._map._isBrowser) {\n // The ground overlay setup is slightly different from the other Google Maps objects in that\n // we have to recreate the `GroundOverlay` object whenever the bounds change, because\n // Google Maps doesn't provide an API to update the bounds of an existing overlay.\n this._bounds.pipe(takeUntil(this._destroyed)).subscribe(bounds => {\n if (this.groundOverlay) {\n this.groundOverlay.setMap(null);\n this.groundOverlay = undefined;\n }\n // Create the object outside the zone so its events don't trigger change detection.\n // We'll bring it back in inside the `MapEventManager` only for the events that the\n // user has subscribed to.\n if (bounds) {\n this._ngZone.runOutsideAngular(() => {\n this.groundOverlay = new google.maps.GroundOverlay(this._url.getValue(), bounds, {\n clickable: this.clickable,\n opacity: this._opacity.value,\n });\n });\n this._assertInitialized();\n this.groundOverlay.setMap(this._map.googleMap);\n this._eventManager.setTarget(this.groundOverlay);\n }\n });\n this._watchForOpacityChanges();\n this._watchForUrlChanges();\n }\n }\n ngOnDestroy() {\n this._eventManager.destroy();\n this._destroyed.next();\n this._destroyed.complete();\n if (this.groundOverlay) {\n this.groundOverlay.setMap(null);\n }\n }\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/image-overlay\n * #GroundOverlay.getBounds\n */\n getBounds() {\n this._assertInitialized();\n return this.groundOverlay.getBounds();\n }\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/image-overlay\n * #GroundOverlay.getOpacity\n */\n getOpacity() {\n this._assertInitialized();\n return this.groundOverlay.getOpacity();\n }\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/image-overlay\n * #GroundOverlay.getUrl\n */\n getUrl() {\n this._assertInitialized();\n return this.groundOverlay.getUrl();\n }\n _watchForOpacityChanges() {\n this._opacity.pipe(takeUntil(this._destroyed)).subscribe(opacity => {\n if (opacity != null) {\n this._assertInitialized();\n this.groundOverlay.setOpacity(opacity);\n }\n });\n }\n _watchForUrlChanges() {\n this._url.pipe(takeUntil(this._destroyed)).subscribe(url => {\n this._assertInitialized();\n const overlay = this.groundOverlay;\n overlay.set('url', url);\n // Google Maps only redraws the overlay if we re-set the map.\n overlay.setMap(null);\n overlay.setMap(this._map.googleMap);\n });\n }\n _assertInitialized() {\n if (typeof ngDevMode === 'undefined' || ngDevMode) {\n if (!this._map.googleMap) {\n throw Error('Cannot access Google Map information before the API has been initialized. ' +\n 'Please wait for the API to load before trying to interact with it.');\n }\n if (!this.groundOverlay) {\n throw Error('Cannot interact with a Google Map GroundOverlay before it has been initialized. ' +\n 'Please wait for the GroundOverlay to load before trying to interact with it.');\n }\n }\n }\n}\nMapGroundOverlay.ɵfac = function MapGroundOverlay_Factory(t) { return new (t || MapGroundOverlay)(ɵngcc0.ɵɵdirectiveInject(GoogleMap), ɵngcc0.ɵɵdirectiveInject(ɵngcc0.NgZone)); };\nMapGroundOverlay.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: MapGroundOverlay, selectors: [[\"map-ground-overlay\"]], inputs: { clickable: \"clickable\", url: \"url\", bounds: \"bounds\", opacity: \"opacity\" }, outputs: { mapClick: \"mapClick\", mapDblclick: \"mapDblclick\" }, exportAs: [\"mapGroundOverlay\"] });\nMapGroundOverlay.ctorParameters = () => [\n { type: GoogleMap },\n { type: NgZone }\n];\nMapGroundOverlay.propDecorators = {\n url: [{ type: Input }],\n bounds: [{ type: Input }],\n clickable: [{ type: Input }],\n opacity: [{ type: Input }],\n mapClick: [{ type: Output }],\n mapDblclick: [{ type: Output }]\n};\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(MapGroundOverlay, [{\n type: Directive,\n args: [{\n selector: 'map-ground-overlay',\n exportAs: 'mapGroundOverlay'\n }]\n }], function () { return [{ type: GoogleMap }, { type: ɵngcc0.NgZone }]; }, { clickable: [{\n type: Input\n }], mapClick: [{\n type: Output\n }], mapDblclick: [{\n type: Output\n }], url: [{\n type: Input\n }], bounds: [{\n type: Input\n }], opacity: [{\n type: Input\n }] }); })();\n\n/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n/**\n * Angular component that renders a Google Maps info window via the Google Maps JavaScript API.\n *\n * See developers.google.com/maps/documentation/javascript/reference/info-window\n */\nclass MapInfoWindow {\n constructor(_googleMap, _elementRef, _ngZone) {\n this._googleMap = _googleMap;\n this._elementRef = _elementRef;\n this._ngZone = _ngZone;\n this._eventManager = new MapEventManager(this._ngZone);\n this._options = new BehaviorSubject({});\n this._position = new BehaviorSubject(undefined);\n this._destroy = new Subject();\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/info-window#InfoWindow.closeclick\n */\n this.closeclick = this._eventManager.getLazyEmitter('closeclick');\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/info-window\n * #InfoWindow.content_changed\n */\n this.contentChanged = this._eventManager.getLazyEmitter('content_changed');\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/info-window#InfoWindow.domready\n */\n this.domready = this._eventManager.getLazyEmitter('domready');\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/info-window\n * #InfoWindow.position_changed\n */\n this.positionChanged = this._eventManager.getLazyEmitter('position_changed');\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/info-window\n * #InfoWindow.zindex_changed\n */\n this.zindexChanged = this._eventManager.getLazyEmitter('zindex_changed');\n }\n set options(options) {\n this._options.next(options || {});\n }\n set position(position) {\n this._position.next(position);\n }\n ngOnInit() {\n if (this._googleMap._isBrowser) {\n const combinedOptionsChanges = this._combineOptions();\n combinedOptionsChanges.pipe(take(1)).subscribe(options => {\n // Create the object outside the zone so its events don't trigger change detection.\n // We'll bring it back in inside the `MapEventManager` only for the events that the\n // user has subscribed to.\n this._ngZone.runOutsideAngular(() => {\n this.infoWindow = new google.maps.InfoWindow(options);\n });\n this._eventManager.setTarget(this.infoWindow);\n });\n this._watchForOptionsChanges();\n this._watchForPositionChanges();\n }\n }\n ngOnDestroy() {\n this._eventManager.destroy();\n this._destroy.next();\n this._destroy.complete();\n // If no info window has been created on the server, we do not try closing it.\n // On the server, an info window cannot be created and this would cause errors.\n if (this.infoWindow) {\n this.close();\n }\n }\n /**\n * See developers.google.com/maps/documentation/javascript/reference/info-window#InfoWindow.close\n */\n close() {\n this._assertInitialized();\n this.infoWindow.close();\n }\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/info-window#InfoWindow.getContent\n */\n getContent() {\n this._assertInitialized();\n return this.infoWindow.getContent();\n }\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/info-window\n * #InfoWindow.getPosition\n */\n getPosition() {\n this._assertInitialized();\n return this.infoWindow.getPosition();\n }\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/info-window#InfoWindow.getZIndex\n */\n getZIndex() {\n this._assertInitialized();\n return this.infoWindow.getZIndex();\n }\n /**\n * Opens the MapInfoWindow using the provided anchor. If the anchor is not set,\n * then the position property of the options input is used instead.\n */\n open(anchor) {\n this._assertInitialized();\n const anchorObject = anchor ? anchor.getAnchor() : undefined;\n // Prevent the info window from initializing when trying to reopen on the same anchor.\n // Note that when the window is opened for the first time, the anchor will always be\n // undefined. If that's the case, we have to allow it to open in order to handle the\n // case where the window doesn't have an anchor, but is placed at a particular position.\n if (this.infoWindow.get('anchor') !== anchorObject || !anchorObject) {\n this._elementRef.nativeElement.style.display = '';\n this.infoWindow.open(this._googleMap.googleMap, anchorObject);\n }\n }\n _combineOptions() {\n return combineLatest([this._options, this._position]).pipe(map(([options, position]) => {\n const combinedOptions = Object.assign(Object.assign({}, options), { position: position || options.position, content: this._elementRef.nativeElement });\n return combinedOptions;\n }));\n }\n _watchForOptionsChanges() {\n this._options.pipe(takeUntil(this._destroy)).subscribe(options => {\n this._assertInitialized();\n this.infoWindow.setOptions(options);\n });\n }\n _watchForPositionChanges() {\n this._position.pipe(takeUntil(this._destroy)).subscribe(position => {\n if (position) {\n this._assertInitialized();\n this.infoWindow.setPosition(position);\n }\n });\n }\n _assertInitialized() {\n if (typeof ngDevMode === 'undefined' || ngDevMode) {\n if (!this._googleMap.googleMap) {\n throw Error('Cannot access Google Map information before the API has been initialized. ' +\n 'Please wait for the API to load before trying to interact with it.');\n }\n if (!this.infoWindow) {\n throw Error('Cannot interact with a Google Map Info Window before it has been ' +\n 'initialized. Please wait for the Info Window to load before trying to interact with ' +\n 'it.');\n }\n }\n }\n}\nMapInfoWindow.ɵfac = function MapInfoWindow_Factory(t) { return new (t || MapInfoWindow)(ɵngcc0.ɵɵdirectiveInject(GoogleMap), ɵngcc0.ɵɵdirectiveInject(ɵngcc0.ElementRef), ɵngcc0.ɵɵdirectiveInject(ɵngcc0.NgZone)); };\nMapInfoWindow.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: MapInfoWindow, selectors: [[\"map-info-window\"]], hostAttrs: [2, \"display\", \"none\"], inputs: { options: \"options\", position: \"position\" }, outputs: { closeclick: \"closeclick\", contentChanged: \"contentChanged\", domready: \"domready\", positionChanged: \"positionChanged\", zindexChanged: \"zindexChanged\" }, exportAs: [\"mapInfoWindow\"] });\nMapInfoWindow.ctorParameters = () => [\n { type: GoogleMap },\n { type: ElementRef },\n { type: NgZone }\n];\nMapInfoWindow.propDecorators = {\n options: [{ type: Input }],\n position: [{ type: Input }],\n closeclick: [{ type: Output }],\n contentChanged: [{ type: Output }],\n domready: [{ type: Output }],\n positionChanged: [{ type: Output }],\n zindexChanged: [{ type: Output }]\n};\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(MapInfoWindow, [{\n type: Directive,\n args: [{\n selector: 'map-info-window',\n exportAs: 'mapInfoWindow',\n host: { 'style': 'display: none' }\n }]\n }], function () { return [{ type: GoogleMap }, { type: ɵngcc0.ElementRef }, { type: ɵngcc0.NgZone }]; }, { closeclick: [{\n type: Output\n }], contentChanged: [{\n type: Output\n }], domready: [{\n type: Output\n }], positionChanged: [{\n type: Output\n }], zindexChanged: [{\n type: Output\n }], options: [{\n type: Input\n }], position: [{\n type: Input\n }] }); })();\n\n/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n/**\n * Angular component that renders a Google Maps KML Layer via the Google Maps JavaScript API.\n *\n * See developers.google.com/maps/documentation/javascript/reference/kml#KmlLayer\n */\nclass MapKmlLayer {\n constructor(_map, _ngZone) {\n this._map = _map;\n this._ngZone = _ngZone;\n this._eventManager = new MapEventManager(this._ngZone);\n this._options = new BehaviorSubject({});\n this._url = new BehaviorSubject('');\n this._destroyed = new Subject();\n /**\n * See developers.google.com/maps/documentation/javascript/reference/kml#KmlLayer.click\n */\n this.kmlClick = this._eventManager.getLazyEmitter('click');\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/kml\n * #KmlLayer.defaultviewport_changed\n */\n this.defaultviewportChanged = this._eventManager.getLazyEmitter('defaultviewport_changed');\n /**\n * See developers.google.com/maps/documentation/javascript/reference/kml#KmlLayer.status_changed\n */\n this.statusChanged = this._eventManager.getLazyEmitter('status_changed');\n }\n set options(options) {\n this._options.next(options || {});\n }\n set url(url) {\n this._url.next(url);\n }\n ngOnInit() {\n if (this._map._isBrowser) {\n this._combineOptions().pipe(take(1)).subscribe(options => {\n // Create the object outside the zone so its events don't trigger change detection.\n // We'll bring it back in inside the `MapEventManager` only for the events that the\n // user has subscribed to.\n this._ngZone.runOutsideAngular(() => this.kmlLayer = new google.maps.KmlLayer(options));\n this._assertInitialized();\n this.kmlLayer.setMap(this._map.googleMap);\n this._eventManager.setTarget(this.kmlLayer);\n });\n this._watchForOptionsChanges();\n this._watchForUrlChanges();\n }\n }\n ngOnDestroy() {\n this._eventManager.destroy();\n this._destroyed.next();\n this._destroyed.complete();\n if (this.kmlLayer) {\n this.kmlLayer.setMap(null);\n }\n }\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/kml#KmlLayer.getDefaultViewport\n */\n getDefaultViewport() {\n this._assertInitialized();\n return this.kmlLayer.getDefaultViewport();\n }\n /**\n * See developers.google.com/maps/documentation/javascript/reference/kml#KmlLayer.getMetadata\n */\n getMetadata() {\n this._assertInitialized();\n return this.kmlLayer.getMetadata();\n }\n /**\n * See developers.google.com/maps/documentation/javascript/reference/kml#KmlLayer.getStatus\n */\n getStatus() {\n this._assertInitialized();\n return this.kmlLayer.getStatus();\n }\n /**\n * See developers.google.com/maps/documentation/javascript/reference/kml#KmlLayer.getUrl\n */\n getUrl() {\n this._assertInitialized();\n return this.kmlLayer.getUrl();\n }\n /**\n * See developers.google.com/maps/documentation/javascript/reference/kml#KmlLayer.getZIndex\n */\n getZIndex() {\n this._assertInitialized();\n return this.kmlLayer.getZIndex();\n }\n _combineOptions() {\n return combineLatest([this._options, this._url]).pipe(map(([options, url]) => {\n const combinedOptions = Object.assign(Object.assign({}, options), { url: url || options.url });\n return combinedOptions;\n }));\n }\n _watchForOptionsChanges() {\n this._options.pipe(takeUntil(this._destroyed)).subscribe(options => {\n if (this.kmlLayer) {\n this._assertInitialized();\n this.kmlLayer.setOptions(options);\n }\n });\n }\n _watchForUrlChanges() {\n this._url.pipe(takeUntil(this._destroyed)).subscribe(url => {\n if (url && this.kmlLayer) {\n this._assertInitialized();\n this.kmlLayer.setUrl(url);\n }\n });\n }\n _assertInitialized() {\n if (typeof ngDevMode === 'undefined' || ngDevMode) {\n if (!this._map.googleMap) {\n throw Error('Cannot access Google Map information before the API has been initialized. ' +\n 'Please wait for the API to load before trying to interact with it.');\n }\n if (!this.kmlLayer) {\n throw Error('Cannot interact with a Google Map KmlLayer before it has been ' +\n 'initialized. Please wait for the KmlLayer to load before trying to interact with it.');\n }\n }\n }\n}\nMapKmlLayer.ɵfac = function MapKmlLayer_Factory(t) { return new (t || MapKmlLayer)(ɵngcc0.ɵɵdirectiveInject(GoogleMap), ɵngcc0.ɵɵdirectiveInject(ɵngcc0.NgZone)); };\nMapKmlLayer.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: MapKmlLayer, selectors: [[\"map-kml-layer\"]], inputs: { options: \"options\", url: \"url\" }, outputs: { kmlClick: \"kmlClick\", defaultviewportChanged: \"defaultviewportChanged\", statusChanged: \"statusChanged\" }, exportAs: [\"mapKmlLayer\"] });\nMapKmlLayer.ctorParameters = () => [\n { type: GoogleMap },\n { type: NgZone }\n];\nMapKmlLayer.propDecorators = {\n options: [{ type: Input }],\n url: [{ type: Input }],\n kmlClick: [{ type: Output }],\n defaultviewportChanged: [{ type: Output }],\n statusChanged: [{ type: Output }]\n};\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(MapKmlLayer, [{\n type: Directive,\n args: [{\n selector: 'map-kml-layer',\n exportAs: 'mapKmlLayer'\n }]\n }], function () { return [{ type: GoogleMap }, { type: ɵngcc0.NgZone }]; }, { kmlClick: [{\n type: Output\n }], defaultviewportChanged: [{\n type: Output\n }], statusChanged: [{\n type: Output\n }], options: [{\n type: Input\n }], url: [{\n type: Input\n }] }); })();\n\n/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n/**\n * Default options for the Google Maps marker component. Displays a marker\n * at the Googleplex.\n */\nconst DEFAULT_MARKER_OPTIONS = {\n position: { lat: 37.421995, lng: -122.084092 },\n};\n/**\n * Angular component that renders a Google Maps marker via the Google Maps JavaScript API.\n *\n * See developers.google.com/maps/documentation/javascript/reference/marker\n */\nclass MapMarker {\n constructor(_googleMap, _ngZone) {\n this._googleMap = _googleMap;\n this._ngZone = _ngZone;\n this._eventManager = new MapEventManager(this._ngZone);\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/marker#Marker.animation_changed\n */\n this.animationChanged = this._eventManager.getLazyEmitter('animation_changed');\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/marker#Marker.click\n */\n this.mapClick = this._eventManager.getLazyEmitter('click');\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/marker#Marker.clickable_changed\n */\n this.clickableChanged = this._eventManager.getLazyEmitter('clickable_changed');\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/marker#Marker.cursor_changed\n */\n this.cursorChanged = this._eventManager.getLazyEmitter('cursor_changed');\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/marker#Marker.dblclick\n */\n this.mapDblclick = this._eventManager.getLazyEmitter('dblclick');\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/marker#Marker.drag\n */\n this.mapDrag = this._eventManager.getLazyEmitter('drag');\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/marker#Marker.dragend\n */\n this.mapDragend = this._eventManager.getLazyEmitter('dragend');\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/marker#Marker.draggable_changed\n */\n this.draggableChanged = this._eventManager.getLazyEmitter('draggable_changed');\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/marker#Marker.dragstart\n */\n this.mapDragstart = this._eventManager.getLazyEmitter('dragstart');\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/marker#Marker.flat_changed\n */\n this.flatChanged = this._eventManager.getLazyEmitter('flat_changed');\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/marker#Marker.icon_changed\n */\n this.iconChanged = this._eventManager.getLazyEmitter('icon_changed');\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/marker#Marker.mousedown\n */\n this.mapMousedown = this._eventManager.getLazyEmitter('mousedown');\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/marker#Marker.mouseout\n */\n this.mapMouseout = this._eventManager.getLazyEmitter('mouseout');\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/marker#Marker.mouseover\n */\n this.mapMouseover = this._eventManager.getLazyEmitter('mouseover');\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/marker#Marker.mouseup\n */\n this.mapMouseup = this._eventManager.getLazyEmitter('mouseup');\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/marker#Marker.position_changed\n */\n this.positionChanged = this._eventManager.getLazyEmitter('position_changed');\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/marker#Marker.rightclick\n */\n this.mapRightclick = this._eventManager.getLazyEmitter('rightclick');\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/marker#Marker.shape_changed\n */\n this.shapeChanged = this._eventManager.getLazyEmitter('shape_changed');\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/marker#Marker.title_changed\n */\n this.titleChanged = this._eventManager.getLazyEmitter('title_changed');\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/marker#Marker.visible_changed\n */\n this.visibleChanged = this._eventManager.getLazyEmitter('visible_changed');\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/marker#Marker.zindex_changed\n */\n this.zindexChanged = this._eventManager.getLazyEmitter('zindex_changed');\n }\n /**\n * Title of the marker.\n * See: developers.google.com/maps/documentation/javascript/reference/marker#MarkerOptions.title\n */\n set title(title) {\n this._title = title;\n }\n /**\n * Position of the marker. See:\n * developers.google.com/maps/documentation/javascript/reference/marker#MarkerOptions.position\n */\n set position(position) {\n this._position = position;\n }\n /**\n * Label for the marker.\n * See: developers.google.com/maps/documentation/javascript/reference/marker#MarkerOptions.label\n */\n set label(label) {\n this._label = label;\n }\n /**\n * Whether the marker is clickable. See:\n * developers.google.com/maps/documentation/javascript/reference/marker#MarkerOptions.clickable\n */\n set clickable(clickable) {\n this._clickable = clickable;\n }\n /**\n * Options used to configure the marker.\n * See: developers.google.com/maps/documentation/javascript/reference/marker#MarkerOptions\n */\n set options(options) {\n this._options = options;\n }\n /**\n * Icon to be used for the marker.\n * See: https://developers.google.com/maps/documentation/javascript/reference/marker#Icon\n */\n set icon(icon) {\n this._icon = icon;\n }\n /**\n * Whether the marker is visible.\n * See: developers.google.com/maps/documentation/javascript/reference/marker#MarkerOptions.visible\n */\n set visible(value) {\n this._visible = value;\n }\n ngOnInit() {\n if (this._googleMap._isBrowser) {\n // Create the object outside the zone so its events don't trigger change detection.\n // We'll bring it back in inside the `MapEventManager` only for the events that the\n // user has subscribed to.\n this._ngZone.runOutsideAngular(() => {\n this.marker = new google.maps.Marker(this._combineOptions());\n });\n this._assertInitialized();\n this.marker.setMap(this._googleMap.googleMap);\n this._eventManager.setTarget(this.marker);\n }\n }\n ngOnChanges(changes) {\n const { marker, _title, _position, _label, _clickable, _icon, _visible } = this;\n if (marker) {\n if (changes['options']) {\n marker.setOptions(this._combineOptions());\n }\n if (changes['title'] && _title !== undefined) {\n marker.setTitle(_title);\n }\n if (changes['position'] && _position) {\n marker.setPosition(_position);\n }\n if (changes['label'] && _label !== undefined) {\n marker.setLabel(_label);\n }\n if (changes['clickable'] && _clickable !== undefined) {\n marker.setClickable(_clickable);\n }\n if (changes['icon'] && _icon) {\n marker.setIcon(_icon);\n }\n if (changes['visible'] && _visible !== undefined) {\n marker.setVisible(_visible);\n }\n }\n }\n ngOnDestroy() {\n this._eventManager.destroy();\n if (this.marker) {\n this.marker.setMap(null);\n }\n }\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/marker#Marker.getAnimation\n */\n getAnimation() {\n this._assertInitialized();\n return this.marker.getAnimation() || null;\n }\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/marker#Marker.getClickable\n */\n getClickable() {\n this._assertInitialized();\n return this.marker.getClickable();\n }\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/marker#Marker.getCursor\n */\n getCursor() {\n this._assertInitialized();\n return this.marker.getCursor() || null;\n }\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/marker#Marker.getDraggable\n */\n getDraggable() {\n this._assertInitialized();\n return !!this.marker.getDraggable();\n }\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/marker#Marker.getIcon\n */\n getIcon() {\n this._assertInitialized();\n return this.marker.getIcon() || null;\n }\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/marker#Marker.getLabel\n */\n getLabel() {\n this._assertInitialized();\n return this.marker.getLabel() || null;\n }\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/marker#Marker.getOpacity\n */\n getOpacity() {\n this._assertInitialized();\n return this.marker.getOpacity() || null;\n }\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/marker#Marker.getPosition\n */\n getPosition() {\n this._assertInitialized();\n return this.marker.getPosition() || null;\n }\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/marker#Marker.getShape\n */\n getShape() {\n this._assertInitialized();\n return this.marker.getShape() || null;\n }\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/marker#Marker.getTitle\n */\n getTitle() {\n this._assertInitialized();\n return this.marker.getTitle() || null;\n }\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/marker#Marker.getVisible\n */\n getVisible() {\n this._assertInitialized();\n return this.marker.getVisible();\n }\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/marker#Marker.getZIndex\n */\n getZIndex() {\n this._assertInitialized();\n return this.marker.getZIndex() || null;\n }\n /** Gets the anchor point that can be used to attach other Google Maps objects. */\n getAnchor() {\n this._assertInitialized();\n return this.marker;\n }\n /** Creates a combined options object using the passed-in options and the individual inputs. */\n _combineOptions() {\n var _a, _b;\n const options = this._options || DEFAULT_MARKER_OPTIONS;\n return Object.assign(Object.assign({}, options), { title: this._title || options.title, position: this._position || options.position, label: this._label || options.label, clickable: (_a = this._clickable) !== null && _a !== void 0 ? _a : options.clickable, map: this._googleMap.googleMap, icon: this._icon || options.icon, visible: (_b = this._visible) !== null && _b !== void 0 ? _b : options.visible });\n }\n _assertInitialized() {\n if (typeof ngDevMode === 'undefined' || ngDevMode) {\n if (!this._googleMap.googleMap) {\n throw Error('Cannot access Google Map information before the API has been initialized. ' +\n 'Please wait for the API to load before trying to interact with it.');\n }\n if (!this.marker) {\n throw Error('Cannot interact with a Google Map Marker before it has been ' +\n 'initialized. Please wait for the Marker to load before trying to interact with it.');\n }\n }\n }\n}\nMapMarker.ɵfac = function MapMarker_Factory(t) { return new (t || MapMarker)(ɵngcc0.ɵɵdirectiveInject(GoogleMap), ɵngcc0.ɵɵdirectiveInject(ɵngcc0.NgZone)); };\nMapMarker.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: MapMarker, selectors: [[\"map-marker\"]], inputs: { title: \"title\", position: \"position\", label: \"label\", clickable: \"clickable\", options: \"options\", icon: \"icon\", visible: \"visible\" }, outputs: { animationChanged: \"animationChanged\", mapClick: \"mapClick\", clickableChanged: \"clickableChanged\", cursorChanged: \"cursorChanged\", mapDblclick: \"mapDblclick\", mapDrag: \"mapDrag\", mapDragend: \"mapDragend\", draggableChanged: \"draggableChanged\", mapDragstart: \"mapDragstart\", flatChanged: \"flatChanged\", iconChanged: \"iconChanged\", mapMousedown: \"mapMousedown\", mapMouseout: \"mapMouseout\", mapMouseover: \"mapMouseover\", mapMouseup: \"mapMouseup\", positionChanged: \"positionChanged\", mapRightclick: \"mapRightclick\", shapeChanged: \"shapeChanged\", titleChanged: \"titleChanged\", visibleChanged: \"visibleChanged\", zindexChanged: \"zindexChanged\" }, exportAs: [\"mapMarker\"], features: [ɵngcc0.ɵɵNgOnChangesFeature] });\nMapMarker.ctorParameters = () => [\n { type: GoogleMap },\n { type: NgZone }\n];\nMapMarker.propDecorators = {\n title: [{ type: Input }],\n position: [{ type: Input }],\n label: [{ type: Input }],\n clickable: [{ type: Input }],\n options: [{ type: Input }],\n icon: [{ type: Input }],\n visible: [{ type: Input }],\n animationChanged: [{ type: Output }],\n mapClick: [{ type: Output }],\n clickableChanged: [{ type: Output }],\n cursorChanged: [{ type: Output }],\n mapDblclick: [{ type: Output }],\n mapDrag: [{ type: Output }],\n mapDragend: [{ type: Output }],\n draggableChanged: [{ type: Output }],\n mapDragstart: [{ type: Output }],\n flatChanged: [{ type: Output }],\n iconChanged: [{ type: Output }],\n mapMousedown: [{ type: Output }],\n mapMouseout: [{ type: Output }],\n mapMouseover: [{ type: Output }],\n mapMouseup: [{ type: Output }],\n positionChanged: [{ type: Output }],\n mapRightclick: [{ type: Output }],\n shapeChanged: [{ type: Output }],\n titleChanged: [{ type: Output }],\n visibleChanged: [{ type: Output }],\n zindexChanged: [{ type: Output }]\n};\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(MapMarker, [{\n type: Directive,\n args: [{\n selector: 'map-marker',\n exportAs: 'mapMarker'\n }]\n }], function () { return [{ type: GoogleMap }, { type: ɵngcc0.NgZone }]; }, { animationChanged: [{\n type: Output\n }], mapClick: [{\n type: Output\n }], clickableChanged: [{\n type: Output\n }], cursorChanged: [{\n type: Output\n }], mapDblclick: [{\n type: Output\n }], mapDrag: [{\n type: Output\n }], mapDragend: [{\n type: Output\n }], draggableChanged: [{\n type: Output\n }], mapDragstart: [{\n type: Output\n }], flatChanged: [{\n type: Output\n }], iconChanged: [{\n type: Output\n }], mapMousedown: [{\n type: Output\n }], mapMouseout: [{\n type: Output\n }], mapMouseover: [{\n type: Output\n }], mapMouseup: [{\n type: Output\n }], positionChanged: [{\n type: Output\n }], mapRightclick: [{\n type: Output\n }], shapeChanged: [{\n type: Output\n }], titleChanged: [{\n type: Output\n }], visibleChanged: [{\n type: Output\n }], zindexChanged: [{\n type: Output\n }], title: [{\n type: Input\n }], position: [{\n type: Input\n }], label: [{\n type: Input\n }], clickable: [{\n type: Input\n }], options: [{\n type: Input\n }], icon: [{\n type: Input\n }], visible: [{\n type: Input\n }] }); })();\n\n/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n/** Default options for a clusterer. */\nconst DEFAULT_CLUSTERER_OPTIONS = {};\n/**\n * Angular component for implementing a Google Maps Marker Clusterer.\n *\n * See https://developers.google.com/maps/documentation/javascript/marker-clustering\n */\nclass MapMarkerClusterer {\n constructor(_googleMap, _ngZone) {\n this._googleMap = _googleMap;\n this._ngZone = _ngZone;\n this._currentMarkers = new Set();\n this._eventManager = new MapEventManager(this._ngZone);\n this._destroy = new Subject();\n this.ariaLabelFn = () => '';\n /**\n * See\n * googlemaps.github.io/v3-utility-library/modules/\n * _google_markerclustererplus.html#clusteringbegin\n */\n this.clusteringbegin = this._eventManager.getLazyEmitter('clusteringbegin');\n /**\n * See\n * googlemaps.github.io/v3-utility-library/modules/_google_markerclustererplus.html#clusteringend\n */\n this.clusteringend = this._eventManager.getLazyEmitter('clusteringend');\n /** Emits when a cluster has been clicked. */\n this.clusterClick = this._eventManager.getLazyEmitter('click');\n this._canInitialize = this._googleMap._isBrowser;\n }\n set averageCenter(averageCenter) {\n this._averageCenter = averageCenter;\n }\n set batchSizeIE(batchSizeIE) {\n this._batchSizeIE = batchSizeIE;\n }\n set calculator(calculator) {\n this._calculator = calculator;\n }\n set clusterClass(clusterClass) {\n this._clusterClass = clusterClass;\n }\n set enableRetinaIcons(enableRetinaIcons) {\n this._enableRetinaIcons = enableRetinaIcons;\n }\n set gridSize(gridSize) {\n this._gridSize = gridSize;\n }\n set ignoreHidden(ignoreHidden) {\n this._ignoreHidden = ignoreHidden;\n }\n set imageExtension(imageExtension) {\n this._imageExtension = imageExtension;\n }\n set imagePath(imagePath) {\n this._imagePath = imagePath;\n }\n set imageSizes(imageSizes) {\n this._imageSizes = imageSizes;\n }\n set maxZoom(maxZoom) {\n this._maxZoom = maxZoom;\n }\n set minimumClusterSize(minimumClusterSize) {\n this._minimumClusterSize = minimumClusterSize;\n }\n set styles(styles) {\n this._styles = styles;\n }\n set title(title) {\n this._title = title;\n }\n set zIndex(zIndex) {\n this._zIndex = zIndex;\n }\n set zoomOnClick(zoomOnClick) {\n this._zoomOnClick = zoomOnClick;\n }\n set options(options) {\n this._options = options;\n }\n ngOnInit() {\n if (this._canInitialize) {\n const clustererWindow = window;\n if (!clustererWindow.MarkerClusterer && (typeof ngDevMode === 'undefined' || ngDevMode)) {\n throw Error('MarkerClusterer class not found, cannot construct a marker cluster. ' +\n 'Please install the MarkerClustererPlus library: ' +\n 'https://github.com/googlemaps/js-markerclustererplus');\n }\n // Create the object outside the zone so its events don't trigger change detection.\n // We'll bring it back in inside the `MapEventManager` only for the events that the\n // user has subscribed to.\n this._ngZone.runOutsideAngular(() => {\n this.markerClusterer = new MarkerClusterer(this._googleMap.googleMap, [], this._combineOptions());\n });\n this._assertInitialized();\n this._eventManager.setTarget(this.markerClusterer);\n }\n }\n ngAfterContentInit() {\n if (this._canInitialize) {\n this._watchForMarkerChanges();\n }\n }\n ngOnChanges(changes) {\n const { markerClusterer: clusterer, ariaLabelFn, _averageCenter, _batchSizeIE, _calculator, _styles, _clusterClass, _enableRetinaIcons, _gridSize, _ignoreHidden, _imageExtension, _imagePath, _imageSizes, _maxZoom, _minimumClusterSize, _title, _zIndex, _zoomOnClick } = this;\n if (clusterer) {\n if (changes['options']) {\n clusterer.setOptions(this._combineOptions());\n }\n if (changes['ariaLabelFn']) {\n clusterer.ariaLabelFn = ariaLabelFn;\n }\n if (changes['averageCenter'] && _averageCenter !== undefined) {\n clusterer.setAverageCenter(_averageCenter);\n }\n if (changes['batchSizeIE'] && _batchSizeIE !== undefined) {\n clusterer.setBatchSizeIE(_batchSizeIE);\n }\n if (changes['calculator'] && !!_calculator) {\n clusterer.setCalculator(_calculator);\n }\n if (changes['clusterClass'] && _clusterClass !== undefined) {\n clusterer.setClusterClass(_clusterClass);\n }\n if (changes['enableRetinaIcons'] && _enableRetinaIcons !== undefined) {\n clusterer.setEnableRetinaIcons(_enableRetinaIcons);\n }\n if (changes['gridSize'] && _gridSize !== undefined) {\n clusterer.setGridSize(_gridSize);\n }\n if (changes['ignoreHidden'] && _ignoreHidden !== undefined) {\n clusterer.setIgnoreHidden(_ignoreHidden);\n }\n if (changes['imageExtension'] && _imageExtension !== undefined) {\n clusterer.setImageExtension(_imageExtension);\n }\n if (changes['imagePath'] && _imagePath !== undefined) {\n clusterer.setImagePath(_imagePath);\n }\n if (changes['imageSizes'] && _imageSizes) {\n clusterer.setImageSizes(_imageSizes);\n }\n if (changes['maxZoom'] && _maxZoom !== undefined) {\n clusterer.setMaxZoom(_maxZoom);\n }\n if (changes['minimumClusterSize'] && _minimumClusterSize !== undefined) {\n clusterer.setMinimumClusterSize(_minimumClusterSize);\n }\n if (changes['styles'] && _styles) {\n clusterer.setStyles(_styles);\n }\n if (changes['title'] && _title !== undefined) {\n clusterer.setTitle(_title);\n }\n if (changes['zIndex'] && _zIndex !== undefined) {\n clusterer.setZIndex(_zIndex);\n }\n if (changes['zoomOnClick'] && _zoomOnClick !== undefined) {\n clusterer.setZoomOnClick(_zoomOnClick);\n }\n }\n }\n ngOnDestroy() {\n this._destroy.next();\n this._destroy.complete();\n this._eventManager.destroy();\n if (this.markerClusterer) {\n this.markerClusterer.setMap(null);\n }\n }\n fitMapToMarkers(padding) {\n this._assertInitialized();\n this.markerClusterer.fitMapToMarkers(padding);\n }\n getAverageCenter() {\n this._assertInitialized();\n return this.markerClusterer.getAverageCenter();\n }\n getBatchSizeIE() {\n this._assertInitialized();\n return this.markerClusterer.getBatchSizeIE();\n }\n getCalculator() {\n this._assertInitialized();\n return this.markerClusterer.getCalculator();\n }\n getClusterClass() {\n this._assertInitialized();\n return this.markerClusterer.getClusterClass();\n }\n getClusters() {\n this._assertInitialized();\n return this.markerClusterer.getClusters();\n }\n getEnableRetinaIcons() {\n this._assertInitialized();\n return this.markerClusterer.getEnableRetinaIcons();\n }\n getGridSize() {\n this._assertInitialized();\n return this.markerClusterer.getGridSize();\n }\n getIgnoreHidden() {\n this._assertInitialized();\n return this.markerClusterer.getIgnoreHidden();\n }\n getImageExtension() {\n this._assertInitialized();\n return this.markerClusterer.getImageExtension();\n }\n getImagePath() {\n this._assertInitialized();\n return this.markerClusterer.getImagePath();\n }\n getImageSizes() {\n this._assertInitialized();\n return this.markerClusterer.getImageSizes();\n }\n getMaxZoom() {\n this._assertInitialized();\n return this.markerClusterer.getMaxZoom();\n }\n getMinimumClusterSize() {\n this._assertInitialized();\n return this.markerClusterer.getMinimumClusterSize();\n }\n getStyles() {\n this._assertInitialized();\n return this.markerClusterer.getStyles();\n }\n getTitle() {\n this._assertInitialized();\n return this.markerClusterer.getTitle();\n }\n getTotalClusters() {\n this._assertInitialized();\n return this.markerClusterer.getTotalClusters();\n }\n getTotalMarkers() {\n this._assertInitialized();\n return this.markerClusterer.getTotalMarkers();\n }\n getZIndex() {\n this._assertInitialized();\n return this.markerClusterer.getZIndex();\n }\n getZoomOnClick() {\n this._assertInitialized();\n return this.markerClusterer.getZoomOnClick();\n }\n _combineOptions() {\n var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t;\n const options = this._options || DEFAULT_CLUSTERER_OPTIONS;\n return Object.assign(Object.assign({}, options), { ariaLabelFn: (_a = this.ariaLabelFn) !== null && _a !== void 0 ? _a : options.ariaLabelFn, averageCenter: (_b = this._averageCenter) !== null && _b !== void 0 ? _b : options.averageCenter, batchSize: (_c = this.batchSize) !== null && _c !== void 0 ? _c : options.batchSize, batchSizeIE: (_d = this._batchSizeIE) !== null && _d !== void 0 ? _d : options.batchSizeIE, calculator: (_e = this._calculator) !== null && _e !== void 0 ? _e : options.calculator, clusterClass: (_f = this._clusterClass) !== null && _f !== void 0 ? _f : options.clusterClass, enableRetinaIcons: (_g = this._enableRetinaIcons) !== null && _g !== void 0 ? _g : options.enableRetinaIcons, gridSize: (_h = this._gridSize) !== null && _h !== void 0 ? _h : options.gridSize, ignoreHidden: (_j = this._ignoreHidden) !== null && _j !== void 0 ? _j : options.ignoreHidden, imageExtension: (_k = this._imageExtension) !== null && _k !== void 0 ? _k : options.imageExtension, imagePath: (_l = this._imagePath) !== null && _l !== void 0 ? _l : options.imagePath, imageSizes: (_m = this._imageSizes) !== null && _m !== void 0 ? _m : options.imageSizes, maxZoom: (_o = this._maxZoom) !== null && _o !== void 0 ? _o : options.maxZoom, minimumClusterSize: (_p = this._minimumClusterSize) !== null && _p !== void 0 ? _p : options.minimumClusterSize, styles: (_q = this._styles) !== null && _q !== void 0 ? _q : options.styles, title: (_r = this._title) !== null && _r !== void 0 ? _r : options.title, zIndex: (_s = this._zIndex) !== null && _s !== void 0 ? _s : options.zIndex, zoomOnClick: (_t = this._zoomOnClick) !== null && _t !== void 0 ? _t : options.zoomOnClick });\n }\n _watchForMarkerChanges() {\n this._assertInitialized();\n const initialMarkers = [];\n for (const marker of this._getInternalMarkers(this._markers.toArray())) {\n this._currentMarkers.add(marker);\n initialMarkers.push(marker);\n }\n this.markerClusterer.addMarkers(initialMarkers);\n this._markers.changes.pipe(takeUntil(this._destroy)).subscribe((markerComponents) => {\n this._assertInitialized();\n const newMarkers = new Set(this._getInternalMarkers(markerComponents));\n const markersToAdd = [];\n const markersToRemove = [];\n for (const marker of Array.from(newMarkers)) {\n if (!this._currentMarkers.has(marker)) {\n this._currentMarkers.add(marker);\n markersToAdd.push(marker);\n }\n }\n for (const marker of Array.from(this._currentMarkers)) {\n if (!newMarkers.has(marker)) {\n markersToRemove.push(marker);\n }\n }\n this.markerClusterer.addMarkers(markersToAdd, true);\n this.markerClusterer.removeMarkers(markersToRemove, true);\n this.markerClusterer.repaint();\n for (const marker of markersToRemove) {\n this._currentMarkers.delete(marker);\n }\n });\n }\n _getInternalMarkers(markers) {\n return markers.filter(markerComponent => !!markerComponent.marker)\n .map(markerComponent => markerComponent.marker);\n }\n _assertInitialized() {\n if (typeof ngDevMode === 'undefined' || ngDevMode) {\n if (!this._googleMap.googleMap) {\n throw Error('Cannot access Google Map information before the API has been initialized. ' +\n 'Please wait for the API to load before trying to interact with it.');\n }\n if (!this.markerClusterer) {\n throw Error('Cannot interact with a MarkerClusterer before it has been initialized. ' +\n 'Please wait for the MarkerClusterer to load before trying to interact with it.');\n }\n }\n }\n}\nMapMarkerClusterer.ɵfac = function MapMarkerClusterer_Factory(t) { return new (t || MapMarkerClusterer)(ɵngcc0.ɵɵdirectiveInject(GoogleMap), ɵngcc0.ɵɵdirectiveInject(ɵngcc0.NgZone)); };\nMapMarkerClusterer.ɵcmp = /*@__PURE__*/ ɵngcc0.ɵɵdefineComponent({ type: MapMarkerClusterer, selectors: [[\"map-marker-clusterer\"]], contentQueries: function MapMarkerClusterer_ContentQueries(rf, ctx, dirIndex) { if (rf & 1) {\n ɵngcc0.ɵɵcontentQuery(dirIndex, MapMarker, 5);\n } if (rf & 2) {\n let _t;\n ɵngcc0.ɵɵqueryRefresh(_t = ɵngcc0.ɵɵloadQuery()) && (ctx._markers = _t);\n } }, inputs: { ariaLabelFn: \"ariaLabelFn\", averageCenter: \"averageCenter\", batchSizeIE: \"batchSizeIE\", calculator: \"calculator\", clusterClass: \"clusterClass\", enableRetinaIcons: \"enableRetinaIcons\", gridSize: \"gridSize\", ignoreHidden: \"ignoreHidden\", imageExtension: \"imageExtension\", imagePath: \"imagePath\", imageSizes: \"imageSizes\", maxZoom: \"maxZoom\", minimumClusterSize: \"minimumClusterSize\", styles: \"styles\", title: \"title\", zIndex: \"zIndex\", zoomOnClick: \"zoomOnClick\", options: \"options\", batchSize: \"batchSize\" }, outputs: { clusteringbegin: \"clusteringbegin\", clusteringend: \"clusteringend\", clusterClick: \"clusterClick\" }, exportAs: [\"mapMarkerClusterer\"], features: [ɵngcc0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 1, vars: 0, template: function MapMarkerClusterer_Template(rf, ctx) { if (rf & 1) {\n ɵngcc0.ɵɵprojectionDef();\n ɵngcc0.ɵɵprojection(0);\n } }, encapsulation: 2, changeDetection: 0 });\nMapMarkerClusterer.ctorParameters = () => [\n { type: GoogleMap },\n { type: NgZone }\n];\nMapMarkerClusterer.propDecorators = {\n ariaLabelFn: [{ type: Input }],\n averageCenter: [{ type: Input }],\n batchSize: [{ type: Input }],\n batchSizeIE: [{ type: Input }],\n calculator: [{ type: Input }],\n clusterClass: [{ type: Input }],\n enableRetinaIcons: [{ type: Input }],\n gridSize: [{ type: Input }],\n ignoreHidden: [{ type: Input }],\n imageExtension: [{ type: Input }],\n imagePath: [{ type: Input }],\n imageSizes: [{ type: Input }],\n maxZoom: [{ type: Input }],\n minimumClusterSize: [{ type: Input }],\n styles: [{ type: Input }],\n title: [{ type: Input }],\n zIndex: [{ type: Input }],\n zoomOnClick: [{ type: Input }],\n options: [{ type: Input }],\n clusteringbegin: [{ type: Output }],\n clusteringend: [{ type: Output }],\n clusterClick: [{ type: Output }],\n _markers: [{ type: ContentChildren, args: [MapMarker, { descendants: true },] }]\n};\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(MapMarkerClusterer, [{\n type: Component,\n args: [{\n selector: 'map-marker-clusterer',\n exportAs: 'mapMarkerClusterer',\n changeDetection: ChangeDetectionStrategy.OnPush,\n template: '',\n encapsulation: ViewEncapsulation.None\n }]\n }], function () { return [{ type: GoogleMap }, { type: ɵngcc0.NgZone }]; }, { ariaLabelFn: [{\n type: Input\n }], clusteringbegin: [{\n type: Output\n }], clusteringend: [{\n type: Output\n }], clusterClick: [{\n type: Output\n }], averageCenter: [{\n type: Input\n }], batchSizeIE: [{\n type: Input\n }], calculator: [{\n type: Input\n }], clusterClass: [{\n type: Input\n }], enableRetinaIcons: [{\n type: Input\n }], gridSize: [{\n type: Input\n }], ignoreHidden: [{\n type: Input\n }], imageExtension: [{\n type: Input\n }], imagePath: [{\n type: Input\n }], imageSizes: [{\n type: Input\n }], maxZoom: [{\n type: Input\n }], minimumClusterSize: [{\n type: Input\n }], styles: [{\n type: Input\n }], title: [{\n type: Input\n }], zIndex: [{\n type: Input\n }], zoomOnClick: [{\n type: Input\n }], options: [{\n type: Input\n }], batchSize: [{\n type: Input\n }], _markers: [{\n type: ContentChildren,\n args: [MapMarker, { descendants: true }]\n }] }); })();\n\n/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n/**\n * Angular component that renders a Google Maps Polygon via the Google Maps JavaScript API.\n *\n * See developers.google.com/maps/documentation/javascript/reference/polygon#Polygon\n */\nclass MapPolygon {\n constructor(_map, _ngZone) {\n this._map = _map;\n this._ngZone = _ngZone;\n this._eventManager = new MapEventManager(this._ngZone);\n this._options = new BehaviorSubject({});\n this._paths = new BehaviorSubject(undefined);\n this._destroyed = new Subject();\n /**\n * See developers.google.com/maps/documentation/javascript/reference/polygon#Polygon.click\n */\n this.polygonClick = this._eventManager.getLazyEmitter('click');\n /**\n * See developers.google.com/maps/documentation/javascript/reference/polygon#Polygon.dblclick\n */\n this.polygonDblclick = this._eventManager.getLazyEmitter('dblclick');\n /**\n * See developers.google.com/maps/documentation/javascript/reference/polygon#Polygon.drag\n */\n this.polygonDrag = this._eventManager.getLazyEmitter('drag');\n /**\n * See developers.google.com/maps/documentation/javascript/reference/polygon#Polygon.dragend\n */\n this.polygonDragend = this._eventManager.getLazyEmitter('dragend');\n /**\n * See developers.google.com/maps/documentation/javascript/reference/polygon#Polygon.dragstart\n */\n this.polygonDragstart = this._eventManager.getLazyEmitter('dragstart');\n /**\n * See developers.google.com/maps/documentation/javascript/reference/polygon#Polygon.mousedown\n */\n this.polygonMousedown = this._eventManager.getLazyEmitter('mousedown');\n /**\n * See developers.google.com/maps/documentation/javascript/reference/polygon#Polygon.mousemove\n */\n this.polygonMousemove = this._eventManager.getLazyEmitter('mousemove');\n /**\n * See developers.google.com/maps/documentation/javascript/reference/polygon#Polygon.mouseout\n */\n this.polygonMouseout = this._eventManager.getLazyEmitter('mouseout');\n /**\n * See developers.google.com/maps/documentation/javascript/reference/polygon#Polygon.mouseover\n */\n this.polygonMouseover = this._eventManager.getLazyEmitter('mouseover');\n /**\n * See developers.google.com/maps/documentation/javascript/reference/polygon#Polygon.mouseup\n */\n this.polygonMouseup = this._eventManager.getLazyEmitter('mouseup');\n /**\n * See developers.google.com/maps/documentation/javascript/reference/polygon#Polygon.rightclick\n */\n this.polygonRightclick = this._eventManager.getLazyEmitter('rightclick');\n }\n set options(options) {\n this._options.next(options || {});\n }\n set paths(paths) {\n this._paths.next(paths);\n }\n ngOnInit() {\n if (this._map._isBrowser) {\n this._combineOptions().pipe(take(1)).subscribe(options => {\n // Create the object outside the zone so its events don't trigger change detection.\n // We'll bring it back in inside the `MapEventManager` only for the events that the\n // user has subscribed to.\n this._ngZone.runOutsideAngular(() => {\n this.polygon = new google.maps.Polygon(options);\n });\n this._assertInitialized();\n this.polygon.setMap(this._map.googleMap);\n this._eventManager.setTarget(this.polygon);\n });\n this._watchForOptionsChanges();\n this._watchForPathChanges();\n }\n }\n ngOnDestroy() {\n this._eventManager.destroy();\n this._destroyed.next();\n this._destroyed.complete();\n if (this.polygon) {\n this.polygon.setMap(null);\n }\n }\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/polygon#Polygon.getDraggable\n */\n getDraggable() {\n this._assertInitialized();\n return this.polygon.getDraggable();\n }\n /**\n * See developers.google.com/maps/documentation/javascript/reference/polygon#Polygon.getEditable\n */\n getEditable() {\n this._assertInitialized();\n return this.polygon.getEditable();\n }\n /**\n * See developers.google.com/maps/documentation/javascript/reference/polygon#Polygon.getPath\n */\n getPath() {\n this._assertInitialized();\n return this.polygon.getPath();\n }\n /**\n * See developers.google.com/maps/documentation/javascript/reference/polygon#Polygon.getPaths\n */\n getPaths() {\n this._assertInitialized();\n return this.polygon.getPaths();\n }\n /**\n * See developers.google.com/maps/documentation/javascript/reference/polygon#Polygon.getVisible\n */\n getVisible() {\n this._assertInitialized();\n return this.polygon.getVisible();\n }\n _combineOptions() {\n return combineLatest([this._options, this._paths]).pipe(map(([options, paths]) => {\n const combinedOptions = Object.assign(Object.assign({}, options), { paths: paths || options.paths });\n return combinedOptions;\n }));\n }\n _watchForOptionsChanges() {\n this._options.pipe(takeUntil(this._destroyed)).subscribe(options => {\n this._assertInitialized();\n this.polygon.setOptions(options);\n });\n }\n _watchForPathChanges() {\n this._paths.pipe(takeUntil(this._destroyed)).subscribe(paths => {\n if (paths) {\n this._assertInitialized();\n this.polygon.setPaths(paths);\n }\n });\n }\n _assertInitialized() {\n if (typeof ngDevMode === 'undefined' || ngDevMode) {\n if (!this._map.googleMap) {\n throw Error('Cannot access Google Map information before the API has been initialized. ' +\n 'Please wait for the API to load before trying to interact with it.');\n }\n if (!this.polygon) {\n throw Error('Cannot interact with a Google Map Polygon before it has been ' +\n 'initialized. Please wait for the Polygon to load before trying to interact with it.');\n }\n }\n }\n}\nMapPolygon.ɵfac = function MapPolygon_Factory(t) { return new (t || MapPolygon)(ɵngcc0.ɵɵdirectiveInject(GoogleMap), ɵngcc0.ɵɵdirectiveInject(ɵngcc0.NgZone)); };\nMapPolygon.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: MapPolygon, selectors: [[\"map-polygon\"]], inputs: { options: \"options\", paths: \"paths\" }, outputs: { polygonClick: \"polygonClick\", polygonDblclick: \"polygonDblclick\", polygonDrag: \"polygonDrag\", polygonDragend: \"polygonDragend\", polygonDragstart: \"polygonDragstart\", polygonMousedown: \"polygonMousedown\", polygonMousemove: \"polygonMousemove\", polygonMouseout: \"polygonMouseout\", polygonMouseover: \"polygonMouseover\", polygonMouseup: \"polygonMouseup\", polygonRightclick: \"polygonRightclick\" }, exportAs: [\"mapPolygon\"] });\nMapPolygon.ctorParameters = () => [\n { type: GoogleMap },\n { type: NgZone }\n];\nMapPolygon.propDecorators = {\n options: [{ type: Input }],\n paths: [{ type: Input }],\n polygonClick: [{ type: Output }],\n polygonDblclick: [{ type: Output }],\n polygonDrag: [{ type: Output }],\n polygonDragend: [{ type: Output }],\n polygonDragstart: [{ type: Output }],\n polygonMousedown: [{ type: Output }],\n polygonMousemove: [{ type: Output }],\n polygonMouseout: [{ type: Output }],\n polygonMouseover: [{ type: Output }],\n polygonMouseup: [{ type: Output }],\n polygonRightclick: [{ type: Output }]\n};\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(MapPolygon, [{\n type: Directive,\n args: [{\n selector: 'map-polygon',\n exportAs: 'mapPolygon'\n }]\n }], function () { return [{ type: GoogleMap }, { type: ɵngcc0.NgZone }]; }, { polygonClick: [{\n type: Output\n }], polygonDblclick: [{\n type: Output\n }], polygonDrag: [{\n type: Output\n }], polygonDragend: [{\n type: Output\n }], polygonDragstart: [{\n type: Output\n }], polygonMousedown: [{\n type: Output\n }], polygonMousemove: [{\n type: Output\n }], polygonMouseout: [{\n type: Output\n }], polygonMouseover: [{\n type: Output\n }], polygonMouseup: [{\n type: Output\n }], polygonRightclick: [{\n type: Output\n }], options: [{\n type: Input\n }], paths: [{\n type: Input\n }] }); })();\n\n/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n/**\n * Angular component that renders a Google Maps Polyline via the Google Maps JavaScript API.\n *\n * See developers.google.com/maps/documentation/javascript/reference/polygon#Polyline\n */\nclass MapPolyline {\n constructor(_map, _ngZone) {\n this._map = _map;\n this._ngZone = _ngZone;\n this._eventManager = new MapEventManager(this._ngZone);\n this._options = new BehaviorSubject({});\n this._path = new BehaviorSubject(undefined);\n this._destroyed = new Subject();\n /**\n * See developers.google.com/maps/documentation/javascript/reference/polygon#Polyline.click\n */\n this.polylineClick = this._eventManager.getLazyEmitter('click');\n /**\n * See developers.google.com/maps/documentation/javascript/reference/polygon#Polyline.dblclick\n */\n this.polylineDblclick = this._eventManager.getLazyEmitter('dblclick');\n /**\n * See developers.google.com/maps/documentation/javascript/reference/polygon#Polyline.drag\n */\n this.polylineDrag = this._eventManager.getLazyEmitter('drag');\n /**\n * See developers.google.com/maps/documentation/javascript/reference/polygon#Polyline.dragend\n */\n this.polylineDragend = this._eventManager.getLazyEmitter('dragend');\n /**\n * See developers.google.com/maps/documentation/javascript/reference/polygon#Polyline.dragstart\n */\n this.polylineDragstart = this._eventManager.getLazyEmitter('dragstart');\n /**\n * See developers.google.com/maps/documentation/javascript/reference/polygon#Polyline.mousedown\n */\n this.polylineMousedown = this._eventManager.getLazyEmitter('mousedown');\n /**\n * See developers.google.com/maps/documentation/javascript/reference/polygon#Polyline.mousemove\n */\n this.polylineMousemove = this._eventManager.getLazyEmitter('mousemove');\n /**\n * See developers.google.com/maps/documentation/javascript/reference/polygon#Polyline.mouseout\n */\n this.polylineMouseout = this._eventManager.getLazyEmitter('mouseout');\n /**\n * See developers.google.com/maps/documentation/javascript/reference/polygon#Polyline.mouseover\n */\n this.polylineMouseover = this._eventManager.getLazyEmitter('mouseover');\n /**\n * See developers.google.com/maps/documentation/javascript/reference/polygon#Polyline.mouseup\n */\n this.polylineMouseup = this._eventManager.getLazyEmitter('mouseup');\n /**\n * See developers.google.com/maps/documentation/javascript/reference/polygon#Polyline.rightclick\n */\n this.polylineRightclick = this._eventManager.getLazyEmitter('rightclick');\n }\n set options(options) {\n this._options.next(options || {});\n }\n set path(path) {\n this._path.next(path);\n }\n ngOnInit() {\n if (this._map._isBrowser) {\n this._combineOptions().pipe(take(1)).subscribe(options => {\n // Create the object outside the zone so its events don't trigger change detection.\n // We'll bring it back in inside the `MapEventManager` only for the events that the\n // user has subscribed to.\n this._ngZone.runOutsideAngular(() => this.polyline = new google.maps.Polyline(options));\n this._assertInitialized();\n this.polyline.setMap(this._map.googleMap);\n this._eventManager.setTarget(this.polyline);\n });\n this._watchForOptionsChanges();\n this._watchForPathChanges();\n }\n }\n ngOnDestroy() {\n this._eventManager.destroy();\n this._destroyed.next();\n this._destroyed.complete();\n if (this.polyline) {\n this.polyline.setMap(null);\n }\n }\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/polygon#Polyline.getDraggable\n */\n getDraggable() {\n this._assertInitialized();\n return this.polyline.getDraggable();\n }\n /**\n * See developers.google.com/maps/documentation/javascript/reference/polygon#Polyline.getEditable\n */\n getEditable() {\n this._assertInitialized();\n return this.polyline.getEditable();\n }\n /**\n * See developers.google.com/maps/documentation/javascript/reference/polygon#Polyline.getPath\n */\n getPath() {\n this._assertInitialized();\n return this.polyline.getPath();\n }\n /**\n * See developers.google.com/maps/documentation/javascript/reference/polygon#Polyline.getVisible\n */\n getVisible() {\n this._assertInitialized();\n return this.polyline.getVisible();\n }\n _combineOptions() {\n return combineLatest([this._options, this._path]).pipe(map(([options, path]) => {\n const combinedOptions = Object.assign(Object.assign({}, options), { path: path || options.path });\n return combinedOptions;\n }));\n }\n _watchForOptionsChanges() {\n this._options.pipe(takeUntil(this._destroyed)).subscribe(options => {\n this._assertInitialized();\n this.polyline.setOptions(options);\n });\n }\n _watchForPathChanges() {\n this._path.pipe(takeUntil(this._destroyed)).subscribe(path => {\n if (path) {\n this._assertInitialized();\n this.polyline.setPath(path);\n }\n });\n }\n _assertInitialized() {\n if (typeof ngDevMode === 'undefined' || ngDevMode) {\n if (!this._map.googleMap) {\n throw Error('Cannot access Google Map information before the API has been initialized. ' +\n 'Please wait for the API to load before trying to interact with it.');\n }\n if (!this.polyline) {\n throw Error('Cannot interact with a Google Map Polyline before it has been ' +\n 'initialized. Please wait for the Polyline to load before trying to interact with it.');\n }\n }\n }\n}\nMapPolyline.ɵfac = function MapPolyline_Factory(t) { return new (t || MapPolyline)(ɵngcc0.ɵɵdirectiveInject(GoogleMap), ɵngcc0.ɵɵdirectiveInject(ɵngcc0.NgZone)); };\nMapPolyline.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: MapPolyline, selectors: [[\"map-polyline\"]], inputs: { options: \"options\", path: \"path\" }, outputs: { polylineClick: \"polylineClick\", polylineDblclick: \"polylineDblclick\", polylineDrag: \"polylineDrag\", polylineDragend: \"polylineDragend\", polylineDragstart: \"polylineDragstart\", polylineMousedown: \"polylineMousedown\", polylineMousemove: \"polylineMousemove\", polylineMouseout: \"polylineMouseout\", polylineMouseover: \"polylineMouseover\", polylineMouseup: \"polylineMouseup\", polylineRightclick: \"polylineRightclick\" }, exportAs: [\"mapPolyline\"] });\nMapPolyline.ctorParameters = () => [\n { type: GoogleMap },\n { type: NgZone }\n];\nMapPolyline.propDecorators = {\n options: [{ type: Input }],\n path: [{ type: Input }],\n polylineClick: [{ type: Output }],\n polylineDblclick: [{ type: Output }],\n polylineDrag: [{ type: Output }],\n polylineDragend: [{ type: Output }],\n polylineDragstart: [{ type: Output }],\n polylineMousedown: [{ type: Output }],\n polylineMousemove: [{ type: Output }],\n polylineMouseout: [{ type: Output }],\n polylineMouseover: [{ type: Output }],\n polylineMouseup: [{ type: Output }],\n polylineRightclick: [{ type: Output }]\n};\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(MapPolyline, [{\n type: Directive,\n args: [{\n selector: 'map-polyline',\n exportAs: 'mapPolyline'\n }]\n }], function () { return [{ type: GoogleMap }, { type: ɵngcc0.NgZone }]; }, { polylineClick: [{\n type: Output\n }], polylineDblclick: [{\n type: Output\n }], polylineDrag: [{\n type: Output\n }], polylineDragend: [{\n type: Output\n }], polylineDragstart: [{\n type: Output\n }], polylineMousedown: [{\n type: Output\n }], polylineMousemove: [{\n type: Output\n }], polylineMouseout: [{\n type: Output\n }], polylineMouseover: [{\n type: Output\n }], polylineMouseup: [{\n type: Output\n }], polylineRightclick: [{\n type: Output\n }], options: [{\n type: Input\n }], path: [{\n type: Input\n }] }); })();\n\n/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n/**\n * Angular component that renders a Google Maps Rectangle via the Google Maps JavaScript API.\n *\n * See developers.google.com/maps/documentation/javascript/reference/polygon#Rectangle\n */\nclass MapRectangle {\n constructor(_map, _ngZone) {\n this._map = _map;\n this._ngZone = _ngZone;\n this._eventManager = new MapEventManager(this._ngZone);\n this._options = new BehaviorSubject({});\n this._bounds = new BehaviorSubject(undefined);\n this._destroyed = new Subject();\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/polygon#Rectangle.boundsChanged\n */ this.boundsChanged = this._eventManager.getLazyEmitter('bounds_changed');\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/polygon#Rectangle.click\n */\n this.rectangleClick = this._eventManager.getLazyEmitter('click');\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/polygon#Rectangle.dblclick\n */\n this.rectangleDblclick = this._eventManager.getLazyEmitter('dblclick');\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/polygon#Rectangle.drag\n */\n this.rectangleDrag = this._eventManager.getLazyEmitter('drag');\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/polygon#Rectangle.dragend\n */\n this.rectangleDragend = this._eventManager.getLazyEmitter('dragend');\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/polygon#Rectangle.dragstart\n */\n this.rectangleDragstart = this._eventManager.getLazyEmitter('dragstart');\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/polygon#Rectangle.mousedown\n */\n this.rectangleMousedown = this._eventManager.getLazyEmitter('mousedown');\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/polygon#Rectangle.mousemove\n */\n this.rectangleMousemove = this._eventManager.getLazyEmitter('mousemove');\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/polygon#Rectangle.mouseout\n */\n this.rectangleMouseout = this._eventManager.getLazyEmitter('mouseout');\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/polygon#Rectangle.mouseover\n */\n this.rectangleMouseover = this._eventManager.getLazyEmitter('mouseover');\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/polygon#Rectangle.mouseup\n */\n this.rectangleMouseup = this._eventManager.getLazyEmitter('mouseup');\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/polygon#Rectangle.rightclick\n */\n this.rectangleRightclick = this._eventManager.getLazyEmitter('rightclick');\n }\n set options(options) {\n this._options.next(options || {});\n }\n set bounds(bounds) {\n this._bounds.next(bounds);\n }\n ngOnInit() {\n if (this._map._isBrowser) {\n this._combineOptions().pipe(take(1)).subscribe(options => {\n // Create the object outside the zone so its events don't trigger change detection.\n // We'll bring it back in inside the `MapEventManager` only for the events that the\n // user has subscribed to.\n this._ngZone.runOutsideAngular(() => {\n this.rectangle = new google.maps.Rectangle(options);\n });\n this._assertInitialized();\n this.rectangle.setMap(this._map.googleMap);\n this._eventManager.setTarget(this.rectangle);\n });\n this._watchForOptionsChanges();\n this._watchForBoundsChanges();\n }\n }\n ngOnDestroy() {\n this._eventManager.destroy();\n this._destroyed.next();\n this._destroyed.complete();\n if (this.rectangle) {\n this.rectangle.setMap(null);\n }\n }\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/polygon#Rectangle.getBounds\n */\n getBounds() {\n this._assertInitialized();\n return this.rectangle.getBounds();\n }\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/polygon#Rectangle.getDraggable\n */\n getDraggable() {\n this._assertInitialized();\n return this.rectangle.getDraggable();\n }\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/polygon#Rectangle.getEditable\n */\n getEditable() {\n this._assertInitialized();\n return this.rectangle.getEditable();\n }\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/polygon#Rectangle.getVisible\n */\n getVisible() {\n this._assertInitialized();\n return this.rectangle.getVisible();\n }\n _combineOptions() {\n return combineLatest([this._options, this._bounds]).pipe(map(([options, bounds]) => {\n const combinedOptions = Object.assign(Object.assign({}, options), { bounds: bounds || options.bounds });\n return combinedOptions;\n }));\n }\n _watchForOptionsChanges() {\n this._options.pipe(takeUntil(this._destroyed)).subscribe(options => {\n this._assertInitialized();\n this.rectangle.setOptions(options);\n });\n }\n _watchForBoundsChanges() {\n this._bounds.pipe(takeUntil(this._destroyed)).subscribe(bounds => {\n if (bounds) {\n this._assertInitialized();\n this.rectangle.setBounds(bounds);\n }\n });\n }\n _assertInitialized() {\n if (typeof ngDevMode === 'undefined' || ngDevMode) {\n if (!this._map.googleMap) {\n throw Error('Cannot access Google Map information before the API has been initialized. ' +\n 'Please wait for the API to load before trying to interact with it.');\n }\n if (!this.rectangle) {\n throw Error('Cannot interact with a Google Map Rectangle before it has been initialized. ' +\n 'Please wait for the Rectangle to load before trying to interact with it.');\n }\n }\n }\n}\nMapRectangle.ɵfac = function MapRectangle_Factory(t) { return new (t || MapRectangle)(ɵngcc0.ɵɵdirectiveInject(GoogleMap), ɵngcc0.ɵɵdirectiveInject(ɵngcc0.NgZone)); };\nMapRectangle.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: MapRectangle, selectors: [[\"map-rectangle\"]], inputs: { options: \"options\", bounds: \"bounds\" }, outputs: { boundsChanged: \"boundsChanged\", rectangleClick: \"rectangleClick\", rectangleDblclick: \"rectangleDblclick\", rectangleDrag: \"rectangleDrag\", rectangleDragend: \"rectangleDragend\", rectangleDragstart: \"rectangleDragstart\", rectangleMousedown: \"rectangleMousedown\", rectangleMousemove: \"rectangleMousemove\", rectangleMouseout: \"rectangleMouseout\", rectangleMouseover: \"rectangleMouseover\", rectangleMouseup: \"rectangleMouseup\", rectangleRightclick: \"rectangleRightclick\" }, exportAs: [\"mapRectangle\"] });\nMapRectangle.ctorParameters = () => [\n { type: GoogleMap },\n { type: NgZone }\n];\nMapRectangle.propDecorators = {\n options: [{ type: Input }],\n bounds: [{ type: Input }],\n boundsChanged: [{ type: Output }],\n rectangleClick: [{ type: Output }],\n rectangleDblclick: [{ type: Output }],\n rectangleDrag: [{ type: Output }],\n rectangleDragend: [{ type: Output }],\n rectangleDragstart: [{ type: Output }],\n rectangleMousedown: [{ type: Output }],\n rectangleMousemove: [{ type: Output }],\n rectangleMouseout: [{ type: Output }],\n rectangleMouseover: [{ type: Output }],\n rectangleMouseup: [{ type: Output }],\n rectangleRightclick: [{ type: Output }]\n};\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(MapRectangle, [{\n type: Directive,\n args: [{\n selector: 'map-rectangle',\n exportAs: 'mapRectangle'\n }]\n }], function () { return [{ type: GoogleMap }, { type: ɵngcc0.NgZone }]; }, { boundsChanged: [{\n type: Output\n }], rectangleClick: [{\n type: Output\n }], rectangleDblclick: [{\n type: Output\n }], rectangleDrag: [{\n type: Output\n }], rectangleDragend: [{\n type: Output\n }], rectangleDragstart: [{\n type: Output\n }], rectangleMousedown: [{\n type: Output\n }], rectangleMousemove: [{\n type: Output\n }], rectangleMouseout: [{\n type: Output\n }], rectangleMouseover: [{\n type: Output\n }], rectangleMouseup: [{\n type: Output\n }], rectangleRightclick: [{\n type: Output\n }], options: [{\n type: Input\n }], bounds: [{\n type: Input\n }] }); })();\n\n/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n/**\n * Angular component that renders a Google Maps Traffic Layer via the Google Maps JavaScript API.\n *\n * See developers.google.com/maps/documentation/javascript/reference/map#TrafficLayer\n */\nclass MapTrafficLayer {\n constructor(_map, _ngZone) {\n this._map = _map;\n this._ngZone = _ngZone;\n this._autoRefresh = new BehaviorSubject(true);\n this._destroyed = new Subject();\n }\n /**\n * Whether the traffic layer refreshes with updated information automatically.\n */\n set autoRefresh(autoRefresh) {\n this._autoRefresh.next(autoRefresh);\n }\n ngOnInit() {\n if (this._map._isBrowser) {\n this._combineOptions().pipe(take(1)).subscribe(options => {\n // Create the object outside the zone so its events don't trigger change detection.\n this._ngZone.runOutsideAngular(() => {\n this.trafficLayer = new google.maps.TrafficLayer(options);\n });\n this._assertInitialized();\n this.trafficLayer.setMap(this._map.googleMap);\n });\n this._watchForAutoRefreshChanges();\n }\n }\n ngOnDestroy() {\n this._destroyed.next();\n this._destroyed.complete();\n if (this.trafficLayer) {\n this.trafficLayer.setMap(null);\n }\n }\n _combineOptions() {\n return this._autoRefresh.pipe(map(autoRefresh => {\n const combinedOptions = { autoRefresh };\n return combinedOptions;\n }));\n }\n _watchForAutoRefreshChanges() {\n this._combineOptions().pipe(takeUntil(this._destroyed)).subscribe(options => {\n this._assertInitialized();\n this.trafficLayer.setOptions(options);\n });\n }\n _assertInitialized() {\n if (!this._map.googleMap) {\n throw Error('Cannot access Google Map information before the API has been initialized. ' +\n 'Please wait for the API to load before trying to interact with it.');\n }\n if (!this.trafficLayer) {\n throw Error('Cannot interact with a Google Map Traffic Layer before it has been initialized. ' +\n 'Please wait for the Traffic Layer to load before trying to interact with it.');\n }\n }\n}\nMapTrafficLayer.ɵfac = function MapTrafficLayer_Factory(t) { return new (t || MapTrafficLayer)(ɵngcc0.ɵɵdirectiveInject(GoogleMap), ɵngcc0.ɵɵdirectiveInject(ɵngcc0.NgZone)); };\nMapTrafficLayer.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: MapTrafficLayer, selectors: [[\"map-traffic-layer\"]], inputs: { autoRefresh: \"autoRefresh\" }, exportAs: [\"mapTrafficLayer\"] });\nMapTrafficLayer.ctorParameters = () => [\n { type: GoogleMap },\n { type: NgZone }\n];\nMapTrafficLayer.propDecorators = {\n autoRefresh: [{ type: Input }]\n};\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(MapTrafficLayer, [{\n type: Directive,\n args: [{\n selector: 'map-traffic-layer',\n exportAs: 'mapTrafficLayer'\n }]\n }], function () { return [{ type: GoogleMap }, { type: ɵngcc0.NgZone }]; }, { autoRefresh: [{\n type: Input\n }] }); })();\n\n/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n/**\n * Angular component that renders a Google Maps Transit Layer via the Google Maps JavaScript API.\n *\n * See developers.google.com/maps/documentation/javascript/reference/map#TransitLayer\n */\nclass MapTransitLayer extends MapBaseLayer {\n _initializeObject() {\n this.transitLayer = new google.maps.TransitLayer();\n }\n _setMap() {\n this._assertLayerInitialized();\n this.transitLayer.setMap(this._map.googleMap);\n }\n _unsetMap() {\n if (this.transitLayer) {\n this.transitLayer.setMap(null);\n }\n }\n _assertLayerInitialized() {\n if (!this.transitLayer) {\n throw Error('Cannot interact with a Google Map Transit Layer before it has been initialized. ' +\n 'Please wait for the Transit Layer to load before trying to interact with it.');\n }\n }\n}\nMapTransitLayer.ɵfac = /*@__PURE__*/ function () { let ɵMapTransitLayer_BaseFactory; return function MapTransitLayer_Factory(t) { return (ɵMapTransitLayer_BaseFactory || (ɵMapTransitLayer_BaseFactory = ɵngcc0.ɵɵgetInheritedFactory(MapTransitLayer)))(t || MapTransitLayer); }; }();\nMapTransitLayer.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: MapTransitLayer, selectors: [[\"map-transit-layer\"]], exportAs: [\"mapTransitLayer\"], features: [ɵngcc0.ɵɵInheritDefinitionFeature] });\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(MapTransitLayer, [{\n type: Directive,\n args: [{\n selector: 'map-transit-layer',\n exportAs: 'mapTransitLayer'\n }]\n }], null, null); })();\n\n/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n/**\n * Angular directive that renders a Google Maps heatmap via the Google Maps JavaScript API.\n *\n * See: https://developers.google.com/maps/documentation/javascript/reference/visualization\n */\nclass MapHeatmapLayer {\n constructor(_googleMap, _ngZone) {\n this._googleMap = _googleMap;\n this._ngZone = _ngZone;\n }\n /**\n * Data shown on the heatmap.\n * See: https://developers.google.com/maps/documentation/javascript/reference/visualization\n */\n set data(data) {\n this._data = data;\n }\n /**\n * Options used to configure the heatmap. See:\n * developers.google.com/maps/documentation/javascript/reference/visualization#HeatmapLayerOptions\n */\n set options(options) {\n this._options = options;\n }\n ngOnInit() {\n var _a, _b;\n if (this._googleMap._isBrowser) {\n if (!((_b = (_a = window.google) === null || _a === void 0 ? void 0 : _a.maps) === null || _b === void 0 ? void 0 : _b.visualization) && (typeof ngDevMode === 'undefined' || ngDevMode)) {\n throw Error('Namespace `google.maps.visualization` not found, cannot construct heatmap. ' +\n 'Please install the Google Maps JavaScript API with the \"visualization\" library: ' +\n 'https://developers.google.com/maps/documentation/javascript/visualization');\n }\n // Create the object outside the zone so its events don't trigger change detection.\n // We'll bring it back in inside the `MapEventManager` only for the events that the\n // user has subscribed to.\n this._ngZone.runOutsideAngular(() => {\n this.heatmap = new google.maps.visualization.HeatmapLayer(this._combineOptions());\n });\n this._assertInitialized();\n this.heatmap.setMap(this._googleMap.googleMap);\n }\n }\n ngOnChanges(changes) {\n const { _data, heatmap } = this;\n if (heatmap) {\n if (changes['options']) {\n heatmap.setOptions(this._combineOptions());\n }\n if (changes['data'] && _data !== undefined) {\n heatmap.setData(this._normalizeData(_data));\n }\n }\n }\n ngOnDestroy() {\n if (this.heatmap) {\n this.heatmap.setMap(null);\n }\n }\n /**\n * Gets the data that is currently shown on the heatmap.\n * See: developers.google.com/maps/documentation/javascript/reference/visualization#HeatmapLayer\n */\n getData() {\n this._assertInitialized();\n return this.heatmap.getData();\n }\n /** Creates a combined options object using the passed-in options and the individual inputs. */\n _combineOptions() {\n const options = this._options || {};\n return Object.assign(Object.assign({}, options), { data: this._normalizeData(this._data || options.data || []), map: this._googleMap.googleMap });\n }\n /**\n * Most Google Maps APIs support both `LatLng` objects and `LatLngLiteral`. The latter is more\n * convenient to write out, because the Google Maps API doesn't have to have been loaded in order\n * to construct them. The `HeatmapLayer` appears to be an exception that only allows a `LatLng`\n * object, or it throws a runtime error. Since it's more convenient and we expect that Angular\n * users will load the API asynchronously, we allow them to pass in a `LatLngLiteral` and we\n * convert it to a `LatLng` object before passing it off to Google Maps.\n */\n _normalizeData(data) {\n const result = [];\n data.forEach(item => {\n result.push(isLatLngLiteral(item) ? new google.maps.LatLng(item.lat, item.lng) : item);\n });\n return result;\n }\n /** Asserts that the heatmap object has been initialized. */\n _assertInitialized() {\n if (typeof ngDevMode === 'undefined' || ngDevMode) {\n if (!this._googleMap.googleMap) {\n throw Error('Cannot access Google Map information before the API has been initialized. ' +\n 'Please wait for the API to load before trying to interact with it.');\n }\n if (!this.heatmap) {\n throw Error('Cannot interact with a Google Map HeatmapLayer before it has been ' +\n 'initialized. Please wait for the heatmap to load before trying to interact with it.');\n }\n }\n }\n}\nMapHeatmapLayer.ɵfac = function MapHeatmapLayer_Factory(t) { return new (t || MapHeatmapLayer)(ɵngcc0.ɵɵdirectiveInject(GoogleMap), ɵngcc0.ɵɵdirectiveInject(ɵngcc0.NgZone)); };\nMapHeatmapLayer.ɵdir = /*@__PURE__*/ ɵngcc0.ɵɵdefineDirective({ type: MapHeatmapLayer, selectors: [[\"map-heatmap-layer\"]], inputs: { data: \"data\", options: \"options\" }, exportAs: [\"mapHeatmapLayer\"], features: [ɵngcc0.ɵɵNgOnChangesFeature] });\nMapHeatmapLayer.ctorParameters = () => [\n { type: GoogleMap },\n { type: NgZone }\n];\nMapHeatmapLayer.propDecorators = {\n data: [{ type: Input }],\n options: [{ type: Input }]\n};\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(MapHeatmapLayer, [{\n type: Directive,\n args: [{\n selector: 'map-heatmap-layer',\n exportAs: 'mapHeatmapLayer'\n }]\n }], function () { return [{ type: GoogleMap }, { type: ɵngcc0.NgZone }]; }, { data: [{\n type: Input\n }], options: [{\n type: Input\n }] }); })();\n/** Asserts that an object is a `LatLngLiteral`. */\nfunction isLatLngLiteral(value) {\n return value && typeof value.lat === 'number' && typeof value.lng === 'number';\n}\n\n/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\nconst COMPONENTS = [\n GoogleMap,\n MapBaseLayer,\n MapBicyclingLayer,\n MapCircle,\n MapDirectionsRenderer,\n MapGroundOverlay,\n MapInfoWindow,\n MapKmlLayer,\n MapMarker,\n MapMarkerClusterer,\n MapPolygon,\n MapPolyline,\n MapRectangle,\n MapTrafficLayer,\n MapTransitLayer,\n MapHeatmapLayer,\n];\nclass GoogleMapsModule {\n}\nGoogleMapsModule.ɵfac = function GoogleMapsModule_Factory(t) { return new (t || GoogleMapsModule)(); };\nGoogleMapsModule.ɵmod = /*@__PURE__*/ ɵngcc0.ɵɵdefineNgModule({ type: GoogleMapsModule });\nGoogleMapsModule.ɵinj = /*@__PURE__*/ ɵngcc0.ɵɵdefineInjector({});\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(GoogleMapsModule, [{\n type: NgModule,\n args: [{\n declarations: COMPONENTS,\n exports: COMPONENTS\n }]\n }], null, null); })();\n(function () { (typeof ngJitMode === \"undefined\" || ngJitMode) && ɵngcc0.ɵɵsetNgModuleScope(GoogleMapsModule, { declarations: [GoogleMap, MapBaseLayer, MapBicyclingLayer, MapCircle, MapDirectionsRenderer, MapGroundOverlay, MapInfoWindow, MapKmlLayer, MapMarker, MapMarkerClusterer, MapPolygon, MapPolyline, MapRectangle, MapTrafficLayer, MapTransitLayer, MapHeatmapLayer], exports: [GoogleMap, MapBaseLayer, MapBicyclingLayer, MapCircle, MapDirectionsRenderer, MapGroundOverlay, MapInfoWindow, MapKmlLayer, MapMarker, MapMarkerClusterer, MapPolygon, MapPolyline, MapRectangle, MapTrafficLayer, MapTransitLayer, MapHeatmapLayer] }); })();\n\n/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n/**\n * Angular service that wraps the Google Maps DirectionsService from the Google Maps JavaScript\n * API.\n *\n * See developers.google.com/maps/documentation/javascript/reference/directions#DirectionsService\n */\nclass MapDirectionsService {\n constructor(_ngZone) {\n this._ngZone = _ngZone;\n }\n /**\n * See\n * developers.google.com/maps/documentation/javascript/reference/directions\n * #DirectionsService.route\n */\n route(request) {\n return new Observable(observer => {\n // Initialize the `DirectionsService` lazily since the Google Maps API may\n // not have been loaded when the provider is instantiated.\n if (!this._directionsService) {\n this._directionsService = new google.maps.DirectionsService();\n }\n const callback = (result, status) => {\n this._ngZone.run(() => {\n observer.next({ result, status });\n observer.complete();\n });\n };\n this._directionsService.route(request, callback);\n });\n }\n}\nMapDirectionsService.ɵfac = function MapDirectionsService_Factory(t) { return new (t || MapDirectionsService)(ɵngcc0.ɵɵinject(ɵngcc0.NgZone)); };\nMapDirectionsService.ɵprov = i0.ɵɵdefineInjectable({ factory: function MapDirectionsService_Factory() { return new MapDirectionsService(i0.ɵɵinject(i0.NgZone)); }, token: MapDirectionsService, providedIn: \"root\" });\nMapDirectionsService.ctorParameters = () => [\n { type: NgZone }\n];\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(MapDirectionsService, [{\n type: Injectable,\n args: [{ providedIn: 'root' }]\n }], function () { return [{ type: ɵngcc0.NgZone }]; }, null); })();\n\n/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n/**\n * Angular service that wraps the Google Maps Geocoder from the Google Maps JavaScript API.\n * See developers.google.com/maps/documentation/javascript/reference/geocoder#Geocoder\n */\nclass MapGeocoder {\n constructor(_ngZone) {\n this._ngZone = _ngZone;\n }\n /**\n * See developers.google.com/maps/documentation/javascript/reference/geocoder#Geocoder.geocode\n */\n geocode(request) {\n return new Observable(observer => {\n // Initialize the `Geocoder` lazily since the Google Maps API may\n // not have been loaded when the provider is instantiated.\n if (!this._geocoder) {\n this._geocoder = new google.maps.Geocoder();\n }\n this._geocoder.geocode(request, (results, status) => {\n this._ngZone.run(() => {\n observer.next({ results, status });\n observer.complete();\n });\n });\n });\n }\n}\nMapGeocoder.ɵfac = function MapGeocoder_Factory(t) { return new (t || MapGeocoder)(ɵngcc0.ɵɵinject(ɵngcc0.NgZone)); };\nMapGeocoder.ɵprov = i0.ɵɵdefineInjectable({ factory: function MapGeocoder_Factory() { return new MapGeocoder(i0.ɵɵinject(i0.NgZone)); }, token: MapGeocoder, providedIn: \"root\" });\nMapGeocoder.ctorParameters = () => [\n { type: NgZone }\n];\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(MapGeocoder, [{\n type: Injectable,\n args: [{ providedIn: 'root' }]\n }], function () { return [{ type: ɵngcc0.NgZone }]; }, null); })();\n\n/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n\n/**\n * Generated bundle index. Do not edit.\n */\n\nexport { GoogleMap, GoogleMapsModule, MapBaseLayer, MapBicyclingLayer, MapCircle, MapDirectionsRenderer, MapDirectionsService, MapGeocoder, MapGroundOverlay, MapHeatmapLayer, MapInfoWindow, MapKmlLayer, MapMarker, MapMarkerClusterer, MapPolygon, MapPolyline, MapRectangle, MapTrafficLayer, MapTransitLayer };\n\n","/**\n * @license Angular v7.2.16\n * (c) 2010-2019 Google LLC. https://angular.io/\n * License: MIT\n */\n\nimport { Injectable, NgModule, Version } from '@angular/core';\nimport { Observable } from 'rxjs';\nimport { ɵgetDOM } from '@angular/platform-browser';\n\n/**\n * @fileoverview added by tsickle\n * @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n/**\n * A backend for http that uses the `XMLHttpRequest` browser API.\n *\n * Take care not to evaluate this in non-browser contexts.\n *\n * @deprecated see https://angular.io/guide/http\n * \\@publicApi\n */\nimport * as ɵngcc0 from '@angular/core';\nclass BrowserXhr {\n constructor() { }\n /**\n * @return {?}\n */\n build() { return (/** @type {?} */ ((new XMLHttpRequest()))); }\n}\nBrowserXhr.ɵfac = function BrowserXhr_Factory(t) { return new (t || BrowserXhr)(); };\nBrowserXhr.ɵprov = /*@__PURE__*/ ɵngcc0.ɵɵdefineInjectable({ token: BrowserXhr, factory: BrowserXhr.ɵfac });\n/** @nocollapse */\nBrowserXhr.ctorParameters = () => [];\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(BrowserXhr, [{\n type: Injectable\n }], function () { return []; }, null); })();\n\n/**\n * @fileoverview added by tsickle\n * @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n/**\n * @license\n * Copyright Google Inc. All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n/** @enum {number} */\nconst RequestMethod = {\n Get: 0,\n Post: 1,\n Put: 2,\n Delete: 3,\n Options: 4,\n Head: 5,\n Patch: 6,\n};\nRequestMethod[RequestMethod.Get] = 'Get';\nRequestMethod[RequestMethod.Post] = 'Post';\nRequestMethod[RequestMethod.Put] = 'Put';\nRequestMethod[RequestMethod.Delete] = 'Delete';\nRequestMethod[RequestMethod.Options] = 'Options';\nRequestMethod[RequestMethod.Head] = 'Head';\nRequestMethod[RequestMethod.Patch] = 'Patch';\n/** @enum {number} */\nconst ReadyState = {\n Unsent: 0,\n Open: 1,\n HeadersReceived: 2,\n Loading: 3,\n Done: 4,\n Cancelled: 5,\n};\nReadyState[ReadyState.Unsent] = 'Unsent';\nReadyState[ReadyState.Open] = 'Open';\nReadyState[ReadyState.HeadersReceived] = 'HeadersReceived';\nReadyState[ReadyState.Loading] = 'Loading';\nReadyState[ReadyState.Done] = 'Done';\nReadyState[ReadyState.Cancelled] = 'Cancelled';\n/** @enum {number} */\nconst ResponseType = {\n Basic: 0,\n Cors: 1,\n Default: 2,\n Error: 3,\n Opaque: 4,\n};\nResponseType[ResponseType.Basic] = 'Basic';\nResponseType[ResponseType.Cors] = 'Cors';\nResponseType[ResponseType.Default] = 'Default';\nResponseType[ResponseType.Error] = 'Error';\nResponseType[ResponseType.Opaque] = 'Opaque';\n/** @enum {number} */\nconst ContentType = {\n NONE: 0,\n JSON: 1,\n FORM: 2,\n FORM_DATA: 3,\n TEXT: 4,\n BLOB: 5,\n ARRAY_BUFFER: 6,\n};\nContentType[ContentType.NONE] = 'NONE';\nContentType[ContentType.JSON] = 'JSON';\nContentType[ContentType.FORM] = 'FORM';\nContentType[ContentType.FORM_DATA] = 'FORM_DATA';\nContentType[ContentType.TEXT] = 'TEXT';\nContentType[ContentType.BLOB] = 'BLOB';\nContentType[ContentType.ARRAY_BUFFER] = 'ARRAY_BUFFER';\n/** @enum {number} */\nconst ResponseContentType = {\n Text: 0,\n Json: 1,\n ArrayBuffer: 2,\n Blob: 3,\n};\nResponseContentType[ResponseContentType.Text] = 'Text';\nResponseContentType[ResponseContentType.Json] = 'Json';\nResponseContentType[ResponseContentType.ArrayBuffer] = 'ArrayBuffer';\nResponseContentType[ResponseContentType.Blob] = 'Blob';\n\n/**\n * @fileoverview added by tsickle\n * @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n/**\n * @license\n * Copyright Google Inc. All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n/**\n * Polyfill for [Headers](https://developer.mozilla.org/en-US/docs/Web/API/Headers/Headers), as\n * specified in the [Fetch Spec](https://fetch.spec.whatwg.org/#headers-class).\n *\n * The only known difference between this `Headers` implementation and the spec is the\n * lack of an `entries` method.\n *\n * \\@usageNotes\n * ### Example\n *\n * ```\n * import {Headers} from '\\@angular/http';\n *\n * var firstHeaders = new Headers();\n * firstHeaders.append('Content-Type', 'image/jpeg');\n * console.log(firstHeaders.get('Content-Type')) //'image/jpeg'\n *\n * // Create headers from Plain Old JavaScript Object\n * var secondHeaders = new Headers({\n * 'X-My-Custom-Header': 'Angular'\n * });\n * console.log(secondHeaders.get('X-My-Custom-Header')); //'Angular'\n *\n * var thirdHeaders = new Headers(secondHeaders);\n * console.log(thirdHeaders.get('X-My-Custom-Header')); //'Angular'\n * ```\n *\n * @deprecated see https://angular.io/guide/http\n * \\@publicApi\n */\nclass Headers {\n // TODO(vicb): any -> string|string[]\n /**\n * @param {?=} headers\n */\n constructor(headers) {\n /**\n * \\@internal header names are lower case\n */\n this._headers = new Map();\n /**\n * \\@internal map lower case names to actual names\n */\n this._normalizedNames = new Map();\n if (!headers) {\n return;\n }\n if (headers instanceof Headers) {\n headers.forEach((values, name) => {\n values.forEach(value => this.append(name, value));\n });\n return;\n }\n Object.keys(headers).forEach((name) => {\n /** @type {?} */\n const values = Array.isArray(headers[name]) ? headers[name] : [headers[name]];\n this.delete(name);\n values.forEach(value => this.append(name, value));\n });\n }\n /**\n * Returns a new Headers instance from the given DOMString of Response Headers\n * @param {?} headersString\n * @return {?}\n */\n static fromResponseHeaderString(headersString) {\n /** @type {?} */\n const headers = new Headers();\n headersString.split('\\n').forEach(line => {\n /** @type {?} */\n const index = line.indexOf(':');\n if (index > 0) {\n /** @type {?} */\n const name = line.slice(0, index);\n /** @type {?} */\n const value = line.slice(index + 1).trim();\n headers.set(name, value);\n }\n });\n return headers;\n }\n /**\n * Appends a header to existing list of header values for a given header name.\n * @param {?} name\n * @param {?} value\n * @return {?}\n */\n append(name, value) {\n /** @type {?} */\n const values = this.getAll(name);\n if (values === null) {\n this.set(name, value);\n }\n else {\n values.push(value);\n }\n }\n /**\n * Deletes all header values for the given name.\n * @param {?} name\n * @return {?}\n */\n delete(name) {\n /** @type {?} */\n const lcName = name.toLowerCase();\n this._normalizedNames.delete(lcName);\n this._headers.delete(lcName);\n }\n /**\n * @param {?} fn\n * @return {?}\n */\n forEach(fn) {\n this._headers.forEach((values, lcName) => fn(values, this._normalizedNames.get(lcName), this._headers));\n }\n /**\n * Returns first header that matches given name.\n * @param {?} name\n * @return {?}\n */\n get(name) {\n /** @type {?} */\n const values = this.getAll(name);\n if (values === null) {\n return null;\n }\n return values.length > 0 ? values[0] : null;\n }\n /**\n * Checks for existence of header by given name.\n * @param {?} name\n * @return {?}\n */\n has(name) { return this._headers.has(name.toLowerCase()); }\n /**\n * Returns the names of the headers\n * @return {?}\n */\n keys() { return Array.from(this._normalizedNames.values()); }\n /**\n * Sets or overrides header value for given name.\n * @param {?} name\n * @param {?} value\n * @return {?}\n */\n set(name, value) {\n if (Array.isArray(value)) {\n if (value.length) {\n this._headers.set(name.toLowerCase(), [value.join(',')]);\n }\n }\n else {\n this._headers.set(name.toLowerCase(), [value]);\n }\n this.mayBeSetNormalizedName(name);\n }\n /**\n * Returns values of all headers.\n * @return {?}\n */\n values() { return Array.from(this._headers.values()); }\n /**\n * Returns string of all headers.\n * @return {?}\n */\n // TODO(vicb): returns {[name: string]: string[]}\n toJSON() {\n /** @type {?} */\n const serialized = {};\n this._headers.forEach((values, name) => {\n /** @type {?} */\n const split = [];\n values.forEach(v => split.push(...v.split(',')));\n serialized[(/** @type {?} */ (this._normalizedNames.get(name)))] = split;\n });\n return serialized;\n }\n /**\n * Returns list of header values for a given name.\n * @param {?} name\n * @return {?}\n */\n getAll(name) {\n return this.has(name) ? this._headers.get(name.toLowerCase()) || null : null;\n }\n /**\n * This method is not implemented.\n * @return {?}\n */\n entries() { throw new Error('\"entries\" method is not implemented on Headers class'); }\n /**\n * @private\n * @param {?} name\n * @return {?}\n */\n mayBeSetNormalizedName(name) {\n /** @type {?} */\n const lcName = name.toLowerCase();\n if (!this._normalizedNames.has(lcName)) {\n this._normalizedNames.set(lcName, name);\n }\n }\n}\n\n/**\n * @fileoverview added by tsickle\n * @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n/**\n * Creates a response options object to be optionally provided when instantiating a\n * {\\@link Response}.\n *\n * This class is based on the `ResponseInit` description in the [Fetch\n * Spec](https://fetch.spec.whatwg.org/#responseinit).\n *\n * All values are null by default. Typical defaults can be found in the\n * {\\@link BaseResponseOptions} class, which sub-classes `ResponseOptions`.\n *\n * This class may be used in tests to build {\\@link Response Responses} for\n * mock responses (see {\\@link MockBackend}).\n *\n * \\@usageNotes\n * ### Example\n *\n * ```typescript\n * import {ResponseOptions, Response} from '\\@angular/http';\n *\n * var options = new ResponseOptions({\n * body: '{\"name\":\"Jeff\"}'\n * });\n * var res = new Response(options);\n *\n * console.log('res.json():', res.json()); // Object {name: \"Jeff\"}\n * ```\n *\n * @deprecated see https://angular.io/guide/http\n * \\@publicApi\n */\nclass ResponseOptions {\n /**\n * @param {?=} opts\n */\n constructor(opts = {}) {\n const { body, status, headers, statusText, type, url } = opts;\n this.body = body != null ? body : null;\n this.status = status != null ? status : null;\n this.headers = headers != null ? headers : null;\n this.statusText = statusText != null ? statusText : null;\n this.type = type != null ? type : null;\n this.url = url != null ? url : null;\n }\n /**\n * Creates a copy of the `ResponseOptions` instance, using the optional input as values to\n * override\n * existing values. This method will not change the values of the instance on which it is being\n * called.\n *\n * This may be useful when sharing a base `ResponseOptions` object inside tests,\n * where certain properties may change from test to test.\n *\n * \\@usageNotes\n * ### Example\n *\n * ```typescript\n * import {ResponseOptions, Response} from '\\@angular/http';\n *\n * var options = new ResponseOptions({\n * body: {name: 'Jeff'}\n * });\n * var res = new Response(options.merge({\n * url: 'https://google.com'\n * }));\n * console.log('options.url:', options.url); // null\n * console.log('res.json():', res.json()); // Object {name: \"Jeff\"}\n * console.log('res.url:', res.url); // https://google.com\n * ```\n * @param {?=} options\n * @return {?}\n */\n merge(options) {\n return new ResponseOptions({\n body: options && options.body != null ? options.body : this.body,\n status: options && options.status != null ? options.status : this.status,\n headers: options && options.headers != null ? options.headers : this.headers,\n statusText: options && options.statusText != null ? options.statusText : this.statusText,\n type: options && options.type != null ? options.type : this.type,\n url: options && options.url != null ? options.url : this.url,\n });\n }\n}\n/**\n * Subclass of {\\@link ResponseOptions}, with default values.\n *\n * Default values:\n * * status: 200\n * * headers: empty {\\@link Headers} object\n *\n * This class could be extended and bound to the {\\@link ResponseOptions} class\n * when configuring an {\\@link Injector}, in order to override the default options\n * used by {\\@link Http} to create {\\@link Response Responses}.\n *\n * \\@usageNotes\n * ### Example\n *\n * ```typescript\n * import {provide} from '\\@angular/core';\n * import {bootstrap} from '\\@angular/platform-browser/browser';\n * import {HTTP_PROVIDERS, Headers, Http, BaseResponseOptions, ResponseOptions} from\n * '\\@angular/http';\n * import {App} from './myapp';\n *\n * class MyOptions extends BaseResponseOptions {\n * headers:Headers = new Headers({network: 'github'});\n * }\n *\n * bootstrap(App, [HTTP_PROVIDERS, {provide: ResponseOptions, useClass: MyOptions}]);\n * ```\n *\n * The options could also be extended when manually creating a {\\@link Response}\n * object.\n *\n * ### Example\n *\n * ```\n * import {BaseResponseOptions, Response} from '\\@angular/http';\n *\n * var options = new BaseResponseOptions();\n * var res = new Response(options.merge({\n * body: 'Angular',\n * headers: new Headers({framework: 'angular'})\n * }));\n * console.log('res.headers.get(\"framework\"):', res.headers.get('framework')); // angular\n * console.log('res.text():', res.text()); // Angular;\n * ```\n *\n * @deprecated see https://angular.io/guide/http\n * \\@publicApi\n */\nclass BaseResponseOptions extends ResponseOptions {\n constructor() {\n super({ status: 200, statusText: 'Ok', type: ResponseType.Default, headers: new Headers() });\n }\n}\nBaseResponseOptions.ɵfac = function BaseResponseOptions_Factory(t) { return new (t || BaseResponseOptions)(); };\nBaseResponseOptions.ɵprov = /*@__PURE__*/ ɵngcc0.ɵɵdefineInjectable({ token: BaseResponseOptions, factory: BaseResponseOptions.ɵfac });\n/** @nocollapse */\nBaseResponseOptions.ctorParameters = () => [];\n(function () { (typeof ngDevMode === \"undefined\" || ngDevMode) && ɵngcc0.ɵsetClassMetadata(BaseResponseOptions, [{\n type: Injectable\n }], function () { return []; }, null); })();\n\n/**\n * @fileoverview added by tsickle\n * @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n/**\n * @license\n * Copyright Google Inc. All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n/**\n * Abstract class from which real backends are derived.\n *\n * The primary purpose of a `ConnectionBackend` is to create new connections to fulfill a given\n * {\\@link Request}.\n *\n * @deprecated see https://angular.io/guide/http\n * \\@publicApi\n * @abstract\n */\nclass ConnectionBackend {\n}\n/**\n * Abstract class from which real connections are derived.\n *\n * @deprecated see https://angular.io/guide/http\n * \\@publicApi\n * @abstract\n */\nclass Connection {\n}\n/**\n * An XSRFStrategy configures XSRF protection (e.g. via headers) on an HTTP request.\n *\n * @deprecated see https://angular.io/guide/http\n * \\@publicApi\n * @abstract\n */\nclass XSRFStrategy {\n}\n\n/**\n * @fileoverview added by tsickle\n * @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n/**\n * @param {?} method\n * @return {?}\n */\nfunction normalizeMethodName(method) {\n if (typeof method !== 'string')\n return method;\n switch (method.toUpperCase()) {\n case 'GET':\n return RequestMethod.Get;\n case 'POST':\n return RequestMethod.Post;\n case 'PUT':\n return RequestMethod.Put;\n case 'DELETE':\n return RequestMethod.Delete;\n case 'OPTIONS':\n return RequestMethod.Options;\n case 'HEAD':\n return RequestMethod.Head;\n case 'PATCH':\n return RequestMethod.Patch;\n }\n throw new Error(`Invalid request method. The method \"${method}\" is not supported.`);\n}\n/** @type {?} */\nconst isSuccess = (status) => (status >= 200 && status < 300);\n/**\n * @param {?} xhr\n * @return {?}\n */\nfunction getResponseURL(xhr) {\n if ('responseURL' in xhr) {\n return xhr.responseURL;\n }\n if (/^X-Request-URL:/m.test(xhr.getAllResponseHeaders())) {\n return xhr.getResponseHeader('X-Request-URL');\n }\n return null;\n}\n/**\n * @param {?} input\n * @return {?}\n */\nfunction stringToArrayBuffer(input) {\n /** @type {?} */\n const view = new Uint16Array(input.length);\n for (let i = 0, strLen = input.length; i < strLen; i++) {\n view[i] = input.charCodeAt(i);\n }\n return view.buffer;\n}\n\n/**\n * @fileoverview added by tsickle\n * @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n/**\n * @license\n * Copyright Google Inc. All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n/**\n * @param {?=} rawParams\n * @return {?}\n */\nfunction paramParser(rawParams = '') {\n /** @type {?} */\n const map = new Map();\n if (rawParams.length > 0) {\n /** @type {?} */\n const params = rawParams.split('&');\n params.forEach((param) => {\n /** @type {?} */\n const eqIdx = param.indexOf('=');\n const [key, val] = eqIdx == -1 ? [param, ''] : [param.slice(0, eqIdx), param.slice(eqIdx + 1)];\n /** @type {?} */\n const list = map.get(key) || [];\n list.push(val);\n map.set(key, list);\n });\n }\n return map;\n}\n/**\n * @deprecated see https://angular.io/guide/http\n * \\@publicApi\n *\n */\nclass QueryEncoder {\n /**\n * @param {?} key\n * @return {?}\n */\n encodeKey(key) { return standardEncoding(key); }\n /**\n * @param {?} value\n * @return {?}\n */\n encodeValue(value) { return standardEncoding(value); }\n}\n/**\n * @param {?} v\n * @return {?}\n */\nfunction standardEncoding(v) {\n return encodeURIComponent(v)\n .replace(/%40/gi, '@')\n .replace(/%3A/gi, ':')\n .replace(/%24/gi, '$')\n .replace(/%2C/gi, ',')\n .replace(/%3B/gi, ';')\n .replace(/%2B/gi, '+')\n .replace(/%3D/gi, '=')\n .replace(/%3F/gi, '?')\n .replace(/%2F/gi, '/');\n}\n/**\n * Map-like representation of url search parameters, based on\n * [URLSearchParams](https://url.spec.whatwg.org/#urlsearchparams) in the url living standard,\n * with several extensions for merging URLSearchParams objects:\n * - setAll()\n * - appendAll()\n * - replaceAll()\n *\n * This class accepts an optional second parameter of ${\\@link QueryEncoder},\n * which is used to serialize parameters before making a request. By default,\n * `QueryEncoder` encodes keys and values of parameters using `encodeURIComponent`,\n * and then un-encodes certain characters that are allowed to be part of the query\n * according to IETF RFC 3986: https://tools.ietf.org/html/rfc3986.\n *\n * These are the characters that are not encoded: `! $ \\' ( ) * + , ; A 9 - . _ ~ ? /`\n *\n * If the set of allowed query characters is not acceptable for a particular backend,\n * `QueryEncoder` can be subclassed and provided as the 2nd argument to URLSearchParams.\n *\n * ```\n * import {URLSearchParams, QueryEncoder} from '\\@angular/http';\n * class MyQueryEncoder extends QueryEncoder {\n * encodeKey(k: string): string {\n * return myEncodingFunction(k);\n * }\n *\n * encodeValue(v: string): string {\n * return myEncodingFunction(v);\n * }\n * }\n *\n * let params = new URLSearchParams('', new MyQueryEncoder());\n * ```\n * @deprecated see https://angular.io/guide/http\n * \\@publicApi\n */\nclass URLSearchParams {\n /**\n * @param {?=} rawParams\n * @param {?=} queryEncoder\n */\n constructor(rawParams = '', queryEncoder = new QueryEncoder()) {\n this.rawParams = rawParams;\n this.queryEncoder = queryEncoder;\n this.paramsMap = paramParser(rawParams);\n }\n /**\n * @return {?}\n */\n clone() {\n /** @type {?} */\n const clone = new URLSearchParams('', this.queryEncoder);\n clone.appendAll(this);\n return clone;\n }\n /**\n * @param {?} param\n * @return {?}\n */\n has(param) { return this.paramsMap.has(param); }\n /**\n * @param {?} param\n * @return {?}\n */\n get(param) {\n /** @type {?} */\n const storedParam = this.paramsMap.get(param);\n return Array.isArray(storedParam) ? storedParam[0] : null;\n }\n /**\n * @param {?} param\n * @return {?}\n */\n getAll(param) { return this.paramsMap.get(param) || []; }\n /**\n * @param {?} param\n * @param {?} val\n * @return {?}\n */\n set(param, val) {\n if (val === void 0 || val === null) {\n this.delete(param);\n return;\n }\n /** @type {?} */\n const list = this.paramsMap.get(param) || [];\n list.length = 0;\n list.push(val);\n this.paramsMap.set(param, list);\n }\n // A merge operation\n // For each name-values pair in `searchParams`, perform `set(name, values[0])`\n //\n // E.g: \"a=[1,2,3], c=[8]\" + \"a=[4,5,6], b=[7]\" = \"a=[4], c=[8], b=[7]\"\n //\n // TODO(@caitp): document this better\n /**\n * @param {?} searchParams\n * @return {?}\n */\n setAll(searchParams) {\n searchParams.paramsMap.forEach((value, param) => {\n /** @type {?} */\n const list = this.paramsMap.get(param) || [];\n list.length = 0;\n list.push(value[0]);\n this.paramsMap.set(param, list);\n });\n }\n /**\n * @param {?} param\n * @param {?} val\n * @return {?}\n */\n append(param, val) {\n if (val === void 0 || val === null)\n return;\n /** @type {?} */\n const list = this.paramsMap.get(param) || [];\n list.push(val);\n this.paramsMap.set(param, list);\n }\n // A merge operation\n // For each name-values pair in `searchParams`, perform `append(name, value)`\n // for each value in `values`.\n //\n // E.g: \"a=[1,2], c=[8]\" + \"a=[3,4], b=[7]\" = \"a=[1,2,3,4], c=[8], b=[7]\"\n //\n // TODO(@caitp): document this better\n /**\n * @param {?} searchParams\n * @return {?}\n */\n appendAll(searchParams) {\n searchParams.paramsMap.forEach((value, param) => {\n /** @type {?} */\n const list = this.paramsMap.get(param) || [];\n for (let i = 0; i < value.length; ++i) {\n list.push(value[i]);\n }\n this.paramsMap.set(param, list);\n });\n }\n // A merge operation\n // For each name-values pair in `searchParams`, perform `delete(name)`,\n // followed by `set(name, values)`\n //\n // E.g: \"a=[1,2,3], c=[8]\" + \"a=[4,5,6], b=[7]\" = \"a=[4,5,6], c=[8], b=[7]\"\n //\n // TODO(@caitp): document this better\n /**\n * @param {?} searchParams\n * @return {?}\n */\n replaceAll(searchParams) {\n searchParams.paramsMap.forEach((value, param) => {\n /** @type {?} */\n const list = this.paramsMap.get(param) || [];\n list.length = 0;\n for (let i = 0; i < value.length; ++i) {\n list.push(value[i]);\n }\n this.paramsMap.set(param, list);\n });\n }\n /**\n * @return {?}\n */\n toString() {\n /** @type {?} */\n const paramsList = [];\n this.paramsMap.forEach((values, k) => {\n values.forEach(v => paramsList.push(this.queryEncoder.encodeKey(k) + '=' + this.queryEncoder.encodeValue(v)));\n });\n return paramsList.join('&');\n }\n /**\n * @param {?} param\n * @return {?}\n */\n delete(param) { this.paramsMap.delete(param); }\n}\n\n/**\n * @fileoverview added by tsickle\n * @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n/**\n * HTTP request body used by both {\\@link Request} and {\\@link Response}\n * https://fetch.spec.whatwg.org/#body\n * @abstract\n */\nclass Body {\n /**\n * Attempts to return body as parsed `JSON` object, or raises an exception.\n * @return {?}\n */\n json() {\n if (typeof this._body === 'string') {\n return JSON.parse((/** @type {?} */ (this._body)));\n }\n if (this._body instanceof ArrayBuffer) {\n return JSON.parse(this.text());\n }\n return this._body;\n }\n /**\n * Returns the body as a string, presuming `toString()` can be called on the response body.\n *\n * When decoding an `ArrayBuffer`, the optional `encodingHint` parameter determines how the\n * bytes in the buffer will be interpreted. Valid values are:\n *\n * - `legacy` - incorrectly interpret the bytes as UTF-16 (technically, UCS-2). Only characters\n * in the Basic Multilingual Plane are supported, surrogate pairs are not handled correctly.\n * In addition, the endianness of the 16-bit octet pairs in the `ArrayBuffer` is not taken\n * into consideration. This is the default behavior to avoid breaking apps, but should be\n * considered deprecated.\n *\n * - `iso-8859` - interpret the bytes as ISO-8859 (which can be used for ASCII encoded text).\n * @param {?=} encodingHint\n * @return {?}\n */\n text(encodingHint = 'legacy') {\n if (this._body instanceof URLSearchParams) {\n return this._body.toString();\n }\n if (this._body instanceof ArrayBuffer) {\n switch (encodingHint) {\n case 'legacy':\n return String.fromCharCode.apply(null, new Uint16Array((/** @type {?} */ (this._body))));\n case 'iso-8859':\n return String.fromCharCode.apply(null, new Uint8Array((/** @type {?} */ (this._body))));\n default:\n throw new Error(`Invalid value for encodingHint: ${encodingHint}`);\n }\n }\n if (this._body == null) {\n return '';\n }\n if (typeof this._body === 'object') {\n return JSON.stringify(this._body, null, 2);\n }\n return this._body.toString();\n }\n /**\n * Return the body as an ArrayBuffer\n * @return {?}\n */\n arrayBuffer() {\n if (this._body instanceof ArrayBuffer) {\n return (/** @type {?} */ (this._body));\n }\n return stringToArrayBuffer(this.text());\n }\n /**\n * Returns the request's body as a Blob, assuming that body exists.\n * @return {?}\n */\n blob() {\n if (this._body instanceof Blob) {\n return (/** @type {?} */ (this._body));\n }\n if (this._body instanceof ArrayBuffer) {\n return new Blob([this._body]);\n }\n throw new Error('The request body isn\\'t either a blob or an array buffer');\n }\n}\n\n/**\n * @fileoverview added by tsickle\n * @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n/**\n * Creates `Response` instances from provided values.\n *\n * Though this object isn't\n * usually instantiated by end-users, it is the primary object interacted with when it comes time to\n * add data to a view.\n *\n * \\@usageNotes\n * ### Example\n *\n * ```\n * http.request('my-friends.txt').subscribe(response => this.friends = response.text());\n * ```\n *\n * The Response's interface is inspired by the Response constructor defined in the [Fetch\n * Spec](https://fetch.spec.whatwg.org/#response-class), but is considered a static value whose body\n * can be accessed many times. There are other differences in the implementation, but this is the\n * most significant.\n *\n * @deprecated see https://angular.io/guide/http\n * \\@publicApi\n */\nclass Response extends Body {\n /**\n * @param {?} responseOptions\n */\n constructor(responseOptions) {\n super();\n this._body = responseOptions.body;\n this.status = (/** @type {?} */ (responseOptions.status));\n this.ok = (this.status >= 200 && this.status <= 299);\n this.statusText = responseOptions.statusText;\n this.headers = responseOptions.headers;\n this.type = (/** @type {?} */ (responseOptions.type));\n this.url = (/** @type {?} */ (responseOptions.url));\n }\n /**\n * @return {?}\n */\n toString() {\n return `Response with status: ${this.status} ${this.statusText} for URL: ${this.url}`;\n }\n}\n\n/**\n * @fileoverview added by tsickle\n * @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc\n */\n/** @type {?} */\nlet _nextRequestId = 0;\n/** @type {?} */\nconst JSONP_HOME = '__ng_jsonp__';\n/** @type {?} */\nlet _jsonpConnections = null;\n/**\n * @return {?}\n */\nfunction _getJsonpConnections() {\n /** @type {?} */\n const w = typeof window == 'object' ? window : {};\n if (_jsonpConnections === null) {\n _jsonpConnections = w[JSONP_HOME] = {};\n }\n return _jsonpConnections;\n}\n// Make sure not to evaluate this in a non-browser environment!\nclass BrowserJsonp {\n // Construct a ' + '