| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388 |
- /**
- * @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
- */
- (function (global, factory) {
- typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/cdk/platform'), require('rxjs'), require('rxjs/operators'), require('@angular/cdk/coercion')) :
- typeof define === 'function' && define.amd ? define('@angular/cdk/layout', ['exports', '@angular/core', '@angular/cdk/platform', 'rxjs', 'rxjs/operators', '@angular/cdk/coercion'], factory) :
- (factory((global.ng = global.ng || {}, global.ng.cdk = global.ng.cdk || {}, global.ng.cdk.layout = {}),global.ng.core,global.ng.cdk.platform,global.rxjs,global.rxjs.operators,global.ng.cdk.coercion));
- }(this, (function (exports,core,platform,rxjs,operators,coercion) { 'use strict';
- /**
- * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
- var LayoutModule = /** @class */ (function () {
- function LayoutModule() {
- }
- LayoutModule.decorators = [
- { type: core.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: core.Injectable, args: [{ providedIn: 'root' },] },
- ];
- /** @nocollapse */
- MediaMatcher.ctorParameters = function () { return [
- { type: platform.Platform }
- ]; };
- /** @nocollapse */ MediaMatcher.ngInjectableDef = core.ɵɵdefineInjectable({ factory: function MediaMatcher_Factory() { return new MediaMatcher(core.ɵɵinject(platform.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 rxjs.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(coercion.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(coercion.coerceArray(value));
- /** @type {?} */
- var observables = queries.map((/**
- * @param {?} query
- * @return {?}
- */
- function (query) { return _this._registerQuery(query).observable; }));
- /** @type {?} */
- var stateObservable = rxjs.combineLatest(observables);
- // Emit the first state immediately, and then debounce the subsequent emissions.
- stateObservable = rxjs.concat(stateObservable.pipe(operators.take(1)), stateObservable.pipe(operators.skip(1), operators.debounceTime(0)));
- return stateObservable.pipe(operators.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 rxjs.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(operators.startWith(mql), operators.map((/**
- * @param {?} nextMql
- * @return {?}
- */
- function (nextMql) { return ({ query: query, matches: nextMql.matches }); })), operators.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: core.Injectable, args: [{ providedIn: 'root' },] },
- ];
- /** @nocollapse */
- BreakpointObserver.ctorParameters = function () { return [
- { type: MediaMatcher },
- { type: core.NgZone }
- ]; };
- /** @nocollapse */ BreakpointObserver.ngInjectableDef = core.ɵɵdefineInjectable({ factory: function BreakpointObserver_Factory() { return new BreakpointObserver(core.ɵɵinject(MediaMatcher), core.ɵɵinject(core.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)',
- };
- exports.LayoutModule = LayoutModule;
- exports.BreakpointObserver = BreakpointObserver;
- exports.Breakpoints = Breakpoints;
- exports.MediaMatcher = MediaMatcher;
- Object.defineProperty(exports, '__esModule', { value: true });
- })));
- //# sourceMappingURL=cdk-layout.umd.js.map
|