/** * @license * Copyright Google LLC All Rights Reserved. * * Use of this source code is governed by an MIT-style license that can be * found in the LICENSE file at https://angular.io/license */ import { NgModule, Injectable, NgZone, ɵɵdefineInjectable, ɵɵinject } from '@angular/core'; import { Platform } from '@angular/cdk/platform'; import { combineLatest, concat, Observable, Subject } from 'rxjs'; import { debounceTime, map, skip, startWith, take, takeUntil } from 'rxjs/operators'; import { coerceArray } from '@angular/cdk/coercion'; /** * @fileoverview added by tsickle * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ var LayoutModule = /** @class */ (function () { function LayoutModule() { } LayoutModule.decorators = [ { type: NgModule, args: [{},] }, ]; return LayoutModule; }()); /** * @fileoverview added by tsickle * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ /** * Global registry for all dynamically-created, injected media queries. * @type {?} */ var mediaQueriesForWebkitCompatibility = new Set(); /** * Style tag that holds all of the dynamically-created media queries. * @type {?} */ var mediaQueryStyleNode; /** * A utility for calling matchMedia queries. */ var MediaMatcher = /** @class */ (function () { function MediaMatcher(_platform) { this._platform = _platform; this._matchMedia = this._platform.isBrowser && window.matchMedia ? // matchMedia is bound to the window scope intentionally as it is an illegal invocation to // call it from a different scope. window.matchMedia.bind(window) : noopMatchMedia; } /** * Evaluates the given media query and returns the native MediaQueryList from which results * can be retrieved. * Confirms the layout engine will trigger for the selector query provided and returns the * MediaQueryList for the query provided. */ /** * Evaluates the given media query and returns the native MediaQueryList from which results * can be retrieved. * Confirms the layout engine will trigger for the selector query provided and returns the * MediaQueryList for the query provided. * @param {?} query * @return {?} */ MediaMatcher.prototype.matchMedia = /** * Evaluates the given media query and returns the native MediaQueryList from which results * can be retrieved. * Confirms the layout engine will trigger for the selector query provided and returns the * MediaQueryList for the query provided. * @param {?} query * @return {?} */ function (query) { if (this._platform.WEBKIT) { createEmptyStyleRule(query); } return this._matchMedia(query); }; MediaMatcher.decorators = [ { type: Injectable, args: [{ providedIn: 'root' },] }, ]; /** @nocollapse */ MediaMatcher.ctorParameters = function () { return [ { type: Platform } ]; }; /** @nocollapse */ MediaMatcher.ngInjectableDef = ɵɵdefineInjectable({ factory: function MediaMatcher_Factory() { return new MediaMatcher(ɵɵinject(Platform)); }, token: MediaMatcher, providedIn: "root" }); return MediaMatcher; }()); /** * For Webkit engines that only trigger the MediaQueryListListener when * there is at least one CSS selector for the respective media query. * @param {?} query * @return {?} */ function createEmptyStyleRule(query) { if (mediaQueriesForWebkitCompatibility.has(query)) { return; } try { if (!mediaQueryStyleNode) { mediaQueryStyleNode = document.createElement('style'); mediaQueryStyleNode.setAttribute('type', 'text/css'); (/** @type {?} */ (document.head)).appendChild(mediaQueryStyleNode); } if (mediaQueryStyleNode.sheet) { ((/** @type {?} */ (mediaQueryStyleNode.sheet))) .insertRule("@media " + query + " {.fx-query-test{ }}", 0); mediaQueriesForWebkitCompatibility.add(query); } } catch (e) { console.error(e); } } /** * No-op matchMedia replacement for non-browser platforms. * @param {?} query * @return {?} */ function noopMatchMedia(query) { // Use `as any` here to avoid adding additional necessary properties for // the noop matcher. return (/** @type {?} */ ({ matches: query === 'all' || query === '', media: query, addListener: (/** * @return {?} */ function () { }), removeListener: (/** * @return {?} */ function () { }) })); } /** * @fileoverview added by tsickle * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ /** * Utility for checking the matching state of \@media queries. */ var BreakpointObserver = /** @class */ (function () { function BreakpointObserver(_mediaMatcher, _zone) { this._mediaMatcher = _mediaMatcher; this._zone = _zone; /** * A map of all media queries currently being listened for. */ this._queries = new Map(); /** * A subject for all other observables to takeUntil based on. */ this._destroySubject = new Subject(); } /** Completes the active subject, signalling to all other observables to complete. */ /** * Completes the active subject, signalling to all other observables to complete. * @return {?} */ BreakpointObserver.prototype.ngOnDestroy = /** * Completes the active subject, signalling to all other observables to complete. * @return {?} */ function () { this._destroySubject.next(); this._destroySubject.complete(); }; /** * Whether one or more media queries match the current viewport size. * @param value One or more media queries to check. * @returns Whether any of the media queries match. */ /** * Whether one or more media queries match the current viewport size. * @param {?} value One or more media queries to check. * @return {?} Whether any of the media queries match. */ BreakpointObserver.prototype.isMatched = /** * Whether one or more media queries match the current viewport size. * @param {?} value One or more media queries to check. * @return {?} Whether any of the media queries match. */ function (value) { var _this = this; /** @type {?} */ var queries = splitQueries(coerceArray(value)); return queries.some((/** * @param {?} mediaQuery * @return {?} */ function (mediaQuery) { return _this._registerQuery(mediaQuery).mql.matches; })); }; /** * Gets an observable of results for the given queries that will emit new results for any changes * in matching of the given queries. * @param value One or more media queries to check. * @returns A stream of matches for the given queries. */ /** * Gets an observable of results for the given queries that will emit new results for any changes * in matching of the given queries. * @param {?} value One or more media queries to check. * @return {?} A stream of matches for the given queries. */ BreakpointObserver.prototype.observe = /** * Gets an observable of results for the given queries that will emit new results for any changes * in matching of the given queries. * @param {?} value One or more media queries to check. * @return {?} A stream of matches for the given queries. */ function (value) { var _this = this; /** @type {?} */ var queries = splitQueries(coerceArray(value)); /** @type {?} */ var observables = queries.map((/** * @param {?} query * @return {?} */ function (query) { return _this._registerQuery(query).observable; })); /** @type {?} */ var stateObservable = combineLatest(observables); // Emit the first state immediately, and then debounce the subsequent emissions. stateObservable = concat(stateObservable.pipe(take(1)), stateObservable.pipe(skip(1), debounceTime(0))); return stateObservable.pipe(map((/** * @param {?} breakpointStates * @return {?} */ function (breakpointStates) { /** @type {?} */ var response = { matches: false, breakpoints: {}, }; breakpointStates.forEach((/** * @param {?} state * @return {?} */ function (state) { response.matches = response.matches || state.matches; response.breakpoints[state.query] = state.matches; })); return response; }))); }; /** Registers a specific query to be listened for. */ /** * Registers a specific query to be listened for. * @private * @param {?} query * @return {?} */ BreakpointObserver.prototype._registerQuery = /** * Registers a specific query to be listened for. * @private * @param {?} query * @return {?} */ function (query) { var _this = this; // Only set up a new MediaQueryList if it is not already being listened for. if (this._queries.has(query)) { return (/** @type {?} */ (this._queries.get(query))); } /** @type {?} */ var mql = this._mediaMatcher.matchMedia(query); // Create callback for match changes and add it is as a listener. /** @type {?} */ var queryObservable = new Observable((/** * @param {?} observer * @return {?} */ function (observer) { // Listener callback methods are wrapped to be placed back in ngZone. Callbacks must be placed // back into the zone because matchMedia is only included in Zone.js by loading the // webapis-media-query.js file alongside the zone.js file. Additionally, some browsers do not // have MediaQueryList inherit from EventTarget, which causes inconsistencies in how Zone.js // patches it. /** @type {?} */ var handler = (/** * @param {?} e * @return {?} */ function (e) { return _this._zone.run((/** * @return {?} */ function () { return observer.next(e); })); }); mql.addListener(handler); return (/** * @return {?} */ function () { mql.removeListener(handler); }); })).pipe(startWith(mql), map((/** * @param {?} nextMql * @return {?} */ function (nextMql) { return ({ query: query, matches: nextMql.matches }); })), takeUntil(this._destroySubject)); // Add the MediaQueryList to the set of queries. /** @type {?} */ var output = { observable: queryObservable, mql: mql }; this._queries.set(query, output); return output; }; BreakpointObserver.decorators = [ { type: Injectable, args: [{ providedIn: 'root' },] }, ]; /** @nocollapse */ BreakpointObserver.ctorParameters = function () { return [ { type: MediaMatcher }, { type: NgZone } ]; }; /** @nocollapse */ BreakpointObserver.ngInjectableDef = ɵɵdefineInjectable({ factory: function BreakpointObserver_Factory() { return new BreakpointObserver(ɵɵinject(MediaMatcher), ɵɵinject(NgZone)); }, token: BreakpointObserver, providedIn: "root" }); return BreakpointObserver; }()); /** * Split each query string into separate query strings if two queries are provided as comma * separated. * @param {?} queries * @return {?} */ function splitQueries(queries) { return queries.map((/** * @param {?} query * @return {?} */ function (query) { return query.split(','); })) .reduce((/** * @param {?} a1 * @param {?} a2 * @return {?} */ function (a1, a2) { return a1.concat(a2); })) .map((/** * @param {?} query * @return {?} */ function (query) { return query.trim(); })); } /** * @fileoverview added by tsickle * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ // PascalCase is being used as Breakpoints is used like an enum. // tslint:disable-next-line:variable-name /** * @license * Copyright Google LLC All Rights Reserved. * * Use of this source code is governed by an MIT-style license that can be * found in the LICENSE file at https://angular.io/license * @type {?} */ var Breakpoints = { XSmall: '(max-width: 599.99px)', Small: '(min-width: 600px) and (max-width: 959.99px)', Medium: '(min-width: 960px) and (max-width: 1279.99px)', Large: '(min-width: 1280px) and (max-width: 1919.99px)', XLarge: '(min-width: 1920px)', Handset: '(max-width: 599.99px) and (orientation: portrait), ' + '(max-width: 959.99px) and (orientation: landscape)', Tablet: '(min-width: 600px) and (max-width: 839.99px) and (orientation: portrait), ' + '(min-width: 960px) and (max-width: 1279.99px) and (orientation: landscape)', Web: '(min-width: 840px) and (orientation: portrait), ' + '(min-width: 1280px) and (orientation: landscape)', HandsetPortrait: '(max-width: 599.99px) and (orientation: portrait)', TabletPortrait: '(min-width: 600px) and (max-width: 839.99px) and (orientation: portrait)', WebPortrait: '(min-width: 840px) and (orientation: portrait)', HandsetLandscape: '(max-width: 959.99px) and (orientation: landscape)', TabletLandscape: '(min-width: 960px) and (max-width: 1279.99px) and (orientation: landscape)', WebLandscape: '(min-width: 1280px) and (orientation: landscape)', }; /** * @fileoverview added by tsickle * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ /** * @fileoverview added by tsickle * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ export { LayoutModule, BreakpointObserver, Breakpoints, MediaMatcher }; //# sourceMappingURL=layout.es5.js.map