blob: 79ba742b0d3fffd2861fce584adeba8b85df31af [file] [log] [blame]
/**
* @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/common'), require('rxjs'), require('rxjs/operators')) :
typeof define === 'function' && define.amd ? define('@angular/flex-layout/core', ['exports', '@angular/core', '@angular/common', 'rxjs', 'rxjs/operators'], factory) :
(factory((global.ng = global.ng || {}, global.ng.flexLayout = global.ng.flexLayout || {}, global.ng.flexLayout.core = {}),global.ng.core,global.ng.common,global.rxjs,global.rxjs.operators));
}(this, (function (exports,core,common,rxjs,operators) { 'use strict';
/*! *****************************************************************************
Copyright (c) Microsoft Corporation.
Permission to use, copy, modify, and/or distribute this software for any
purpose with or without fee is hereby granted.
THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
PERFORMANCE OF THIS SOFTWARE.
***************************************************************************** */
/* global Reflect, Promise */
var extendStatics = function(d, b) {
extendStatics = Object.setPrototypeOf ||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
return extendStatics(d, b);
};
function __extends(d, b) {
extendStatics(d, b);
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
}
var __assign = function() {
__assign = Object.assign || function __assign(t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
}
return t;
};
return __assign.apply(this, arguments);
};
function __spreadArrays() {
for (var s = 0, i = 0, il = arguments.length; i < il; i++) s += arguments[i].length;
for (var r = Array(s), k = 0, i = 0; i < il; i++)
for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++)
r[k] = a[j];
return r;
}
/**
* @fileoverview added by tsickle
* Generated from: core/browser-provider.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* Find all of the server-generated stylings, if any, and remove them
* This will be in the form of inline classes and the style block in the
* head of the DOM
* @param {?} _document
* @param {?} platformId
* @return {?}
*/
function removeStyles(_document, platformId) {
return (/**
* @return {?}
*/
function () {
if (common.isPlatformBrowser(platformId)) {
/** @type {?} */
var elements = Array.from(_document.querySelectorAll("[class*=" + CLASS_NAME + "]"));
// RegExp constructor should only be used if passing a variable to the constructor.
// When using static regular expression it is more performant to use reg exp literal.
// This is also needed to provide Safari 9 compatibility, please see
// https://stackoverflow.com/questions/37919802 for more discussion.
/** @type {?} */
var classRegex_1 = /\bflex-layout-.+?\b/g;
elements.forEach((/**
* @param {?} el
* @return {?}
*/
function (el) {
el.classList.contains(CLASS_NAME + "ssr") && el.parentNode ?
el.parentNode.removeChild(el) : el.className.replace(classRegex_1, '');
}));
}
});
}
/**
* Provider to remove SSR styles on the browser
* @type {?}
*/
var BROWSER_PROVIDER = {
provide: (/** @type {?} */ (core.APP_BOOTSTRAP_LISTENER)),
useFactory: removeStyles,
deps: [common.DOCUMENT, core.PLATFORM_ID],
multi: true
};
/** @type {?} */
var CLASS_NAME = 'flex-layout-';
/**
* @fileoverview added by tsickle
* Generated from: core/module.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* *****************************************************************
* Define module for common Angular Layout utilities
* *****************************************************************
*/
var CoreModule = /** @class */ (function () {
function CoreModule() {
}
CoreModule.decorators = [
{ type: core.NgModule, args: [{
providers: [BROWSER_PROVIDER]
},] }
];
return CoreModule;
}());
/**
* @fileoverview added by tsickle
* Generated from: core/media-change.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* Class instances emitted [to observers] for each mql notification
*/
var /**
* Class instances emitted [to observers] for each mql notification
*/
MediaChange = /** @class */ (function () {
/**
* @param matches whether the mediaQuery is currently activated
* @param mediaQuery e.g. (min-width: 600px) and (max-width: 959px)
* @param mqAlias e.g. gt-sm, md, gt-lg
* @param suffix e.g. GtSM, Md, GtLg
* @param priority the priority of activation for the given breakpoint
*/
function MediaChange(matches, mediaQuery, mqAlias, suffix, priority) {
if (matches === void 0) { matches = false; }
if (mediaQuery === void 0) { mediaQuery = 'all'; }
if (mqAlias === void 0) { mqAlias = ''; }
if (suffix === void 0) { suffix = ''; }
if (priority === void 0) { priority = 0; }
this.matches = matches;
this.mediaQuery = mediaQuery;
this.mqAlias = mqAlias;
this.suffix = suffix;
this.priority = priority;
this.property = '';
}
/** Create an exact copy of the MediaChange */
/**
* Create an exact copy of the MediaChange
* @return {?}
*/
MediaChange.prototype.clone = /**
* Create an exact copy of the MediaChange
* @return {?}
*/
function () {
return new MediaChange(this.matches, this.mediaQuery, this.mqAlias, this.suffix);
};
return MediaChange;
}());
/**
* @fileoverview added by tsickle
* Generated from: core/stylesheet-map/stylesheet-map.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* Utility to emulate a CSS stylesheet
*
* This utility class stores all of the styles for a given HTML element
* as a readonly `stylesheet` map.
*/
var StylesheetMap = /** @class */ (function () {
function StylesheetMap() {
this.stylesheet = new Map();
}
/**
* Add an individual style to an HTML element
*/
/**
* Add an individual style to an HTML element
* @param {?} element
* @param {?} style
* @param {?} value
* @return {?}
*/
StylesheetMap.prototype.addStyleToElement = /**
* Add an individual style to an HTML element
* @param {?} element
* @param {?} style
* @param {?} value
* @return {?}
*/
function (element, style, value) {
/** @type {?} */
var stylesheet = this.stylesheet.get(element);
if (stylesheet) {
stylesheet.set(style, value);
}
else {
this.stylesheet.set(element, new Map([[style, value]]));
}
};
/**
* Clear the virtual stylesheet
*/
/**
* Clear the virtual stylesheet
* @return {?}
*/
StylesheetMap.prototype.clearStyles = /**
* Clear the virtual stylesheet
* @return {?}
*/
function () {
this.stylesheet.clear();
};
/**
* Retrieve a given style for an HTML element
*/
/**
* Retrieve a given style for an HTML element
* @param {?} el
* @param {?} styleName
* @return {?}
*/
StylesheetMap.prototype.getStyleForElement = /**
* Retrieve a given style for an HTML element
* @param {?} el
* @param {?} styleName
* @return {?}
*/
function (el, styleName) {
/** @type {?} */
var styles = this.stylesheet.get(el);
/** @type {?} */
var value = '';
if (styles) {
/** @type {?} */
var style = styles.get(styleName);
if (typeof style === 'number' || typeof style === 'string') {
value = style + '';
}
}
return value;
};
/** @nocollapse */ StylesheetMapprov = core.ɵɵdefineInjectable({ factory: function StylesheetMap_Factory() { return new StylesheetMap(); }, token: StylesheetMap, providedIn: "root" });
StylesheetMap.decorators = [
{ type: core.Injectable, args: [{ providedIn: 'root' },] }
];
return StylesheetMap;
}());
/**
* @fileoverview added by tsickle
* Generated from: core/stylesheet-map/index.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* @fileoverview added by tsickle
* Generated from: core/tokens/library-config.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/** @type {?} */
var DEFAULT_CONFIG = {
addFlexToParent: true,
addOrientationBps: false,
disableDefaultBps: false,
disableVendorPrefixes: false,
serverLoaded: false,
useColumnBasisZero: true,
printWithBreakpoints: [],
mediaTriggerAutoRestore: true,
ssrObserveBreakpoints: [],
};
/** @type {?} */
var LAYOUT_CONFIG = new core.InjectionToken('Flex Layout token, config options for the library', {
providedIn: 'root',
factory: (/**
* @return {?}
*/
function () { return DEFAULT_CONFIG; })
});
/**
* @fileoverview added by tsickle
* Generated from: core/tokens/server-token.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* Token that is provided to tell whether the FlexLayoutServerModule
* has been included in the bundle
*
* NOTE: This can be manually provided to disable styles when using SSR
* @type {?}
*/
var SERVER_TOKEN = new core.InjectionToken('FlexLayoutServerLoaded', {
providedIn: 'root',
factory: (/**
* @return {?}
*/
function () { return false; })
});
/**
* @fileoverview added by tsickle
* Generated from: core/tokens/breakpoint-token.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/** @type {?} */
var BREAKPOINT = new core.InjectionToken('Flex Layout token, collect all breakpoints into one provider', {
providedIn: 'root',
factory: (/**
* @return {?}
*/
function () { return null; })
});
/**
* @fileoverview added by tsickle
* Generated from: core/tokens/index.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* @fileoverview added by tsickle
* Generated from: core/add-alias.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* For the specified MediaChange, make sure it contains the breakpoint alias
* and suffix (if available).
* @param {?} dest
* @param {?} source
* @return {?}
*/
function mergeAlias(dest, source) {
dest = dest ? dest.clone() : new MediaChange();
if (source) {
dest.mqAlias = source.alias;
dest.mediaQuery = source.mediaQuery;
dest.suffix = (/** @type {?} */ (source.suffix));
dest.priority = (/** @type {?} */ (source.priority));
}
return dest;
}
/**
* @fileoverview added by tsickle
* Generated from: utils/layout-validator.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* @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 INLINE = 'inline';
/** @type {?} */
var LAYOUT_VALUES = ['row', 'column', 'row-reverse', 'column-reverse'];
/**
* Validate the direction|'direction wrap' value and then update the host's inline flexbox styles
* @param {?} value
* @return {?}
*/
function buildLayoutCSS(value) {
var _a = validateValue(value), direction = _a[0], wrap = _a[1], isInline = _a[2];
return buildCSS(direction, wrap, isInline);
}
/**
* Validate the value to be one of the acceptable value options
* Use default fallback of 'row'
* @param {?} value
* @return {?}
*/
function validateValue(value) {
value = value ? value.toLowerCase() : '';
var _a = value.split(' '), direction = _a[0], wrap = _a[1], inline = _a[2];
// First value must be the `flex-direction`
if (!LAYOUT_VALUES.find((/**
* @param {?} x
* @return {?}
*/
function (x) { return x === direction; }))) {
direction = LAYOUT_VALUES[0];
}
if (wrap === INLINE) {
wrap = (inline !== INLINE) ? inline : '';
inline = INLINE;
}
return [direction, validateWrapValue(wrap), !!inline];
}
/**
* Convert layout-wrap='<value>' to expected flex-wrap style
* @param {?} value
* @return {?}
*/
function validateWrapValue(value) {
if (!!value) {
switch (value.toLowerCase()) {
case 'reverse':
case 'wrap-reverse':
case 'reverse-wrap':
value = 'wrap-reverse';
break;
case 'no':
case 'none':
case 'nowrap':
value = 'nowrap';
break;
// All other values fallback to 'wrap'
default:
value = 'wrap';
break;
}
}
return value;
}
/**
* Build the CSS that should be assigned to the element instance
* BUG:
* 1) min-height on a column flex container won’t apply to its flex item children in IE 10-11.
* Use height instead if possible; height : <xxx>vh;
*
* This way any padding or border specified on the child elements are
* laid out and drawn inside that element's specified width and height.
* @param {?} direction
* @param {?=} wrap
* @param {?=} inline
* @return {?}
*/
function buildCSS(direction, wrap, inline) {
if (wrap === void 0) { wrap = null; }
if (inline === void 0) { inline = false; }
return {
'display': inline ? 'inline-flex' : 'flex',
'box-sizing': 'border-box',
'flex-direction': direction,
'flex-wrap': !!wrap ? wrap : null
};
}
/**
* @fileoverview added by tsickle
* Generated from: core/base/base2.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* @abstract
*/
var /**
* @abstract
*/
BaseDirective2 = /** @class */ (function () {
function BaseDirective2(elementRef, styleBuilder, styler, marshal) {
this.elementRef = elementRef;
this.styleBuilder = styleBuilder;
this.styler = styler;
this.marshal = marshal;
this.DIRECTIVE_KEY = '';
this.inputs = [];
/**
* The most recently used styles for the builder
*/
this.mru = {};
this.destroySubject = new rxjs.Subject();
/**
* Cache map for style computation
*/
this.styleCache = new Map();
}
Object.defineProperty(BaseDirective2.prototype, "parentElement", {
/** Access to host element's parent DOM node */
get: /**
* Access to host element's parent DOM node
* @protected
* @return {?}
*/
function () {
return this.elementRef.nativeElement.parentElement;
},
enumerable: false,
configurable: true
});
Object.defineProperty(BaseDirective2.prototype, "nativeElement", {
/** Access to the HTMLElement for the directive */
get: /**
* Access to the HTMLElement for the directive
* @protected
* @return {?}
*/
function () {
return this.elementRef.nativeElement;
},
enumerable: false,
configurable: true
});
Object.defineProperty(BaseDirective2.prototype, "activatedValue", {
/** Access to the activated value for the directive */
get: /**
* Access to the activated value for the directive
* @return {?}
*/
function () {
return this.marshal.getValue(this.nativeElement, this.DIRECTIVE_KEY);
},
set: /**
* @param {?} value
* @return {?}
*/
function (value) {
this.marshal.setValue(this.nativeElement, this.DIRECTIVE_KEY, value, this.marshal.activatedAlias);
},
enumerable: false,
configurable: true
});
/** For @Input changes */
/**
* For \@Input changes
* @param {?} changes
* @return {?}
*/
BaseDirective2.prototype.ngOnChanges = /**
* For \@Input changes
* @param {?} changes
* @return {?}
*/
function (changes) {
var _this = this;
Object.keys(changes).forEach((/**
* @param {?} key
* @return {?}
*/
function (key) {
if (_this.inputs.indexOf(key) !== -1) {
/** @type {?} */
var bp = key.split('.').slice(1).join('.');
/** @type {?} */
var val = changes[key].currentValue;
_this.setValue(val, bp);
}
}));
};
/**
* @return {?}
*/
BaseDirective2.prototype.ngOnDestroy = /**
* @return {?}
*/
function () {
this.destroySubject.next();
this.destroySubject.complete();
this.marshal.releaseElement(this.nativeElement);
};
/** Register with central marshaller service */
/**
* Register with central marshaller service
* @protected
* @param {?=} extraTriggers
* @return {?}
*/
BaseDirective2.prototype.init = /**
* Register with central marshaller service
* @protected
* @param {?=} extraTriggers
* @return {?}
*/
function (extraTriggers) {
if (extraTriggers === void 0) { extraTriggers = []; }
this.marshal.init(this.elementRef.nativeElement, this.DIRECTIVE_KEY, this.updateWithValue.bind(this), this.clearStyles.bind(this), extraTriggers);
};
/** Add styles to the element using predefined style builder */
/**
* Add styles to the element using predefined style builder
* @protected
* @param {?} input
* @param {?=} parent
* @return {?}
*/
BaseDirective2.prototype.addStyles = /**
* Add styles to the element using predefined style builder
* @protected
* @param {?} input
* @param {?=} parent
* @return {?}
*/
function (input, parent) {
/** @type {?} */
var builder = this.styleBuilder;
/** @type {?} */
var useCache = builder.shouldCache;
/** @type {?} */
var genStyles = this.styleCache.get(input);
if (!genStyles || !useCache) {
genStyles = builder.buildStyles(input, parent);
if (useCache) {
this.styleCache.set(input, genStyles);
}
}
this.mru = __assign({}, genStyles);
this.applyStyleToElement(genStyles);
builder.sideEffect(input, genStyles, parent);
};
/** Remove generated styles from an element using predefined style builder */
/**
* Remove generated styles from an element using predefined style builder
* @protected
* @return {?}
*/
BaseDirective2.prototype.clearStyles = /**
* Remove generated styles from an element using predefined style builder
* @protected
* @return {?}
*/
function () {
var _this = this;
Object.keys(this.mru).forEach((/**
* @param {?} k
* @return {?}
*/
function (k) {
_this.mru[k] = '';
}));
this.applyStyleToElement(this.mru);
this.mru = {};
};
/** Force trigger style updates on DOM element */
/**
* Force trigger style updates on DOM element
* @protected
* @return {?}
*/
BaseDirective2.prototype.triggerUpdate = /**
* Force trigger style updates on DOM element
* @protected
* @return {?}
*/
function () {
this.marshal.triggerUpdate(this.nativeElement, this.DIRECTIVE_KEY);
};
/**
* Determine the DOM element's Flexbox flow (flex-direction).
*
* Check inline style first then check computed (stylesheet) style.
* And optionally add the flow value to element's inline style.
*/
/**
* Determine the DOM element's Flexbox flow (flex-direction).
*
* Check inline style first then check computed (stylesheet) style.
* And optionally add the flow value to element's inline style.
* @protected
* @param {?} target
* @param {?=} addIfMissing
* @return {?}
*/
BaseDirective2.prototype.getFlexFlowDirection = /**
* Determine the DOM element's Flexbox flow (flex-direction).
*
* Check inline style first then check computed (stylesheet) style.
* And optionally add the flow value to element's inline style.
* @protected
* @param {?} target
* @param {?=} addIfMissing
* @return {?}
*/
function (target, addIfMissing) {
if (addIfMissing === void 0) { addIfMissing = false; }
if (target) {
var _a = this.styler.getFlowDirection(target), value = _a[0], hasInlineValue = _a[1];
if (!hasInlineValue && addIfMissing) {
/** @type {?} */
var style = buildLayoutCSS(value);
/** @type {?} */
var elements = [target];
this.styler.applyStyleToElements(style, elements);
}
return value.trim();
}
return 'row';
};
/**
* @protected
* @param {?} target
* @return {?}
*/
BaseDirective2.prototype.hasWrap = /**
* @protected
* @param {?} target
* @return {?}
*/
function (target) {
return this.styler.hasWrap(target);
};
/** Applies styles given via string pair or object map to the directive element */
/**
* Applies styles given via string pair or object map to the directive element
* @protected
* @param {?} style
* @param {?=} value
* @param {?=} element
* @return {?}
*/
BaseDirective2.prototype.applyStyleToElement = /**
* Applies styles given via string pair or object map to the directive element
* @protected
* @param {?} style
* @param {?=} value
* @param {?=} element
* @return {?}
*/
function (style, value, element) {
if (element === void 0) { element = this.nativeElement; }
this.styler.applyStyleToElement(element, style, value);
};
/**
* @protected
* @param {?} val
* @param {?} bp
* @return {?}
*/
BaseDirective2.prototype.setValue = /**
* @protected
* @param {?} val
* @param {?} bp
* @return {?}
*/
function (val, bp) {
this.marshal.setValue(this.nativeElement, this.DIRECTIVE_KEY, val, bp);
};
/**
* @protected
* @param {?} input
* @return {?}
*/
BaseDirective2.prototype.updateWithValue = /**
* @protected
* @param {?} input
* @return {?}
*/
function (input) {
if (this.currentValue !== input) {
this.addStyles(input);
this.currentValue = input;
}
};
return BaseDirective2;
}());
/**
* @fileoverview added by tsickle
* Generated from: core/base/index.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* @fileoverview added by tsickle
* Generated from: core/breakpoints/data/break-points.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* NOTE: Smaller ranges have HIGHER priority since the match is more specific
* @type {?}
*/
var DEFAULT_BREAKPOINTS = [
{
alias: 'xs',
mediaQuery: 'screen and (min-width: 0px) and (max-width: 599.98px)',
priority: 1000,
},
{
alias: 'sm',
mediaQuery: 'screen and (min-width: 600px) and (max-width: 959.98px)',
priority: 900,
},
{
alias: 'md',
mediaQuery: 'screen and (min-width: 960px) and (max-width: 1279.98px)',
priority: 800,
},
{
alias: 'lg',
mediaQuery: 'screen and (min-width: 1280px) and (max-width: 1919.98px)',
priority: 700,
},
{
alias: 'xl',
mediaQuery: 'screen and (min-width: 1920px) and (max-width: 4999.98px)',
priority: 600,
},
{
alias: 'lt-sm',
overlapping: true,
mediaQuery: 'screen and (max-width: 599.98px)',
priority: 950,
},
{
alias: 'lt-md',
overlapping: true,
mediaQuery: 'screen and (max-width: 959.98px)',
priority: 850,
},
{
alias: 'lt-lg',
overlapping: true,
mediaQuery: 'screen and (max-width: 1279.98px)',
priority: 750,
},
{
alias: 'lt-xl',
overlapping: true,
priority: 650,
mediaQuery: 'screen and (max-width: 1919.98px)',
},
{
alias: 'gt-xs',
overlapping: true,
mediaQuery: 'screen and (min-width: 600px)',
priority: -950,
},
{
alias: 'gt-sm',
overlapping: true,
mediaQuery: 'screen and (min-width: 960px)',
priority: -850,
}, {
alias: 'gt-md',
overlapping: true,
mediaQuery: 'screen and (min-width: 1280px)',
priority: -750,
},
{
alias: 'gt-lg',
overlapping: true,
mediaQuery: 'screen and (min-width: 1920px)',
priority: -650,
}
];
/**
* @fileoverview added by tsickle
* Generated from: core/breakpoints/data/orientation-break-points.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/* tslint:disable */
/** @type {?} */
var HANDSET_PORTRAIT = '(orientation: portrait) and (max-width: 599.98px)';
/** @type {?} */
var HANDSET_LANDSCAPE = '(orientation: landscape) and (max-width: 959.98px)';
/** @type {?} */
var TABLET_PORTRAIT = '(orientation: portrait) and (min-width: 600px) and (max-width: 839.98px)';
/** @type {?} */
var TABLET_LANDSCAPE = '(orientation: landscape) and (min-width: 960px) and (max-width: 1279.98px)';
/** @type {?} */
var WEB_PORTRAIT = '(orientation: portrait) and (min-width: 840px)';
/** @type {?} */
var WEB_LANDSCAPE = '(orientation: landscape) and (min-width: 1280px)';
/** @type {?} */
var ScreenTypes = {
'HANDSET': HANDSET_PORTRAIT + ", " + HANDSET_LANDSCAPE,
'TABLET': TABLET_PORTRAIT + " , " + TABLET_LANDSCAPE,
'WEB': WEB_PORTRAIT + ", " + WEB_LANDSCAPE + " ",
'HANDSET_PORTRAIT': "" + HANDSET_PORTRAIT,
'TABLET_PORTRAIT': TABLET_PORTRAIT + " ",
'WEB_PORTRAIT': "" + WEB_PORTRAIT,
'HANDSET_LANDSCAPE': "" + HANDSET_LANDSCAPE,
'TABLET_LANDSCAPE': "" + TABLET_LANDSCAPE,
'WEB_LANDSCAPE': "" + WEB_LANDSCAPE
};
/**
* Extended Breakpoints for handset/tablets with landscape or portrait orientations
* @type {?}
*/
var ORIENTATION_BREAKPOINTS = [
{ 'alias': 'handset', priority: 2000, 'mediaQuery': ScreenTypes.HANDSET },
{ 'alias': 'handset.landscape', priority: 2000, 'mediaQuery': ScreenTypes.HANDSET_LANDSCAPE },
{ 'alias': 'handset.portrait', priority: 2000, 'mediaQuery': ScreenTypes.HANDSET_PORTRAIT },
{ 'alias': 'tablet', priority: 2100, 'mediaQuery': ScreenTypes.TABLET },
{ 'alias': 'tablet.landscape', priority: 2100, 'mediaQuery': ScreenTypes.TABLET_LANDSCAPE },
{ 'alias': 'tablet.portrait', priority: 2100, 'mediaQuery': ScreenTypes.TABLET_PORTRAIT },
{ 'alias': 'web', priority: 2200, 'mediaQuery': ScreenTypes.WEB, overlapping: true },
{ 'alias': 'web.landscape', priority: 2200, 'mediaQuery': ScreenTypes.WEB_LANDSCAPE, overlapping: true },
{ 'alias': 'web.portrait', priority: 2200, 'mediaQuery': ScreenTypes.WEB_PORTRAIT, overlapping: true }
];
/**
* @fileoverview added by tsickle
* Generated from: core/breakpoints/break-point.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* @fileoverview added by tsickle
* Generated from: utils/object-extend.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* Extends an object with the *enumerable* and *own* properties of one or more source objects,
* similar to Object.assign.
*
* @param {?} dest The object which will have properties copied to it.
* @param {...?} sources The source objects from which properties will be copied.
* @return {?}
*/
function extendObject(dest) {
var sources = [];
for (var _i = 1; _i < arguments.length; _i++) {
sources[_i - 1] = arguments[_i];
}
if (dest == null) {
throw TypeError('Cannot convert undefined or null to object');
}
for (var _a = 0, sources_1 = sources; _a < sources_1.length; _a++) {
var source = sources_1[_a];
if (source != null) {
for (var key in source) {
if (source.hasOwnProperty(key)) {
dest[key] = source[key];
}
}
}
}
return dest;
}
/**
* @fileoverview added by tsickle
* Generated from: core/breakpoints/breakpoint-tools.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/** @type {?} */
var ALIAS_DELIMITERS = /(\.|-|_)/g;
/**
* @param {?} part
* @return {?}
*/
function firstUpperCase(part) {
/** @type {?} */
var first = part.length > 0 ? part.charAt(0) : '';
/** @type {?} */
var remainder = (part.length > 1) ? part.slice(1) : '';
return first.toUpperCase() + remainder;
}
/**
* Converts snake-case to SnakeCase.
* @param {?} name Text to UpperCamelCase
* @return {?}
*/
function camelCase(name) {
return name
.replace(ALIAS_DELIMITERS, '|')
.split('|')
.map(firstUpperCase)
.join('');
}
/**
* For each breakpoint, ensure that a Suffix is defined;
* fallback to UpperCamelCase the unique Alias value
* @param {?} list
* @return {?}
*/
function validateSuffixes(list) {
list.forEach((/**
* @param {?} bp
* @return {?}
*/
function (bp) {
if (!bp.suffix) {
bp.suffix = camelCase(bp.alias); // create Suffix value based on alias
bp.overlapping = !!bp.overlapping; // ensure default value
}
}));
return list;
}
/**
* Merge a custom breakpoint list with the default list based on unique alias values
* - Items are added if the alias is not in the default list
* - Items are merged with the custom override if the alias exists in the default list
* @param {?} defaults
* @param {?=} custom
* @return {?}
*/
function mergeByAlias(defaults, custom) {
if (custom === void 0) { custom = []; }
/** @type {?} */
var dict = {};
defaults.forEach((/**
* @param {?} bp
* @return {?}
*/
function (bp) {
dict[bp.alias] = bp;
}));
// Merge custom breakpoints
custom.forEach((/**
* @param {?} bp
* @return {?}
*/
function (bp) {
if (dict[bp.alias]) {
extendObject(dict[bp.alias], bp);
}
else {
dict[bp.alias] = bp;
}
}));
return validateSuffixes(Object.keys(dict).map((/**
* @param {?} k
* @return {?}
*/
function (k) { return dict[k]; })));
}
/**
* @fileoverview added by tsickle
* Generated from: core/breakpoints/break-points-token.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* Injection token unique to the flex-layout library.
* Use this token when build a custom provider (see below).
* @type {?}
*/
var BREAKPOINTS = new core.InjectionToken('Token (@angular/flex-layout) Breakpoints', {
providedIn: 'root',
factory: (/**
* @return {?}
*/
function () {
/** @type {?} */
var breakpoints = core.inject(BREAKPOINT);
/** @type {?} */
var layoutConfig = core.inject(LAYOUT_CONFIG);
/** @type {?} */
var bpFlattenArray = [].concat.apply([], (breakpoints || [])
.map((/**
* @param {?} v
* @return {?}
*/
function (v) { return Array.isArray(v) ? v : [v]; })));
/** @type {?} */
var builtIns = (layoutConfig.disableDefaultBps ? [] : DEFAULT_BREAKPOINTS)
.concat(layoutConfig.addOrientationBps ? ORIENTATION_BREAKPOINTS : []);
return mergeByAlias(builtIns, bpFlattenArray);
})
});
/**
* @fileoverview added by tsickle
* Generated from: core/utils/sort.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* HOF to sort the breakpoints by descending priority
* @template T
* @param {?} a
* @param {?} b
* @return {?}
*/
function sortDescendingPriority(a, b) {
/** @type {?} */
var priorityA = a ? a.priority || 0 : 0;
/** @type {?} */
var priorityB = b ? b.priority || 0 : 0;
return priorityB - priorityA;
}
/**
* HOF to sort the breakpoints by ascending priority
* @template T
* @param {?} a
* @param {?} b
* @return {?}
*/
function sortAscendingPriority(a, b) {
/** @type {?} */
var pA = a.priority || 0;
/** @type {?} */
var pB = b.priority || 0;
return pA - pB;
}
/**
* @fileoverview added by tsickle
* Generated from: core/breakpoints/break-point-registry.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* Registry of 1..n MediaQuery breakpoint ranges
* This is published as a provider and may be overridden from custom, application-specific ranges
*
*/
var BreakPointRegistry = /** @class */ (function () {
function BreakPointRegistry(list) {
/**
* Memoized BreakPoint Lookups
*/
this.findByMap = new Map();
this.items = __spreadArrays(list).sort(sortAscendingPriority);
}
/**
* Search breakpoints by alias (e.g. gt-xs)
*/
/**
* Search breakpoints by alias (e.g. gt-xs)
* @param {?} alias
* @return {?}
*/
BreakPointRegistry.prototype.findByAlias = /**
* Search breakpoints by alias (e.g. gt-xs)
* @param {?} alias
* @return {?}
*/
function (alias) {
return !alias ? null : this.findWithPredicate(alias, (/**
* @param {?} bp
* @return {?}
*/
function (bp) { return bp.alias == alias; }));
};
/**
* @param {?} query
* @return {?}
*/
BreakPointRegistry.prototype.findByQuery = /**
* @param {?} query
* @return {?}
*/
function (query) {
return this.findWithPredicate(query, (/**
* @param {?} bp
* @return {?}
*/
function (bp) { return bp.mediaQuery == query; }));
};
Object.defineProperty(BreakPointRegistry.prototype, "overlappings", {
/**
* Get all the breakpoints whose ranges could overlapping `normal` ranges;
* e.g. gt-sm overlaps md, lg, and xl
*/
get: /**
* Get all the breakpoints whose ranges could overlapping `normal` ranges;
* e.g. gt-sm overlaps md, lg, and xl
* @return {?}
*/
function () {
return this.items.filter((/**
* @param {?} it
* @return {?}
*/
function (it) { return it.overlapping == true; }));
},
enumerable: false,
configurable: true
});
Object.defineProperty(BreakPointRegistry.prototype, "aliases", {
/**
* Get list of all registered (non-empty) breakpoint aliases
*/
get: /**
* Get list of all registered (non-empty) breakpoint aliases
* @return {?}
*/
function () {
return this.items.map((/**
* @param {?} it
* @return {?}
*/
function (it) { return it.alias; }));
},
enumerable: false,
configurable: true
});
Object.defineProperty(BreakPointRegistry.prototype, "suffixes", {
/**
* Aliases are mapped to properties using suffixes
* e.g. 'gt-sm' for property 'layout' uses suffix 'GtSm'
* for property layoutGtSM.
*/
get: /**
* Aliases are mapped to properties using suffixes
* e.g. 'gt-sm' for property 'layout' uses suffix 'GtSm'
* for property layoutGtSM.
* @return {?}
*/
function () {
return this.items.map((/**
* @param {?} it
* @return {?}
*/
function (it) { return !!it.suffix ? it.suffix : ''; }));
},
enumerable: false,
configurable: true
});
/**
* Memoized lookup using custom predicate function
*/
/**
* Memoized lookup using custom predicate function
* @private
* @param {?} key
* @param {?} searchFn
* @return {?}
*/
BreakPointRegistry.prototype.findWithPredicate = /**
* Memoized lookup using custom predicate function
* @private
* @param {?} key
* @param {?} searchFn
* @return {?}
*/
function (key, searchFn) {
/** @type {?} */
var response = this.findByMap.get(key);
if (!response) {
response = this.items.find(searchFn) || null;
this.findByMap.set(key, response);
}
return response || null;
};
/** @nocollapse */ BreakPointRegistryprov = core.ɵɵdefineInjectable({ factory: function BreakPointRegistry_Factory() { return new BreakPointRegistry(core.ɵɵinject(BREAKPOINTS)); }, token: BreakPointRegistry, providedIn: "root" });
BreakPointRegistry.decorators = [
{ type: core.Injectable, args: [{ providedIn: 'root' },] }
];
/** @nocollapse */
BreakPointRegistry.ctorParameters = function () { return [
{ type: Array, decorators: [{ type: core.Inject, args: [BREAKPOINTS,] }] }
]; };
return BreakPointRegistry;
}());
/**
* @fileoverview added by tsickle
* Generated from: core/breakpoints/index.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* @fileoverview added by tsickle
* Generated from: core/match-media/match-media.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* MediaMonitor configures listeners to mediaQuery changes and publishes an Observable facade to
* convert mediaQuery change callbacks to subscriber notifications. These notifications will be
* performed within the ng Zone to trigger change detections and component updates.
*
* NOTE: both mediaQuery activations and de-activations are announced in notifications
*/
var MatchMedia = /** @class */ (function () {
function MatchMedia(_zone, _platformId, _document) {
this._zone = _zone;
this._platformId = _platformId;
this._document = _document;
/**
* Initialize source with 'all' so all non-responsive APIs trigger style updates
*/
this.source = new rxjs.BehaviorSubject(new MediaChange(true));
this.registry = new Map();
this.pendingRemoveListenerFns = [];
this._observable$ = this.source.asObservable();
}
Object.defineProperty(MatchMedia.prototype, "activations", {
/**
* Publish list of all current activations
*/
get: /**
* Publish list of all current activations
* @return {?}
*/
function () {
/** @type {?} */
var results = [];
this.registry.forEach((/**
* @param {?} mql
* @param {?} key
* @return {?}
*/
function (mql, key) {
if (mql.matches) {
results.push(key);
}
}));
return results;
},
enumerable: false,
configurable: true
});
/**
* For the specified mediaQuery?
*/
/**
* For the specified mediaQuery?
* @param {?} mediaQuery
* @return {?}
*/
MatchMedia.prototype.isActive = /**
* For the specified mediaQuery?
* @param {?} mediaQuery
* @return {?}
*/
function (mediaQuery) {
/** @type {?} */
var mql = this.registry.get(mediaQuery);
return !!mql ? mql.matches : this.registerQuery(mediaQuery).some((/**
* @param {?} m
* @return {?}
*/
function (m) { return m.matches; }));
};
/**
* External observers can watch for all (or a specific) mql changes.
* Typically used by the MediaQueryAdaptor; optionally available to components
* who wish to use the MediaMonitor as mediaMonitor$ observable service.
*
* Use deferred registration process to register breakpoints only on subscription
* This logic also enforces logic to register all mediaQueries BEFORE notify
* subscribers of notifications.
*/
/**
* External observers can watch for all (or a specific) mql changes.
* Typically used by the MediaQueryAdaptor; optionally available to components
* who wish to use the MediaMonitor as mediaMonitor$ observable service.
*
* Use deferred registration process to register breakpoints only on subscription
* This logic also enforces logic to register all mediaQueries BEFORE notify
* subscribers of notifications.
* @param {?=} mqList
* @param {?=} filterOthers
* @return {?}
*/
MatchMedia.prototype.observe = /**
* External observers can watch for all (or a specific) mql changes.
* Typically used by the MediaQueryAdaptor; optionally available to components
* who wish to use the MediaMonitor as mediaMonitor$ observable service.
*
* Use deferred registration process to register breakpoints only on subscription
* This logic also enforces logic to register all mediaQueries BEFORE notify
* subscribers of notifications.
* @param {?=} mqList
* @param {?=} filterOthers
* @return {?}
*/
function (mqList, filterOthers) {
var _this = this;
if (filterOthers === void 0) { filterOthers = false; }
if (mqList && mqList.length) {
/** @type {?} */
var matchMedia$ = this._observable$.pipe(operators.filter((/**
* @param {?} change
* @return {?}
*/
function (change) {
return !filterOthers ? true : (mqList.indexOf(change.mediaQuery) > -1);
})));
/** @type {?} */
var registration$ = new rxjs.Observable((/**
* @param {?} observer
* @return {?}
*/
function (observer) {
// tslint:disable-line:max-line-length
/** @type {?} */
var matches = _this.registerQuery(mqList);
if (matches.length) {
/** @type {?} */
var lastChange = (/** @type {?} */ (matches.pop()));
matches.forEach((/**
* @param {?} e
* @return {?}
*/
function (e) {
observer.next(e);
}));
_this.source.next(lastChange); // last match is cached
}
observer.complete();
}));
return rxjs.merge(registration$, matchMedia$);
}
return this._observable$;
};
/**
* Based on the BreakPointRegistry provider, register internal listeners for each unique
* mediaQuery. Each listener emits specific MediaChange data to observers
*/
/**
* Based on the BreakPointRegistry provider, register internal listeners for each unique
* mediaQuery. Each listener emits specific MediaChange data to observers
* @param {?} mediaQuery
* @return {?}
*/
MatchMedia.prototype.registerQuery = /**
* Based on the BreakPointRegistry provider, register internal listeners for each unique
* mediaQuery. Each listener emits specific MediaChange data to observers
* @param {?} mediaQuery
* @return {?}
*/
function (mediaQuery) {
var _this = this;
/** @type {?} */
var list = Array.isArray(mediaQuery) ? mediaQuery : [mediaQuery];
/** @type {?} */
var matches = [];
buildQueryCss(list, this._document);
list.forEach((/**
* @param {?} query
* @return {?}
*/
function (query) {
/** @type {?} */
var onMQLEvent = (/**
* @param {?} e
* @return {?}
*/
function (e) {
_this._zone.run((/**
* @return {?}
*/
function () { return _this.source.next(new MediaChange(e.matches, query)); }));
});
/** @type {?} */
var mql = _this.registry.get(query);
if (!mql) {
mql = _this.buildMQL(query);
mql.addListener(onMQLEvent);
_this.pendingRemoveListenerFns.push((/**
* @return {?}
*/
function () { return (/** @type {?} */ (mql)).removeListener(onMQLEvent); }));
_this.registry.set(query, mql);
}
if (mql.matches) {
matches.push(new MediaChange(true, query));
}
}));
return matches;
};
/**
* @return {?}
*/
MatchMedia.prototype.ngOnDestroy = /**
* @return {?}
*/
function () {
/** @type {?} */
var fn;
while (fn = this.pendingRemoveListenerFns.pop()) {
fn();
}
};
/**
* Call window.matchMedia() to build a MediaQueryList; which
* supports 0..n listeners for activation/deactivation
*/
/**
* Call window.matchMedia() to build a MediaQueryList; which
* supports 0..n listeners for activation/deactivation
* @protected
* @param {?} query
* @return {?}
*/
MatchMedia.prototype.buildMQL = /**
* Call window.matchMedia() to build a MediaQueryList; which
* supports 0..n listeners for activation/deactivation
* @protected
* @param {?} query
* @return {?}
*/
function (query) {
return constructMql(query, common.isPlatformBrowser(this._platformId));
};
/** @nocollapse */ MatchMediaprov = core.ɵɵdefineInjectable({ factory: function MatchMedia_Factory() { return new MatchMedia(core.ɵɵinject(core.NgZone), core.ɵɵinject(core.PLATFORM_ID), core.ɵɵinject(common.DOCUMENT)); }, token: MatchMedia, providedIn: "root" });
MatchMedia.decorators = [
{ type: core.Injectable, args: [{ providedIn: 'root' },] }
];
/** @nocollapse */
MatchMedia.ctorParameters = function () { return [
{ type: core.NgZone },
{ type: Object, decorators: [{ type: core.Inject, args: [core.PLATFORM_ID,] }] },
{ type: undefined, decorators: [{ type: core.Inject, args: [common.DOCUMENT,] }] }
]; };
return MatchMedia;
}());
/**
* Private global registry for all dynamically-created, injected style tags
* @see prepare(query)
* @type {?}
*/
var ALL_STYLES = {};
/**
* For Webkit engines that only trigger the MediaQueryList Listener
* when there is at least one CSS selector for the respective media query.
*
* @param {?} mediaQueries
* @param {?} _document
* @return {?}
*/
function buildQueryCss(mediaQueries, _document) {
/** @type {?} */
var list = mediaQueries.filter((/**
* @param {?} it
* @return {?}
*/
function (it) { return !ALL_STYLES[it]; }));
if (list.length > 0) {
/** @type {?} */
var query = list.join(', ');
try {
/** @type {?} */
var styleEl_1 = _document.createElement('style');
styleEl_1.setAttribute('type', 'text/css');
if (!((/** @type {?} */ (styleEl_1))).styleSheet) {
/** @type {?} */
var 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";
styleEl_1.appendChild(_document.createTextNode(cssText));
}
(/** @type {?} */ (_document.head)).appendChild(styleEl_1);
// Store in private global registry
list.forEach((/**
* @param {?} mq
* @return {?}
*/
function (mq) { return ALL_STYLES[mq] = styleEl_1; }));
}
catch (e) {
console.error(e);
}
}
}
/**
* @param {?} query
* @param {?} isBrowser
* @return {?}
*/
function constructMql(query, isBrowser) {
/** @type {?} */
var canListen = isBrowser && !!((/** @type {?} */ (window))).matchMedia('all').addListener;
return canListen ? ((/** @type {?} */ (window))).matchMedia(query) : (/** @type {?} */ ({
matches: query === 'all' || query === '',
media: query,
addListener: (/**
* @return {?}
*/
function () {
}),
removeListener: (/**
* @return {?}
*/
function () {
}),
onchange: null,
addEventListener: /**
* @return {?}
*/
function () {
},
removeEventListener: /**
* @return {?}
*/
function () {
},
dispatchEvent: /**
* @return {?}
*/
function () {
return false;
}
}));
}
/**
* @fileoverview added by tsickle
* Generated from: core/match-media/mock/mock-match-media.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* MockMatchMedia mocks calls to the Window API matchMedia with a build of a simulated
* MockMediaQueryListener. Methods are available to simulate an activation of a mediaQuery
* range and to clearAll mediaQuery listeners.
*/
var MockMatchMedia = /** @class */ (function (_super) {
__extends(MockMatchMedia, _super);
function MockMatchMedia(_zone, _platformId, _document, _breakpoints) {
var _this = _super.call(this, _zone, _platformId, _document) || this;
_this._breakpoints = _breakpoints;
_this.autoRegisterQueries = true; // Used for testing BreakPoint registrations
// Used for testing BreakPoint registrations
_this.useOverlaps = false; // Allow fallback to overlapping mediaQueries
return _this;
}
/** Easy method to clear all listeners for all mediaQueries */
/**
* Easy method to clear all listeners for all mediaQueries
* @return {?}
*/
MockMatchMedia.prototype.clearAll = /**
* Easy method to clear all listeners for all mediaQueries
* @return {?}
*/
function () {
this.registry.forEach((/**
* @param {?} mql
* @return {?}
*/
function (mql) {
((/** @type {?} */ (mql))).destroy();
}));
this.registry.clear();
this.useOverlaps = false;
};
/** Feature to support manual, simulated activation of a mediaQuery. */
/**
* Feature to support manual, simulated activation of a mediaQuery.
* @param {?} mediaQuery
* @param {?=} useOverlaps
* @return {?}
*/
MockMatchMedia.prototype.activate = /**
* Feature to support manual, simulated activation of a mediaQuery.
* @param {?} mediaQuery
* @param {?=} useOverlaps
* @return {?}
*/
function (mediaQuery, useOverlaps) {
if (useOverlaps === void 0) { useOverlaps = false; }
useOverlaps = useOverlaps || this.useOverlaps;
mediaQuery = this._validateQuery(mediaQuery);
if (useOverlaps || !this.isActive(mediaQuery)) {
this._deactivateAll();
this._registerMediaQuery(mediaQuery);
this._activateWithOverlaps(mediaQuery, useOverlaps);
}
return this.hasActivated;
};
/** Converts an optional mediaQuery alias to a specific, valid mediaQuery */
/**
* Converts an optional mediaQuery alias to a specific, valid mediaQuery
* @param {?} queryOrAlias
* @return {?}
*/
MockMatchMedia.prototype._validateQuery = /**
* Converts an optional mediaQuery alias to a specific, valid mediaQuery
* @param {?} queryOrAlias
* @return {?}
*/
function (queryOrAlias) {
/** @type {?} */
var bp = this._breakpoints.findByAlias(queryOrAlias);
return (bp && bp.mediaQuery) || queryOrAlias;
};
/**
* Manually onMediaChange any overlapping mediaQueries to simulate
* similar functionality in the window.matchMedia()
*/
/**
* Manually onMediaChange any overlapping mediaQueries to simulate
* similar functionality in the window.matchMedia()
* @private
* @param {?} mediaQuery
* @param {?} useOverlaps
* @return {?}
*/
MockMatchMedia.prototype._activateWithOverlaps = /**
* Manually onMediaChange any overlapping mediaQueries to simulate
* similar functionality in the window.matchMedia()
* @private
* @param {?} mediaQuery
* @param {?} useOverlaps
* @return {?}
*/
function (mediaQuery, useOverlaps) {
if (useOverlaps) {
/** @type {?} */
var bp = this._breakpoints.findByQuery(mediaQuery);
/** @type {?} */
var alias = bp ? bp.alias : 'unknown';
// Simulate activation of overlapping lt-<XXX> ranges
switch (alias) {
case 'lg':
this._activateByAlias(['lt-xl']);
break;
case 'md':
this._activateByAlias(['lt-xl', 'lt-lg']);
break;
case 'sm':
this._activateByAlias(['lt-xl', 'lt-lg', 'lt-md']);
break;
case 'xs':
this._activateByAlias(['lt-xl', 'lt-lg', 'lt-md', 'lt-sm']);
break;
}
// Simulate activation of overlapping gt-<xxxx> mediaQuery ranges
switch (alias) {
case 'xl':
this._activateByAlias(['gt-lg', 'gt-md', 'gt-sm', 'gt-xs']);
break;
case 'lg':
this._activateByAlias(['gt-md', 'gt-sm', 'gt-xs']);
break;
case 'md':
this._activateByAlias(['gt-sm', 'gt-xs']);
break;
case 'sm':
this._activateByAlias(['gt-xs']);
break;
}
}
// Activate last since the responsiveActivation is watching *this* mediaQuery
return this._activateByQuery(mediaQuery);
};
/**
*
*/
/**
*
* @private
* @param {?} aliases
* @return {?}
*/
MockMatchMedia.prototype._activateByAlias = /**
*
* @private
* @param {?} aliases
* @return {?}
*/
function (aliases) {
var _this = this;
/** @type {?} */
var activate = (/**
* @param {?} alias
* @return {?}
*/
function (alias) {
/** @type {?} */
var bp = _this._breakpoints.findByAlias(alias);
_this._activateByQuery(bp ? bp.mediaQuery : alias);
});
aliases.forEach(activate);
};
/**
*
*/
/**
*
* @private
* @param {?} mediaQuery
* @return {?}
*/
MockMatchMedia.prototype._activateByQuery = /**
*
* @private
* @param {?} mediaQuery
* @return {?}
*/
function (mediaQuery) {
if (!this.registry.has(mediaQuery) && this.autoRegisterQueries) {
this._registerMediaQuery(mediaQuery);
}
/** @type {?} */
var mql = (/** @type {?} */ (this.registry.get(mediaQuery)));
if (mql && !this.isActive(mediaQuery)) {
this.registry.set(mediaQuery, mql.activate());
}
return this.hasActivated;
};
/** Deactivate all current MQLs and reset the buffer */
/**
* Deactivate all current MQLs and reset the buffer
* @private
* @template THIS
* @this {THIS}
* @return {THIS}
*/
MockMatchMedia.prototype._deactivateAll = /**
* Deactivate all current MQLs and reset the buffer
* @private
* @template THIS
* @this {THIS}
* @return {THIS}
*/
function () {
(/** @type {?} */ (this)).registry.forEach((/**
* @param {?} it
* @return {?}
*/
function (it) {
((/** @type {?} */ (it))).deactivate();
}));
return (/** @type {?} */ (this));
};
/** Insure the mediaQuery is registered with MatchMedia */
/**
* Insure the mediaQuery is registered with MatchMedia
* @private
* @param {?} mediaQuery
* @return {?}
*/
MockMatchMedia.prototype._registerMediaQuery = /**
* Insure the mediaQuery is registered with MatchMedia
* @private
* @param {?} mediaQuery
* @return {?}
*/
function (mediaQuery) {
if (!this.registry.has(mediaQuery) && this.autoRegisterQueries) {
this.registerQuery(mediaQuery);
}
};
/**
* Call window.matchMedia() to build a MediaQueryList; which
* supports 0..n listeners for activation/deactivation
*/
/**
* Call window.matchMedia() to build a MediaQueryList; which
* supports 0..n listeners for activation/deactivation
* @protected
* @param {?} query
* @return {?}
*/
MockMatchMedia.prototype.buildMQL = /**
* Call window.matchMedia() to build a MediaQueryList; which
* supports 0..n listeners for activation/deactivation
* @protected
* @param {?} query
* @return {?}
*/
function (query) {
return new MockMediaQueryList(query);
};
Object.defineProperty(MockMatchMedia.prototype, "hasActivated", {
get: /**
* @protected
* @return {?}
*/
function () {
return this.activations.length > 0;
},
enumerable: false,
configurable: true
});
MockMatchMedia.decorators = [
{ type: core.Injectable }
];
/** @nocollapse */
MockMatchMedia.ctorParameters = function () { return [
{ type: core.NgZone },
{ type: Object, decorators: [{ type: core.Inject, args: [core.PLATFORM_ID,] }] },
{ type: undefined, decorators: [{ type: core.Inject, args: [common.DOCUMENT,] }] },
{ type: BreakPointRegistry }
]; };
return MockMatchMedia;
}(MatchMedia));
/**
* Special internal class to simulate a MediaQueryList and
* - supports manual activation to simulate mediaQuery matching
* - manages listeners
*/
var /**
* Special internal class to simulate a MediaQueryList and
* - supports manual activation to simulate mediaQuery matching
* - manages listeners
*/
MockMediaQueryList = /** @class */ (function () {
function MockMediaQueryList(_mediaQuery) {
this._mediaQuery = _mediaQuery;
this._isActive = false;
this._listeners = [];
this.onchange = null;
}
Object.defineProperty(MockMediaQueryList.prototype, "matches", {
get: /**
* @return {?}
*/
function () {
return this._isActive;
},
enumerable: false,
configurable: true
});
Object.defineProperty(MockMediaQueryList.prototype, "media", {
get: /**
* @return {?}
*/
function () {
return this._mediaQuery;
},
enumerable: false,
configurable: true
});
/**
* Destroy the current list by deactivating the
* listeners and clearing the internal list
*/
/**
* Destroy the current list by deactivating the
* listeners and clearing the internal list
* @return {?}
*/
MockMediaQueryList.prototype.destroy = /**
* Destroy the current list by deactivating the
* listeners and clearing the internal list
* @return {?}
*/
function () {
this.deactivate();
this._listeners = [];
};
/** Notify all listeners that 'matches === TRUE' */
/**
* Notify all listeners that 'matches === TRUE'
* @return {?}
*/
MockMediaQueryList.prototype.activate = /**
* Notify all listeners that 'matches === TRUE'
* @return {?}
*/
function () {
var _this = this;
if (!this._isActive) {
this._isActive = true;
this._listeners.forEach((/**
* @param {?} callback
* @return {?}
*/
function (callback) {
/** @type {?} */
var cb = (/** @type {?} */ (callback));
cb.call(_this, (/** @type {?} */ ({ matches: _this.matches, media: _this.media })));
}));
}
return this;
};
/** Notify all listeners that 'matches === false' */
/**
* Notify all listeners that 'matches === false'
* @return {?}
*/
MockMediaQueryList.prototype.deactivate = /**
* Notify all listeners that 'matches === false'
* @return {?}
*/
function () {
var _this = this;
if (this._isActive) {
this._isActive = false;
this._listeners.forEach((/**
* @param {?} callback
* @return {?}
*/
function (callback) {
/** @type {?} */
var cb = (/** @type {?} */ (callback));
cb.call(_this, (/** @type {?} */ ({ matches: _this.matches, media: _this.media })));
}));
}
return this;
};
/** Add a listener to our internal list to activate later */
/**
* Add a listener to our internal list to activate later
* @param {?} listener
* @return {?}
*/
MockMediaQueryList.prototype.addListener = /**
* Add a listener to our internal list to activate later
* @param {?} listener
* @return {?}
*/
function (listener) {
if (this._listeners.indexOf(listener) === -1) {
this._listeners.push(listener);
}
if (this._isActive) {
/** @type {?} */
var cb = (/** @type {?} */ (listener));
cb.call(this, (/** @type {?} */ ({ matches: this.matches, media: this.media })));
}
};
/** Don't need to remove listeners in the testing environment */
/**
* Don't need to remove listeners in the testing environment
* @param {?} _
* @return {?}
*/
MockMediaQueryList.prototype.removeListener = /**
* Don't need to remove listeners in the testing environment
* @param {?} _
* @return {?}
*/
function (_) {
};
/**
* @param {?} _
* @param {?} __
* @param {?=} ___
* @return {?}
*/
MockMediaQueryList.prototype.addEventListener = /**
* @param {?} _
* @param {?} __
* @param {?=} ___
* @return {?}
*/
function (_, __, ___) {
};
/**
* @param {?} _
* @param {?} __
* @param {?=} ___
* @return {?}
*/
MockMediaQueryList.prototype.removeEventListener = /**
* @param {?} _
* @param {?} __
* @param {?=} ___
* @return {?}
*/
function (_, __, ___) {
};
/**
* @param {?} _
* @return {?}
*/
MockMediaQueryList.prototype.dispatchEvent = /**
* @param {?} _
* @return {?}
*/
function (_) {
return false;
};
return MockMediaQueryList;
}());
/**
* Pre-configured provider for MockMatchMedia
* @type {?}
*/
var MockMatchMediaProvider = {
// tslint:disable-line:variable-name
provide: MatchMedia,
useClass: MockMatchMedia
};
/**
* @fileoverview added by tsickle
* Generated from: core/match-media/index.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* @fileoverview added by tsickle
* Generated from: core/media-marshaller/print-hook.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/** @type {?} */
var PRINT = 'print';
/** @type {?} */
var BREAKPOINT_PRINT = {
alias: PRINT,
mediaQuery: PRINT,
priority: 1000
};
/**
* PrintHook - Use to intercept print MediaQuery activations and force
* layouts to render with the specified print alias/breakpoint
*
* Used in MediaMarshaller and MediaObserver
*/
var PrintHook = /** @class */ (function () {
function PrintHook(breakpoints, layoutConfig, _document) {
this.breakpoints = breakpoints;
this.layoutConfig = layoutConfig;
this._document = _document;
// registeredBeforeAfterPrintHooks tracks if we registered the `beforeprint`
// and `afterprint` event listeners.
this.registeredBeforeAfterPrintHooks = false;
// isPrintingBeforeAfterEvent is used to track if we are printing from within
// a `beforeprint` event handler. This prevents the typicall `stopPrinting`
// form `interceptEvents` so that printing is not stopped while the dialog
// is still open. This is an extension of the `isPrinting` property on
// browsers which support `beforeprint` and `afterprint` events.
this.isPrintingBeforeAfterEvent = false;
this.beforePrintEventListeners = [];
this.afterPrintEventListeners = [];
/**
* Is this service currently in Print-mode ?
*/
this.isPrinting = false;
this.queue = new PrintQueue();
this.deactivations = [];
}
/** Add 'print' mediaQuery: to listen for matchMedia activations */
/**
* Add 'print' mediaQuery: to listen for matchMedia activations
* @param {?} queries
* @return {?}
*/
PrintHook.prototype.withPrintQuery = /**
* Add 'print' mediaQuery: to listen for matchMedia activations
* @param {?} queries
* @return {?}
*/
function (queries) {
return __spreadArrays(queries, [PRINT]);
};
/** Is the MediaChange event for any 'print' @media */
/**
* Is the MediaChange event for any 'print' \@media
* @param {?} e
* @return {?}
*/
PrintHook.prototype.isPrintEvent = /**
* Is the MediaChange event for any 'print' \@media
* @param {?} e
* @return {?}
*/
function (e) {
return e.mediaQuery.startsWith(PRINT);
};
Object.defineProperty(PrintHook.prototype, "printAlias", {
/** What is the desired mqAlias to use while printing? */
get: /**
* What is the desired mqAlias to use while printing?
* @return {?}
*/
function () {
return this.layoutConfig.printWithBreakpoints || [];
},
enumerable: false,
configurable: true
});
Object.defineProperty(PrintHook.prototype, "printBreakPoints", {
/** Lookup breakpoints associated with print aliases. */
get: /**
* Lookup breakpoints associated with print aliases.
* @return {?}
*/
function () {
var _this = this;
return (/** @type {?} */ (this.printAlias
.map((/**
* @param {?} alias
* @return {?}
*/
function (alias) { return _this.breakpoints.findByAlias(alias); }))
.filter((/**
* @param {?} bp
* @return {?}
*/
function (bp) { return bp !== null; }))));
},
enumerable: false,
configurable: true
});
/** Lookup breakpoint associated with mediaQuery */
/**
* Lookup breakpoint associated with mediaQuery
* @param {?} __0
* @return {?}
*/
PrintHook.prototype.getEventBreakpoints = /**
* Lookup breakpoint associated with mediaQuery
* @param {?} __0
* @return {?}
*/
function (_a) {
var mediaQuery = _a.mediaQuery;
/** @type {?} */
var bp = this.breakpoints.findByQuery(mediaQuery);
/** @type {?} */
var list = bp ? __spreadArrays(this.printBreakPoints, [bp]) : this.printBreakPoints;
return list.sort(sortDescendingPriority);
};
/** Update event with printAlias mediaQuery information */
/**
* Update event with printAlias mediaQuery information
* @param {?} event
* @return {?}
*/
PrintHook.prototype.updateEvent = /**
* Update event with printAlias mediaQuery information
* @param {?} event
* @return {?}
*/
function (event) {
/** @type {?} */
var bp = this.breakpoints.findByQuery(event.mediaQuery);
if (this.isPrintEvent(event)) {
// Reset from 'print' to first (highest priority) print breakpoint
bp = this.getEventBreakpoints(event)[0];
event.mediaQuery = bp ? bp.mediaQuery : '';
}
return mergeAlias(event, bp);
};
// registerBeforeAfterPrintHooks registers a `beforeprint` event hook so we can
// trigger print styles synchronously and apply proper layout styles.
// It is a noop if the hooks have already been registered or if the document's
// `defaultView` is not available.
// registerBeforeAfterPrintHooks registers a `beforeprint` event hook so we can
// trigger print styles synchronously and apply proper layout styles.
// It is a noop if the hooks have already been registered or if the document's
// `defaultView` is not available.
/**
* @private
* @param {?} target
* @return {?}
*/
PrintHook.prototype.registerBeforeAfterPrintHooks =
// registerBeforeAfterPrintHooks registers a `beforeprint` event hook so we can
// trigger print styles synchronously and apply proper layout styles.
// It is a noop if the hooks have already been registered or if the document's
// `defaultView` is not available.
/**
* @private
* @param {?} target
* @return {?}
*/
function (target) {
var _this = this;
// `defaultView` may be null when rendering on the server or in other contexts.
if (!this._document.defaultView || this.registeredBeforeAfterPrintHooks) {
return;
}
this.registeredBeforeAfterPrintHooks = true;
/** @type {?} */
var beforePrintListener = (/**
* @return {?}
*/
function () {
// If we aren't already printing, start printing and update the styles as
// if there was a regular print `MediaChange`(from matchMedia).
if (!_this.isPrinting) {
_this.isPrintingBeforeAfterEvent = true;
_this.startPrinting(target, _this.getEventBreakpoints(new MediaChange(true, PRINT)));
target.updateStyles();
}
});
/** @type {?} */
var afterPrintListener = (/**
* @return {?}
*/
function () {
// If we aren't already printing, start printing and update the styles as
// if there was a regular print `MediaChange`(from matchMedia).
_this.isPrintingBeforeAfterEvent = false;
if (_this.isPrinting) {
_this.stopPrinting(target);
target.updateStyles();
}
});
// Could we have teardown logic to remove if there are no print listeners being used?
this._document.defaultView.addEventListener('beforeprint', beforePrintListener);
this._document.defaultView.addEventListener('afterprint', afterPrintListener);
this.beforePrintEventListeners.push(beforePrintListener);
this.afterPrintEventListeners.push(afterPrintListener);
};
/**
* Prepare RxJS filter operator with partial application
* @return pipeable filter predicate
*/
/**
* Prepare RxJS filter operator with partial application
* @param {?} target
* @return {?} pipeable filter predicate
*/
PrintHook.prototype.interceptEvents = /**
* Prepare RxJS filter operator with partial application
* @param {?} target
* @return {?} pipeable filter predicate
*/
function (target) {
var _this = this;
this.registerBeforeAfterPrintHooks(target);
return (/**
* @param {?} event
* @return {?}
*/
function (event) {
if (_this.isPrintEvent(event)) {
if (event.matches && !_this.isPrinting) {
_this.startPrinting(target, _this.getEventBreakpoints(event));
target.updateStyles();
}
else if (!event.matches && _this.isPrinting && !_this.isPrintingBeforeAfterEvent) {
_this.stopPrinting(target);
target.updateStyles();
}
}
else {
_this.collectActivations(event);
}
});
};
/** Stop mediaChange event propagation in event streams */
/**
* Stop mediaChange event propagation in event streams
* @return {?}
*/
PrintHook.prototype.blockPropagation = /**
* Stop mediaChange event propagation in event streams
* @return {?}
*/
function () {
var _this = this;
return (/**
* @param {?} event
* @return {?}
*/
function (event) {
return !(_this.isPrinting || _this.isPrintEvent(event));
});
};
/**
* Save current activateBreakpoints (for later restore)
* and substitute only the printAlias breakpoint
*/
/**
* Save current activateBreakpoints (for later restore)
* and substitute only the printAlias breakpoint
* @protected
* @param {?} target
* @param {?} bpList
* @return {?}
*/
PrintHook.prototype.startPrinting = /**
* Save current activateBreakpoints (for later restore)
* and substitute only the printAlias breakpoint
* @protected
* @param {?} target
* @param {?} bpList
* @return {?}
*/
function (target, bpList) {
this.isPrinting = true;
target.activatedBreakpoints = this.queue.addPrintBreakpoints(bpList);
};
/** For any print de-activations, reset the entire print queue */
/**
* For any print de-activations, reset the entire print queue
* @protected
* @param {?} target
* @return {?}
*/
PrintHook.prototype.stopPrinting = /**
* For any print de-activations, reset the entire print queue
* @protected
* @param {?} target
* @return {?}
*/
function (target) {
target.activatedBreakpoints = this.deactivations;
this.deactivations = [];
this.queue.clear();
this.isPrinting = false;
};
/**
* To restore pre-Print Activations, we must capture the proper
* list of breakpoint activations BEFORE print starts. OnBeforePrint()
* is supported; so 'print' mediaQuery activations are used as a fallback
* in browsers without `beforeprint` support.
*
* > But activated breakpoints are deactivated BEFORE 'print' activation.
*
* Let's capture all de-activations using the following logic:
*
* When not printing:
* - clear cache when activating non-print breakpoint
* - update cache (and sort) when deactivating
*
* When printing:
* - sort and save when starting print
* - restore as activatedTargets and clear when stop printing
*/
/**
* To restore pre-Print Activations, we must capture the proper
* list of breakpoint activations BEFORE print starts. OnBeforePrint()
* is supported; so 'print' mediaQuery activations are used as a fallback
* in browsers without `beforeprint` support.
*
* > But activated breakpoints are deactivated BEFORE 'print' activation.
*
* Let's capture all de-activations using the following logic:
*
* When not printing:
* - clear cache when activating non-print breakpoint
* - update cache (and sort) when deactivating
*
* When printing:
* - sort and save when starting print
* - restore as activatedTargets and clear when stop printing
* @param {?} event
* @return {?}
*/
PrintHook.prototype.collectActivations = /**
* To restore pre-Print Activations, we must capture the proper
* list of breakpoint activations BEFORE print starts. OnBeforePrint()
* is supported; so 'print' mediaQuery activations are used as a fallback
* in browsers without `beforeprint` support.
*
* > But activated breakpoints are deactivated BEFORE 'print' activation.
*
* Let's capture all de-activations using the following logic:
*
* When not printing:
* - clear cache when activating non-print breakpoint
* - update cache (and sort) when deactivating
*
* When printing:
* - sort and save when starting print
* - restore as activatedTargets and clear when stop printing
* @param {?} event
* @return {?}
*/
function (event) {
if (!this.isPrinting || this.isPrintingBeforeAfterEvent) {
if (!event.matches) {
/** @type {?} */
var bp = this.breakpoints.findByQuery(event.mediaQuery);
if (bp) { // Deactivating a breakpoint
this.deactivations.push(bp);
this.deactivations.sort(sortDescendingPriority);
}
}
else if (!this.isPrintingBeforeAfterEvent) {
// Only clear deactivations if we aren't printing from a `beforeprint` event.
// Otherwise this will clear before `stopPrinting()` is called to restore
// the pre-Print Activations.
this.deactivations = [];
}
}
};
/** Teardown logic for the service. */
/**
* Teardown logic for the service.
* @return {?}
*/
PrintHook.prototype.ngOnDestroy = /**
* Teardown logic for the service.
* @return {?}
*/
function () {
var _this = this;
this.beforePrintEventListeners.forEach((/**
* @param {?} l
* @return {?}
*/
function (l) { return _this._document.defaultView.removeEventListener('beforeprint', l); }));
this.afterPrintEventListeners.forEach((/**
* @param {?} l
* @return {?}
*/
function (l) { return _this._document.defaultView.removeEventListener('afterprint', l); }));
};
/** @nocollapse */ PrintHookprov = core.ɵɵdefineInjectable({ factory: function PrintHook_Factory() { return new PrintHook(core.ɵɵinject(BreakPointRegistry), core.ɵɵinject(LAYOUT_CONFIG), core.ɵɵinject(common.DOCUMENT)); }, token: PrintHook, providedIn: "root" });
PrintHook.decorators = [
{ type: core.Injectable, args: [{ providedIn: 'root' },] }
];
/** @nocollapse */
PrintHook.ctorParameters = function () { return [
{ type: BreakPointRegistry },
{ type: undefined, decorators: [{ type: core.Inject, args: [LAYOUT_CONFIG,] }] },
{ type: undefined, decorators: [{ type: core.Inject, args: [common.DOCUMENT,] }] }
]; };
return PrintHook;
}());
// ************************************************************************
// Internal Utility class 'PrintQueue'
// ************************************************************************
/**
* Utility class to manage print breakpoints + activatedBreakpoints
* with correct sorting WHILE printing
*/
var
// ************************************************************************
// Internal Utility class 'PrintQueue'
// ************************************************************************
/**
* Utility class to manage print breakpoints + activatedBreakpoints
* with correct sorting WHILE printing
*/
PrintQueue = /** @class */ (function () {
function PrintQueue() {
/**
* Sorted queue with prioritized print breakpoints
*/
this.printBreakpoints = [];
}
/**
* @param {?} bpList
* @return {?}
*/
PrintQueue.prototype.addPrintBreakpoints = /**
* @param {?} bpList
* @return {?}
*/
function (bpList) {
var _this = this;
bpList.push(BREAKPOINT_PRINT);
bpList.sort(sortDescendingPriority);
bpList.forEach((/**
* @param {?} bp
* @return {?}
*/
function (bp) { return _this.addBreakpoint(bp); }));
return this.printBreakpoints;
};
/** Add Print breakpoint to queue */
/**
* Add Print breakpoint to queue
* @param {?} bp
* @return {?}
*/
PrintQueue.prototype.addBreakpoint = /**
* Add Print breakpoint to queue
* @param {?} bp
* @return {?}
*/
function (bp) {
if (!!bp) {
/** @type {?} */
var bpInList = this.printBreakpoints.find((/**
* @param {?} it
* @return {?}
*/
function (it) { return it.mediaQuery === bp.mediaQuery; }));
if (bpInList === undefined) {
// If this is a `printAlias` breakpoint, then append. If a true 'print' breakpoint,
// register as highest priority in the queue
this.printBreakpoints = isPrintBreakPoint(bp) ? __spreadArrays([bp], this.printBreakpoints) : __spreadArrays(this.printBreakpoints, [bp]);
}
}
};
/** Restore original activated breakpoints and clear internal caches */
/**
* Restore original activated breakpoints and clear internal caches
* @return {?}
*/
PrintQueue.prototype.clear = /**
* Restore original activated breakpoints and clear internal caches
* @return {?}
*/
function () {
this.printBreakpoints = [];
};
return PrintQueue;
}());
// ************************************************************************
// Internal Utility methods
// ************************************************************************
/**
* Only support intercept queueing if the Breakpoint is a print \@media query
* @param {?} bp
* @return {?}
*/
function isPrintBreakPoint(bp) {
return bp ? bp.mediaQuery.startsWith(PRINT) : false;
}
/**
* @fileoverview added by tsickle
* Generated from: core/utils/array.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* Wraps the provided value in an array, unless the provided value is an array.
* @template T
* @param {?} value
* @return {?}
*/
function coerceArray(value) {
return Array.isArray(value) ? value : [value];
}
/**
* @fileoverview added by tsickle
* Generated from: core/media-observer/media-observer.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* MediaObserver enables applications to listen for 1..n mediaQuery activations and to determine
* if a mediaQuery is currently activated.
*
* Since a breakpoint change will first deactivate 1...n mediaQueries and then possibly activate
* 1..n mediaQueries, the MediaObserver will debounce notifications and report ALL *activations*
* in 1 event notification. The reported activations will be sorted in descending priority order.
*
* This class uses the BreakPoint Registry to inject alias information into the raw MediaChange
* notification. For custom mediaQuery notifications, alias information will not be injected and
* those fields will be ''.
*
* Note: Developers should note that only mediaChange activations (not de-activations)
* are announced by the MediaObserver.
*
* \@usage
*
* // RxJS
* import { filter } from 'rxjs/operators';
* import { MediaObserver } from '\@angular/flex-layout';
*
* \@Component({ ... })
* export class AppComponent {
* status: string = '';
*
* constructor(mediaObserver: MediaObserver) {
* const media$ = mediaObserver.asObservable().pipe(
* filter((changes: MediaChange[]) => true) // silly noop filter
* );
*
* media$.subscribe((changes: MediaChange[]) => {
* let status = '';
* changes.forEach( change => {
* status += `'${change.mqAlias}' = (${change.mediaQuery}) <br/>` ;
* });
* this.status = status;
* });
*
* }
* }
*/
var MediaObserver = /** @class */ (function () {
function MediaObserver(breakpoints, matchMedia, hook) {
this.breakpoints = breakpoints;
this.matchMedia = matchMedia;
this.hook = hook;
/**
* Filter MediaChange notifications for overlapping breakpoints
*/
this.filterOverlaps = false;
this.destroyed$ = new rxjs.Subject();
this._media$ = this.watchActivations();
this.media$ = this._media$.pipe(operators.filter((/**
* @param {?} changes
* @return {?}
*/
function (changes) { return changes.length > 0; })), operators.map((/**
* @param {?} changes
* @return {?}
*/
function (changes) { return changes[0]; })));
}
/**
* Completes the active subject, signalling to all complete for all
* MediaObserver subscribers
*/
/**
* Completes the active subject, signalling to all complete for all
* MediaObserver subscribers
* @return {?}
*/
MediaObserver.prototype.ngOnDestroy = /**
* Completes the active subject, signalling to all complete for all
* MediaObserver subscribers
* @return {?}
*/
function () {
this.destroyed$.next();
this.destroyed$.complete();
};
// ************************************************
// Public Methods
// ************************************************
/**
* Observe changes to current activation 'list'
*/
// ************************************************
// Public Methods
// ************************************************
/**
* Observe changes to current activation 'list'
* @return {?}
*/
MediaObserver.prototype.asObservable =
// ************************************************
// Public Methods
// ************************************************
/**
* Observe changes to current activation 'list'
* @return {?}
*/
function () {
return this._media$;
};
/**
* Allow programmatic query to determine if one or more media query/alias match
* the current viewport size.
* @param value One or more media queries (or aliases) to check.
* @returns Whether any of the media queries match.
*/
/**
* Allow programmatic query to determine if one or more media query/alias match
* the current viewport size.
* @param {?} value One or more media queries (or aliases) to check.
* @return {?} Whether any of the media queries match.
*/
MediaObserver.prototype.isActive = /**
* Allow programmatic query to determine if one or more media query/alias match
* the current viewport size.
* @param {?} value One or more media queries (or aliases) to check.
* @return {?} Whether any of the media queries match.
*/
function (value) {
var _this = this;
/** @type {?} */
var aliases = splitQueries(coerceArray(value));
return aliases.some((/**
* @param {?} alias
* @return {?}
*/
function (alias) {
/** @type {?} */
var query = toMediaQuery(alias, _this.breakpoints);
return query !== null && _this.matchMedia.isActive(query);
}));
};
// ************************************************
// Internal Methods
// ************************************************
/**
* Register all the mediaQueries registered in the BreakPointRegistry
* This is needed so subscribers can be auto-notified of all standard, registered
* mediaQuery activations
*/
// ************************************************
// Internal Methods
// ************************************************
/**
* Register all the mediaQueries registered in the BreakPointRegistry
* This is needed so subscribers can be auto-notified of all standard, registered
* mediaQuery activations
* @private
* @return {?}
*/
MediaObserver.prototype.watchActivations =
// ************************************************
// Internal Methods
// ************************************************
/**
* Register all the mediaQueries registered in the BreakPointRegistry
* This is needed so subscribers can be auto-notified of all standard, registered
* mediaQuery activations
* @private
* @return {?}
*/
function () {
/** @type {?} */
var queries = this.breakpoints.items.map((/**
* @param {?} bp
* @return {?}
*/
function (bp) { return bp.mediaQuery; }));
return this.buildObservable(queries);
};
/**
* Only pass/announce activations (not de-activations)
*
* Since multiple-mediaQueries can be activation in a cycle,
* gather all current activations into a single list of changes to observers
*
* Inject associated (if any) alias information into the MediaChange event
* - Exclude mediaQuery activations for overlapping mQs. List bounded mQ ranges only
* - Exclude print activations that do not have an associated mediaQuery
*
* NOTE: the raw MediaChange events [from MatchMedia] do not
* contain important alias information; as such this info
* must be injected into the MediaChange
*/
/**
* Only pass/announce activations (not de-activations)
*
* Since multiple-mediaQueries can be activation in a cycle,
* gather all current activations into a single list of changes to observers
*
* Inject associated (if any) alias information into the MediaChange event
* - Exclude mediaQuery activations for overlapping mQs. List bounded mQ ranges only
* - Exclude print activations that do not have an associated mediaQuery
*
* NOTE: the raw MediaChange events [from MatchMedia] do not
* contain important alias information; as such this info
* must be injected into the MediaChange
* @private
* @param {?} mqList
* @return {?}
*/
MediaObserver.prototype.buildObservable = /**
* Only pass/announce activations (not de-activations)
*
* Since multiple-mediaQueries can be activation in a cycle,
* gather all current activations into a single list of changes to observers
*
* Inject associated (if any) alias information into the MediaChange event
* - Exclude mediaQuery activations for overlapping mQs. List bounded mQ ranges only
* - Exclude print activations that do not have an associated mediaQuery
*
* NOTE: the raw MediaChange events [from MatchMedia] do not
* contain important alias information; as such this info
* must be injected into the MediaChange
* @private
* @param {?} mqList
* @return {?}
*/
function (mqList) {
var _this = this;
/** @type {?} */
var hasChanges = (/**
* @param {?} changes
* @return {?}
*/
function (changes) {
/** @type {?} */
var isValidQuery = (/**
* @param {?} change
* @return {?}
*/
function (change) { return (change.mediaQuery.length > 0); });
return (changes.filter(isValidQuery).length > 0);
});
/** @type {?} */
var excludeOverlaps = (/**
* @param {?} changes
* @return {?}
*/
function (changes) {
return !_this.filterOverlaps ? changes : changes.filter((/**
* @param {?} change
* @return {?}
*/
function (change) {
/** @type {?} */
var bp = _this.breakpoints.findByQuery(change.mediaQuery);
return !bp ? true : !bp.overlapping;
}));
});
/**
*/
return this.matchMedia
.observe(this.hook.withPrintQuery(mqList))
.pipe(operators.filter((/**
* @param {?} change
* @return {?}
*/
function (change) { return change.matches; })), operators.debounceTime(0, rxjs.asapScheduler), operators.switchMap((/**
* @param {?} _
* @return {?}
*/
function (_) { return rxjs.of(_this.findAllActivations()); })), operators.map(excludeOverlaps), operators.filter(hasChanges), operators.takeUntil(this.destroyed$));
};
/**
* Find all current activations and prepare single list of activations
* sorted by descending priority.
*/
/**
* Find all current activations and prepare single list of activations
* sorted by descending priority.
* @private
* @return {?}
*/
MediaObserver.prototype.findAllActivations = /**
* Find all current activations and prepare single list of activations
* sorted by descending priority.
* @private
* @return {?}
*/
function () {
var _this = this;
/** @type {?} */
var mergeMQAlias = (/**
* @param {?} change
* @return {?}
*/
function (change) {
/** @type {?} */
var bp = _this.breakpoints.findByQuery(change.mediaQuery);
return mergeAlias(change, bp);
});
/** @type {?} */
var replaceWithPrintAlias = (/**
* @param {?} change
* @return {?}
*/
function (change) {
return _this.hook.isPrintEvent(change) ? _this.hook.updateEvent(change) : change;
});
return this.matchMedia
.activations
.map((/**
* @param {?} query
* @return {?}
*/
function (query) { return new MediaChange(true, query); }))
.map(replaceWithPrintAlias)
.map(mergeMQAlias)
.sort(sortDescendingPriority);
};
/** @nocollapse */ MediaObserverprov = core.ɵɵdefineInjectable({ factory: function MediaObserver_Factory() { return new MediaObserver(core.ɵɵinject(BreakPointRegistry), core.ɵɵinject(MatchMedia), core.ɵɵinject(PrintHook)); }, token: MediaObserver, providedIn: "root" });
MediaObserver.decorators = [
{ type: core.Injectable, args: [{ providedIn: 'root' },] }
];
/** @nocollapse */
MediaObserver.ctorParameters = function () { return [
{ type: BreakPointRegistry },
{ type: MatchMedia },
{ type: PrintHook }
]; };
return MediaObserver;
}());
/**
* Find associated breakpoint (if any)
* @param {?} query
* @param {?} locator
* @return {?}
*/
function toMediaQuery(query, locator) {
/** @type {?} */
var bp = locator.findByAlias(query) || locator.findByQuery(query);
return bp ? bp.mediaQuery : null;
}
/**
* 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
* Generated from: core/media-observer/index.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* @fileoverview added by tsickle
* Generated from: core/media-trigger/media-trigger.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* Class
*/
var MediaTrigger = /** @class */ (function () {
function MediaTrigger(breakpoints, matchMedia, layoutConfig, _platformId, _document) {
this.breakpoints = breakpoints;
this.matchMedia = matchMedia;
this.layoutConfig = layoutConfig;
this._platformId = _platformId;
this._document = _document;
this.hasCachedRegistryMatches = false;
this.originalActivations = [];
this.originalRegistry = new Map();
}
/**
* Manually activate range of breakpoints
* @param list array of mediaQuery or alias strings
*/
/**
* Manually activate range of breakpoints
* @param {?} list array of mediaQuery or alias strings
* @return {?}
*/
MediaTrigger.prototype.activate = /**
* Manually activate range of breakpoints
* @param {?} list array of mediaQuery or alias strings
* @return {?}
*/
function (list) {
list = list.map((/**
* @param {?} it
* @return {?}
*/
function (it) { return it.trim(); })); // trim queries
this.saveActivations();
this.deactivateAll();
this.setActivations(list);
this.prepareAutoRestore();
};
/**
* Restore original, 'real' breakpoints and emit events
* to trigger stream notification
*/
/**
* Restore original, 'real' breakpoints and emit events
* to trigger stream notification
* @return {?}
*/
MediaTrigger.prototype.restore = /**
* Restore original, 'real' breakpoints and emit events
* to trigger stream notification
* @return {?}
*/
function () {
if (this.hasCachedRegistryMatches) {
/** @type {?} */
var extractQuery = (/**
* @param {?} change
* @return {?}
*/
function (change) { return change.mediaQuery; });
/** @type {?} */
var list = this.originalActivations.map(extractQuery);
try {
this.deactivateAll();
this.restoreRegistryMatches();
this.setActivations(list);
}
finally {
this.originalActivations = [];
if (this.resizeSubscription) {
this.resizeSubscription.unsubscribe();
}
}
}
};
// ************************************************
// Internal Methods
// ************************************************
/**
* Whenever window resizes, immediately auto-restore original
* activations (if we are simulating activations)
*/
// ************************************************
// Internal Methods
// ************************************************
/**
* Whenever window resizes, immediately auto-restore original
* activations (if we are simulating activations)
* @private
* @return {?}
*/
MediaTrigger.prototype.prepareAutoRestore =
// ************************************************
// Internal Methods
// ************************************************
/**
* Whenever window resizes, immediately auto-restore original
* activations (if we are simulating activations)
* @private
* @return {?}
*/
function () {
/** @type {?} */
var isBrowser = common.isPlatformBrowser(this._platformId) && this._document;
/** @type {?} */
var enableAutoRestore = isBrowser && this.layoutConfig.mediaTriggerAutoRestore;
if (enableAutoRestore) {
/** @type {?} */
var resize$ = rxjs.fromEvent(window, 'resize').pipe(operators.take(1));
this.resizeSubscription = resize$.subscribe(this.restore.bind(this));
}
};
/**
* Notify all matchMedia subscribers of de-activations
*
* Note: we must force 'matches' updates for
* future matchMedia::activation lookups
*/
/**
* Notify all matchMedia subscribers of de-activations
*
* Note: we must force 'matches' updates for
* future matchMedia::activation lookups
* @private
* @return {?}
*/
MediaTrigger.prototype.deactivateAll = /**
* Notify all matchMedia subscribers of de-activations
*
* Note: we must force 'matches' updates for
* future matchMedia::activation lookups
* @private
* @return {?}
*/
function () {
/** @type {?} */
var list = this.currentActivations;
this.forceRegistryMatches(list, false);
this.simulateMediaChanges(list, false);
};
/**
* Cache current activations as sorted, prioritized list of MediaChanges
*/
/**
* Cache current activations as sorted, prioritized list of MediaChanges
* @private
* @return {?}
*/
MediaTrigger.prototype.saveActivations = /**
* Cache current activations as sorted, prioritized list of MediaChanges
* @private
* @return {?}
*/
function () {
var _this = this;
if (!this.hasCachedRegistryMatches) {
/** @type {?} */
var toMediaChange = (/**
* @param {?} query
* @return {?}
*/
function (query) { return new MediaChange(true, query); });
/** @type {?} */
var mergeMQAlias = (/**
* @param {?} change
* @return {?}
*/
function (change) {
/** @type {?} */
var bp = _this.breakpoints.findByQuery(change.mediaQuery);
return mergeAlias(change, bp);
});
this.originalActivations = this.currentActivations
.map(toMediaChange)
.map(mergeMQAlias)
.sort(sortDescendingPriority);
this.cacheRegistryMatches();
}
};
/**
* Force set manual activations for specified mediaQuery list
*/
/**
* Force set manual activations for specified mediaQuery list
* @private
* @param {?} list
* @return {?}
*/
MediaTrigger.prototype.setActivations = /**
* Force set manual activations for specified mediaQuery list
* @private
* @param {?} list
* @return {?}
*/
function (list) {
if (!!this.originalRegistry) {
this.forceRegistryMatches(list, true);
}
this.simulateMediaChanges(list);
};
/**
* For specified mediaQuery list manually simulate activations or deactivations
*/
/**
* For specified mediaQuery list manually simulate activations or deactivations
* @private
* @param {?} queries
* @param {?=} matches
* @return {?}
*/
MediaTrigger.prototype.simulateMediaChanges = /**
* For specified mediaQuery list manually simulate activations or deactivations
* @private
* @param {?} queries
* @param {?=} matches
* @return {?}
*/
function (queries, matches) {
var _this = this;
if (matches === void 0) { matches = true; }
/** @type {?} */
var toMediaQuery = (/**
* @param {?} query
* @return {?}
*/
function (query) {
/** @type {?} */
var locator = _this.breakpoints;
/** @type {?} */
var bp = locator.findByAlias(query) || locator.findByQuery(query);
return bp ? bp.mediaQuery : query;
});
/** @type {?} */
var emitChangeEvent = (/**
* @param {?} query
* @return {?}
*/
function (query) { return _this.emitChangeEvent(matches, query); });
queries.map(toMediaQuery).forEach(emitChangeEvent);
};
/**
* Replace current registry with simulated registry...
* Note: this is required since MediaQueryList::matches is 'readOnly'
*/
/**
* Replace current registry with simulated registry...
* Note: this is required since MediaQueryList::matches is 'readOnly'
* @private
* @param {?} queries
* @param {?} matches
* @return {?}
*/
MediaTrigger.prototype.forceRegistryMatches = /**
* Replace current registry with simulated registry...
* Note: this is required since MediaQueryList::matches is 'readOnly'
* @private
* @param {?} queries
* @param {?} matches
* @return {?}
*/
function (queries, matches) {
/** @type {?} */
var registry = new Map();
queries.forEach((/**
* @param {?} query
* @return {?}
*/
function (query) {
registry.set(query, (/** @type {?} */ ({ matches: matches })));
}));
this.matchMedia.registry = registry;
};
/**
* Save current MatchMedia::registry items.
*/
/**
* Save current MatchMedia::registry items.
* @private
* @return {?}
*/
MediaTrigger.prototype.cacheRegistryMatches = /**
* Save current MatchMedia::registry items.
* @private
* @return {?}
*/
function () {
/** @type {?} */
var target = this.originalRegistry;
target.clear();
this.matchMedia.registry.forEach((/**
* @param {?} value
* @param {?} key
* @return {?}
*/
function (value, key) {
target.set(key, value);
}));
this.hasCachedRegistryMatches = true;
};
/**
* Restore original, 'true' registry
*/
/**
* Restore original, 'true' registry
* @private
* @return {?}
*/
MediaTrigger.prototype.restoreRegistryMatches = /**
* Restore original, 'true' registry
* @private
* @return {?}
*/
function () {
/** @type {?} */
var target = this.matchMedia.registry;
target.clear();
this.originalRegistry.forEach((/**
* @param {?} value
* @param {?} key
* @return {?}
*/
function (value, key) {
target.set(key, value);
}));
this.originalRegistry.clear();
this.hasCachedRegistryMatches = false;
};
/**
* Manually emit a MediaChange event via the MatchMedia to MediaMarshaller and MediaObserver
*/
/**
* Manually emit a MediaChange event via the MatchMedia to MediaMarshaller and MediaObserver
* @private
* @param {?} matches
* @param {?} query
* @return {?}
*/
MediaTrigger.prototype.emitChangeEvent = /**
* Manually emit a MediaChange event via the MatchMedia to MediaMarshaller and MediaObserver
* @private
* @param {?} matches
* @param {?} query
* @return {?}
*/
function (matches, query) {
this.matchMedia.source.next(new MediaChange(matches, query));
};
Object.defineProperty(MediaTrigger.prototype, "currentActivations", {
get: /**
* @private
* @return {?}
*/
function () {
return this.matchMedia.activations;
},
enumerable: false,
configurable: true
});
/** @nocollapse */ MediaTriggerprov = core.ɵɵdefineInjectable({ factory: function MediaTrigger_Factory() { return new MediaTrigger(core.ɵɵinject(BreakPointRegistry), core.ɵɵinject(MatchMedia), core.ɵɵinject(LAYOUT_CONFIG), core.ɵɵinject(core.PLATFORM_ID), core.ɵɵinject(common.DOCUMENT)); }, token: MediaTrigger, providedIn: "root" });
MediaTrigger.decorators = [
{ type: core.Injectable, args: [{ providedIn: 'root' },] }
];
/** @nocollapse */
MediaTrigger.ctorParameters = function () { return [
{ type: BreakPointRegistry },
{ type: MatchMedia },
{ type: undefined, decorators: [{ type: core.Inject, args: [LAYOUT_CONFIG,] }] },
{ type: Object, decorators: [{ type: core.Inject, args: [core.PLATFORM_ID,] }] },
{ type: undefined, decorators: [{ type: core.Inject, args: [common.DOCUMENT,] }] }
]; };
return MediaTrigger;
}());
/**
* @fileoverview added by tsickle
* Generated from: core/media-trigger/index.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* @fileoverview added by tsickle
* Generated from: core/utils/index.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* @fileoverview added by tsickle
* Generated from: utils/auto-prefixer.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* Applies CSS prefixes to appropriate style keys.
*
* Note: `-ms-`, `-moz` and `-webkit-box` are no longer supported. e.g.
* {
* display: -webkit-flex; NEW - Safari 6.1+. iOS 7.1+, BB10
* display: flex; NEW, Spec - Firefox, Chrome, Opera
* // display: -webkit-box; OLD - iOS 6-, Safari 3.1-6, BB7
* // display: -ms-flexbox; TWEENER - IE 10
* // display: -moz-flexbox; OLD - Firefox
* }
* @param {?} target
* @return {?}
*/
function applyCssPrefixes(target) {
for (var key in target) {
/** @type {?} */
var value = target[key] || '';
switch (key) {
case 'display':
if (value === 'flex') {
target['display'] = [
'-webkit-flex',
'flex'
];
}
else if (value === 'inline-flex') {
target['display'] = [
'-webkit-inline-flex',
'inline-flex'
];
}
else {
target['display'] = value;
}
break;
case 'align-items':
case 'align-self':
case 'align-content':
case 'flex':
case 'flex-basis':
case 'flex-flow':
case 'flex-grow':
case 'flex-shrink':
case 'flex-wrap':
case 'justify-content':
target['-webkit-' + key] = value;
break;
case 'flex-direction':
value = value || 'row';
target['-webkit-flex-direction'] = value;
target['flex-direction'] = value;
break;
case 'order':
target['order'] = target['-webkit-' + key] = isNaN(+value) ? '0' : value;
break;
}
}
return target;
}
/**
* @fileoverview added by tsickle
* Generated from: core/style-utils/style-utils.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var StyleUtils = /** @class */ (function () {
function StyleUtils(_serverStylesheet, _serverModuleLoaded, _platformId, layoutConfig) {
this._serverStylesheet = _serverStylesheet;
this._serverModuleLoaded = _serverModuleLoaded;
this._platformId = _platformId;
this.layoutConfig = layoutConfig;
}
/**
* Applies styles given via string pair or object map to the directive element
*/
/**
* Applies styles given via string pair or object map to the directive element
* @param {?} element
* @param {?} style
* @param {?=} value
* @return {?}
*/
StyleUtils.prototype.applyStyleToElement = /**
* Applies styles given via string pair or object map to the directive element
* @param {?} element
* @param {?} style
* @param {?=} value
* @return {?}
*/
function (element, style, value) {
if (value === void 0) { value = null; }
/** @type {?} */
var styles = {};
if (typeof style === 'string') {
styles[style] = value;
style = styles;
}
styles = this.layoutConfig.disableVendorPrefixes ? style : applyCssPrefixes(style);
this._applyMultiValueStyleToElement(styles, element);
};
/**
* Applies styles given via string pair or object map to the directive's element
*/
/**
* Applies styles given via string pair or object map to the directive's element
* @param {?} style
* @param {?=} elements
* @return {?}
*/
StyleUtils.prototype.applyStyleToElements = /**
* Applies styles given via string pair or object map to the directive's element
* @param {?} style
* @param {?=} elements
* @return {?}
*/
function (style, elements) {
var _this = this;
if (elements === void 0) { elements = []; }
/** @type {?} */
var styles = this.layoutConfig.disableVendorPrefixes ? style : applyCssPrefixes(style);
elements.forEach((/**
* @param {?} el
* @return {?}
*/
function (el) {
_this._applyMultiValueStyleToElement(styles, el);
}));
};
/**
* Determine the DOM element's Flexbox flow (flex-direction)
*
* Check inline style first then check computed (stylesheet) style
*/
/**
* Determine the DOM element's Flexbox flow (flex-direction)
*
* Check inline style first then check computed (stylesheet) style
* @param {?} target
* @return {?}
*/
StyleUtils.prototype.getFlowDirection = /**
* Determine the DOM element's Flexbox flow (flex-direction)
*
* Check inline style first then check computed (stylesheet) style
* @param {?} target
* @return {?}
*/
function (target) {
/** @type {?} */
var query = 'flex-direction';
/** @type {?} */
var value = this.lookupStyle(target, query);
/** @type {?} */
var hasInlineValue = this.lookupInlineStyle(target, query) ||
(common.isPlatformServer(this._platformId) && this._serverModuleLoaded) ? value : '';
return [value || 'row', hasInlineValue];
};
/**
* @param {?} target
* @return {?}
*/
StyleUtils.prototype.hasWrap = /**
* @param {?} target
* @return {?}
*/
function (target) {
/** @type {?} */
var query = 'flex-wrap';
return this.lookupStyle(target, query) === 'wrap';
};
/**
* Find the DOM element's raw attribute value (if any)
*/
/**
* Find the DOM element's raw attribute value (if any)
* @param {?} element
* @param {?} attribute
* @return {?}
*/
StyleUtils.prototype.lookupAttributeValue = /**
* Find the DOM element's raw attribute value (if any)
* @param {?} element
* @param {?} attribute
* @return {?}
*/
function (element, attribute) {
return element.getAttribute(attribute) || '';
};
/**
* Find the DOM element's inline style value (if any)
*/
/**
* Find the DOM element's inline style value (if any)
* @param {?} element
* @param {?} styleName
* @return {?}
*/
StyleUtils.prototype.lookupInlineStyle = /**
* Find the DOM element's inline style value (if any)
* @param {?} element
* @param {?} styleName
* @return {?}
*/
function (element, styleName) {
return common.isPlatformBrowser(this._platformId) ?
element.style.getPropertyValue(styleName) : this._getServerStyle(element, styleName);
};
/**
* Determine the inline or inherited CSS style
* NOTE: platform-server has no implementation for getComputedStyle
*/
/**
* Determine the inline or inherited CSS style
* NOTE: platform-server has no implementation for getComputedStyle
* @param {?} element
* @param {?} styleName
* @param {?=} inlineOnly
* @return {?}
*/
StyleUtils.prototype.lookupStyle = /**
* Determine the inline or inherited CSS style
* NOTE: platform-server has no implementation for getComputedStyle
* @param {?} element
* @param {?} styleName
* @param {?=} inlineOnly
* @return {?}
*/
function (element, styleName, inlineOnly) {
if (inlineOnly === void 0) { inlineOnly = false; }
/** @type {?} */
var value = '';
if (element) {
/** @type {?} */
var immediateValue = value = this.lookupInlineStyle(element, styleName);
if (!immediateValue) {
if (common.isPlatformBrowser(this._platformId)) {
if (!inlineOnly) {
value = getComputedStyle(element).getPropertyValue(styleName);
}
}
else {
if (this._serverModuleLoaded) {
value = this._serverStylesheet.getStyleForElement(element, styleName);
}
}
}
}
// Note: 'inline' is the default of all elements, unless UA stylesheet overrides;
// in which case getComputedStyle() should determine a valid value.
return value ? value.trim() : '';
};
/**
* Applies the styles to the element. The styles object map may contain an array of values
* Each value will be added as element style
* Keys are sorted to add prefixed styles (like -webkit-x) first, before the standard ones
*/
/**
* Applies the styles to the element. The styles object map may contain an array of values
* Each value will be added as element style
* Keys are sorted to add prefixed styles (like -webkit-x) first, before the standard ones
* @private
* @param {?} styles
* @param {?} element
* @return {?}
*/
StyleUtils.prototype._applyMultiValueStyleToElement = /**
* Applies the styles to the element. The styles object map may contain an array of values
* Each value will be added as element style
* Keys are sorted to add prefixed styles (like -webkit-x) first, before the standard ones
* @private
* @param {?} styles
* @param {?} element
* @return {?}
*/
function (styles, element) {
var _this = this;
Object.keys(styles).sort().forEach((/**
* @param {?} key
* @return {?}
*/
function (key) {
/** @type {?} */
var el = styles[key];
/** @type {?} */
var values = Array.isArray(el) ? el : [el];
values.sort();
for (var _i = 0, values_1 = values; _i < values_1.length; _i++) {
var value = values_1[_i];
value = value ? value + '' : '';
if (common.isPlatformBrowser(_this._platformId) || !_this._serverModuleLoaded) {
common.isPlatformBrowser(_this._platformId) ?
element.style.setProperty(key, value) : _this._setServerStyle(element, key, value);
}
else {
_this._serverStylesheet.addStyleToElement(element, key, value);
}
}
}));
};
/**
* @private
* @param {?} element
* @param {?} styleName
* @param {?=} styleValue
* @return {?}
*/
StyleUtils.prototype._setServerStyle = /**
* @private
* @param {?} element
* @param {?} styleName
* @param {?=} styleValue
* @return {?}
*/
function (element, styleName, styleValue) {
styleName = styleName.replace(/([a-z])([A-Z])/g, '$1-$2').toLowerCase();
/** @type {?} */
var styleMap = this._readStyleAttribute(element);
styleMap[styleName] = styleValue || '';
this._writeStyleAttribute(element, styleMap);
};
/**
* @private
* @param {?} element
* @param {?} styleName
* @return {?}
*/
StyleUtils.prototype._getServerStyle = /**
* @private
* @param {?} element
* @param {?} styleName
* @return {?}
*/
function (element, styleName) {
/** @type {?} */
var styleMap = this._readStyleAttribute(element);
return styleMap[styleName] || '';
};
/**
* @private
* @param {?} element
* @return {?}
*/
StyleUtils.prototype._readStyleAttribute = /**
* @private
* @param {?} element
* @return {?}
*/
function (element) {
/** @type {?} */
var styleMap = {};
/** @type {?} */
var styleAttribute = element.getAttribute('style');
if (styleAttribute) {
/** @type {?} */
var styleList = styleAttribute.split(/;+/g);
for (var i = 0; i < styleList.length; i++) {
/** @type {?} */
var style = styleList[i].trim();
if (style.length > 0) {
/** @type {?} */
var colonIndex = style.indexOf(':');
if (colonIndex === -1) {
throw new Error("Invalid CSS style: " + style);
}
/** @type {?} */
var name_1 = style.substr(0, colonIndex).trim();
styleMap[name_1] = style.substr(colonIndex + 1).trim();
}
}
}
return styleMap;
};
/**
* @private
* @param {?} element
* @param {?} styleMap
* @return {?}
*/
StyleUtils.prototype._writeStyleAttribute = /**
* @private
* @param {?} element
* @param {?} styleMap
* @return {?}
*/
function (element, styleMap) {
/** @type {?} */
var styleAttrValue = '';
for (var key in styleMap) {
/** @type {?} */
var newValue = styleMap[key];
if (newValue) {
styleAttrValue += key + ':' + styleMap[key] + ';';
}
}
element.setAttribute('style', styleAttrValue);
};
/** @nocollapse */ StyleUtilsprov = core.ɵɵdefineInjectable({ factory: function StyleUtils_Factory() { return new StyleUtils(core.ɵɵinject(StylesheetMap), core.ɵɵinject(SERVER_TOKEN), core.ɵɵinject(core.PLATFORM_ID), core.ɵɵinject(LAYOUT_CONFIG)); }, token: StyleUtils, providedIn: "root" });
StyleUtils.decorators = [
{ type: core.Injectable, args: [{ providedIn: 'root' },] }
];
/** @nocollapse */
StyleUtils.ctorParameters = function () { return [
{ type: StylesheetMap },
{ type: Boolean, decorators: [{ type: core.Inject, args: [SERVER_TOKEN,] }] },
{ type: Object, decorators: [{ type: core.Inject, args: [core.PLATFORM_ID,] }] },
{ type: undefined, decorators: [{ type: core.Inject, args: [LAYOUT_CONFIG,] }] }
]; };
return StyleUtils;
}());
/**
* @fileoverview added by tsickle
* Generated from: core/style-builder/style-builder.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* A class that encapsulates CSS style generation for common directives
* @abstract
*/
var /**
* A class that encapsulates CSS style generation for common directives
* @abstract
*/
StyleBuilder = /** @class */ (function () {
function StyleBuilder() {
/**
* Whether to cache the generated output styles
*/
this.shouldCache = true;
}
/**
* Run a side effect computation given the input string and the computed styles
* from the build task and the host configuration object
* NOTE: This should be a no-op unless an algorithm is provided in a subclass
*/
/**
* Run a side effect computation given the input string and the computed styles
* from the build task and the host configuration object
* NOTE: This should be a no-op unless an algorithm is provided in a subclass
* @param {?} _input
* @param {?} _styles
* @param {?=} _parent
* @return {?}
*/
StyleBuilder.prototype.sideEffect = /**
* Run a side effect computation given the input string and the computed styles
* from the build task and the host configuration object
* NOTE: This should be a no-op unless an algorithm is provided in a subclass
* @param {?} _input
* @param {?} _styles
* @param {?=} _parent
* @return {?}
*/
function (_input, _styles, _parent) {
};
return StyleBuilder;
}());
/**
* @fileoverview added by tsickle
* Generated from: core/basis-validator/basis-validator.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* The flex API permits 3 or 1 parts of the value:
* - `flex-grow flex-shrink flex-basis`, or
* - `flex-basis`
* @param {?} basis
* @param {?=} grow
* @param {?=} shrink
* @return {?}
*/
function validateBasis(basis, grow, shrink) {
if (grow === void 0) { grow = '1'; }
if (shrink === void 0) { shrink = '1'; }
/** @type {?} */
var parts = [grow, shrink, basis];
/** @type {?} */
var j = basis.indexOf('calc');
if (j > 0) {
parts[2] = _validateCalcValue(basis.substring(j).trim());
/** @type {?} */
var matches = basis.substr(0, j).trim().split(' ');
if (matches.length == 2) {
parts[0] = matches[0];
parts[1] = matches[1];
}
}
else if (j == 0) {
parts[2] = _validateCalcValue(basis.trim());
}
else {
/** @type {?} */
var matches = basis.split(' ');
parts = (matches.length === 3) ? matches : [
grow, shrink, basis
];
}
return parts;
}
/**
* Calc expressions require whitespace before & after any expression operators
* This is a simple, crude whitespace padding solution.
* - '3 3 calc(15em + 20px)'
* - calc(100% / 7 * 2)
* - 'calc(15em + 20px)'
* - 'calc(15em+20px)'
* - '37px'
* = '43%'
* @param {?} calc
* @return {?}
*/
function _validateCalcValue(calc) {
return calc.replace(/[\s]/g, '').replace(/[\/\*\+\-]/g, ' $& ');
}
/**
* @fileoverview added by tsickle
* Generated from: core/media-marshaller/media-marshaller.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* MediaMarshaller - register responsive values from directives and
* trigger them based on media query events
*/
var MediaMarshaller = /** @class */ (function () {
function MediaMarshaller(matchMedia, breakpoints, hook) {
this.matchMedia = matchMedia;
this.breakpoints = breakpoints;
this.hook = hook;
this.activatedBreakpoints = [];
this.elementMap = new Map();
this.elementKeyMap = new WeakMap();
this.watcherMap = new WeakMap(); // special triggers to update elements
// special triggers to update elements
this.updateMap = new WeakMap(); // callback functions to update styles
// callback functions to update styles
this.clearMap = new WeakMap(); // callback functions to clear styles
// callback functions to clear styles
this.subject = new rxjs.Subject();
this.observeActivations();
}
Object.defineProperty(MediaMarshaller.prototype, "activatedAlias", {
get: /**
* @return {?}
*/
function () {
return this.activatedBreakpoints[0] ? this.activatedBreakpoints[0].alias : '';
},
enumerable: false,
configurable: true
});
/**
* Update styles on breakpoint activates or deactivates
* @param mc
*/
/**
* Update styles on breakpoint activates or deactivates
* @param {?} mc
* @return {?}
*/
MediaMarshaller.prototype.onMediaChange = /**
* Update styles on breakpoint activates or deactivates
* @param {?} mc
* @return {?}
*/
function (mc) {
/** @type {?} */
var bp = this.findByQuery(mc.mediaQuery);
if (bp) {
mc = mergeAlias(mc, bp);
if (mc.matches && this.activatedBreakpoints.indexOf(bp) === -1) {
this.activatedBreakpoints.push(bp);
this.activatedBreakpoints.sort(sortDescendingPriority);
this.updateStyles();
}
else if (!mc.matches && this.activatedBreakpoints.indexOf(bp) !== -1) {
// Remove the breakpoint when it's deactivated
this.activatedBreakpoints.splice(this.activatedBreakpoints.indexOf(bp), 1);
this.activatedBreakpoints.sort(sortDescendingPriority);
this.updateStyles();
}
}
};
/**
* initialize the marshaller with necessary elements for delegation on an element
* @param element
* @param key
* @param updateFn optional callback so that custom bp directives don't have to re-provide this
* @param clearFn optional callback so that custom bp directives don't have to re-provide this
* @param extraTriggers other triggers to force style updates (e.g. layout, directionality, etc)
*/
/**
* initialize the marshaller with necessary elements for delegation on an element
* @param {?} element
* @param {?} key
* @param {?=} updateFn optional callback so that custom bp directives don't have to re-provide this
* @param {?=} clearFn optional callback so that custom bp directives don't have to re-provide this
* @param {?=} extraTriggers other triggers to force style updates (e.g. layout, directionality, etc)
* @return {?}
*/
MediaMarshaller.prototype.init = /**
* initialize the marshaller with necessary elements for delegation on an element
* @param {?} element
* @param {?} key
* @param {?=} updateFn optional callback so that custom bp directives don't have to re-provide this
* @param {?=} clearFn optional callback so that custom bp directives don't have to re-provide this
* @param {?=} extraTriggers other triggers to force style updates (e.g. layout, directionality, etc)
* @return {?}
*/
function (element, key, updateFn, clearFn, extraTriggers) {
if (extraTriggers === void 0) { extraTriggers = []; }
initBuilderMap(this.updateMap, element, key, updateFn);
initBuilderMap(this.clearMap, element, key, clearFn);
this.buildElementKeyMap(element, key);
this.watchExtraTriggers(element, key, extraTriggers);
};
/**
* get the value for an element and key and optionally a given breakpoint
* @param element
* @param key
* @param bp
*/
/**
* get the value for an element and key and optionally a given breakpoint
* @param {?} element
* @param {?} key
* @param {?=} bp
* @return {?}
*/
MediaMarshaller.prototype.getValue = /**
* get the value for an element and key and optionally a given breakpoint
* @param {?} element
* @param {?} key
* @param {?=} bp
* @return {?}
*/
function (element, key, bp) {
/** @type {?} */
var bpMap = this.elementMap.get(element);
if (bpMap) {
/** @type {?} */
var values = bp !== undefined ? bpMap.get(bp) : this.getActivatedValues(bpMap, key);
if (values) {
return values.get(key);
}
}
return undefined;
};
/**
* whether the element has values for a given key
* @param element
* @param key
*/
/**
* whether the element has values for a given key
* @param {?} element
* @param {?} key
* @return {?}
*/
MediaMarshaller.prototype.hasValue = /**
* whether the element has values for a given key
* @param {?} element
* @param {?} key
* @return {?}
*/
function (element, key) {
/** @type {?} */
var bpMap = this.elementMap.get(element);
if (bpMap) {
/** @type {?} */
var values = this.getActivatedValues(bpMap, key);
if (values) {
return values.get(key) !== undefined || false;
}
}
return false;
};
/**
* Set the value for an input on a directive
* @param element the element in question
* @param key the type of the directive (e.g. flex, layout-gap, etc)
* @param bp the breakpoint suffix (empty string = default)
* @param val the value for the breakpoint
*/
/**
* Set the value for an input on a directive
* @param {?} element the element in question
* @param {?} key the type of the directive (e.g. flex, layout-gap, etc)
* @param {?} val the value for the breakpoint
* @param {?} bp the breakpoint suffix (empty string = default)
* @return {?}
*/
MediaMarshaller.prototype.setValue = /**
* Set the value for an input on a directive
* @param {?} element the element in question
* @param {?} key the type of the directive (e.g. flex, layout-gap, etc)
* @param {?} val the value for the breakpoint
* @param {?} bp the breakpoint suffix (empty string = default)
* @return {?}
*/
function (element, key, val, bp) {
/** @type {?} */
var bpMap = this.elementMap.get(element);
if (!bpMap) {
bpMap = new Map().set(bp, new Map().set(key, val));
this.elementMap.set(element, bpMap);
}
else {
/** @type {?} */
var values = (bpMap.get(bp) || new Map()).set(key, val);
bpMap.set(bp, values);
this.elementMap.set(element, bpMap);
}
/** @type {?} */
var value = this.getValue(element, key);
if (value !== undefined) {
this.updateElement(element, key, value);
}
};
/** Track element value changes for a specific key */
/**
* Track element value changes for a specific key
* @param {?} element
* @param {?} key
* @return {?}
*/
MediaMarshaller.prototype.trackValue = /**
* Track element value changes for a specific key
* @param {?} element
* @param {?} key
* @return {?}
*/
function (element, key) {
return this.subject
.asObservable()
.pipe(operators.filter((/**
* @param {?} v
* @return {?}
*/
function (v) { return v.element === element && v.key === key; })));
};
/** update all styles for all elements on the current breakpoint */
/**
* update all styles for all elements on the current breakpoint
* @return {?}
*/
MediaMarshaller.prototype.updateStyles = /**
* update all styles for all elements on the current breakpoint
* @return {?}
*/
function () {
var _this = this;
this.elementMap.forEach((/**
* @param {?} bpMap
* @param {?} el
* @return {?}
*/
function (bpMap, el) {
/** @type {?} */
var keyMap = new Set((/** @type {?} */ (_this.elementKeyMap.get(el))));
/** @type {?} */
var valueMap = _this.getActivatedValues(bpMap);
if (valueMap) {
valueMap.forEach((/**
* @param {?} v
* @param {?} k
* @return {?}
*/
function (v, k) {
_this.updateElement(el, k, v);
keyMap.delete(k);
}));
}
keyMap.forEach((/**
* @param {?} k
* @return {?}
*/
function (k) {
valueMap = _this.getActivatedValues(bpMap, k);
if (valueMap) {
/** @type {?} */
var value = valueMap.get(k);
_this.updateElement(el, k, value);
}
else {
_this.clearElement(el, k);
}
}));
}));
};
/**
* clear the styles for a given element
* @param element
* @param key
*/
/**
* clear the styles for a given element
* @param {?} element
* @param {?} key
* @return {?}
*/
MediaMarshaller.prototype.clearElement = /**
* clear the styles for a given element
* @param {?} element
* @param {?} key
* @return {?}
*/
function (element, key) {
/** @type {?} */
var builders = this.clearMap.get(element);
if (builders) {
/** @type {?} */
var clearFn = (/** @type {?} */ (builders.get(key)));
if (!!clearFn) {
clearFn();
this.subject.next({ element: element, key: key, value: '' });
}
}
};
/**
* update a given element with the activated values for a given key
* @param element
* @param key
* @param value
*/
/**
* update a given element with the activated values for a given key
* @param {?} element
* @param {?} key
* @param {?} value
* @return {?}
*/
MediaMarshaller.prototype.updateElement = /**
* update a given element with the activated values for a given key
* @param {?} element
* @param {?} key
* @param {?} value
* @return {?}
*/
function (element, key, value) {
/** @type {?} */
var builders = this.updateMap.get(element);
if (builders) {
/** @type {?} */
var updateFn = (/** @type {?} */ (builders.get(key)));
if (!!updateFn) {
updateFn(value);
this.subject.next({ element: element, key: key, value: value });
}
}
};
/**
* release all references to a given element
* @param element
*/
/**
* release all references to a given element
* @param {?} element
* @return {?}
*/
MediaMarshaller.prototype.releaseElement = /**
* release all references to a given element
* @param {?} element
* @return {?}
*/
function (element) {
/** @type {?} */
var watcherMap = this.watcherMap.get(element);
if (watcherMap) {
watcherMap.forEach((/**
* @param {?} s
* @return {?}
*/
function (s) { return s.unsubscribe(); }));
this.watcherMap.delete(element);
}
/** @type {?} */
var elementMap = this.elementMap.get(element);
if (elementMap) {
elementMap.forEach((/**
* @param {?} _
* @param {?} s
* @return {?}
*/
function (_, s) { return elementMap.delete(s); }));
this.elementMap.delete(element);
}
};
/**
* trigger an update for a given element and key (e.g. layout)
* @param element
* @param key
*/
/**
* trigger an update for a given element and key (e.g. layout)
* @param {?} element
* @param {?=} key
* @return {?}
*/
MediaMarshaller.prototype.triggerUpdate = /**
* trigger an update for a given element and key (e.g. layout)
* @param {?} element
* @param {?=} key
* @return {?}
*/
function (element, key) {
var _this = this;
/** @type {?} */
var bpMap = this.elementMap.get(element);
if (bpMap) {
/** @type {?} */
var valueMap = this.getActivatedValues(bpMap, key);
if (valueMap) {
if (key) {
this.updateElement(element, key, valueMap.get(key));
}
else {
valueMap.forEach((/**
* @param {?} v
* @param {?} k
* @return {?}
*/
function (v, k) { return _this.updateElement(element, k, v); }));
}
}
}
};
/** Cross-reference for HTMLElement with directive key */
/**
* Cross-reference for HTMLElement with directive key
* @private
* @param {?} element
* @param {?} key
* @return {?}
*/
MediaMarshaller.prototype.buildElementKeyMap = /**
* Cross-reference for HTMLElement with directive key
* @private
* @param {?} element
* @param {?} key
* @return {?}
*/
function (element, key) {
/** @type {?} */
var keyMap = this.elementKeyMap.get(element);
if (!keyMap) {
keyMap = new Set();
this.elementKeyMap.set(element, keyMap);
}
keyMap.add(key);
};
/**
* Other triggers that should force style updates:
* - directionality
* - layout changes
* - mutationobserver updates
*/
/**
* Other triggers that should force style updates:
* - directionality
* - layout changes
* - mutationobserver updates
* @private
* @param {?} element
* @param {?} key
* @param {?} triggers
* @return {?}
*/
MediaMarshaller.prototype.watchExtraTriggers = /**
* Other triggers that should force style updates:
* - directionality
* - layout changes
* - mutationobserver updates
* @private
* @param {?} element
* @param {?} key
* @param {?} triggers
* @return {?}
*/
function (element, key, triggers) {
var _this = this;
if (triggers && triggers.length) {
/** @type {?} */
var watchers = this.watcherMap.get(element);
if (!watchers) {
watchers = new Map();
this.watcherMap.set(element, watchers);
}
/** @type {?} */
var subscription = watchers.get(key);
if (!subscription) {
/** @type {?} */
var newSubscription = rxjs.merge.apply(void 0, triggers).subscribe((/**
* @return {?}
*/
function () {
/** @type {?} */
var currentValue = _this.getValue(element, key);
_this.updateElement(element, key, currentValue);
}));
watchers.set(key, newSubscription);
}
}
};
/** Breakpoint locator by mediaQuery */
/**
* Breakpoint locator by mediaQuery
* @private
* @param {?} query
* @return {?}
*/
MediaMarshaller.prototype.findByQuery = /**
* Breakpoint locator by mediaQuery
* @private
* @param {?} query
* @return {?}
*/
function (query) {
return this.breakpoints.findByQuery(query);
};
/**
* get the fallback breakpoint for a given element, starting with the current breakpoint
* @param bpMap
* @param key
*/
/**
* get the fallback breakpoint for a given element, starting with the current breakpoint
* @private
* @param {?} bpMap
* @param {?=} key
* @return {?}
*/
MediaMarshaller.prototype.getActivatedValues = /**
* get the fallback breakpoint for a given element, starting with the current breakpoint
* @private
* @param {?} bpMap
* @param {?=} key
* @return {?}
*/
function (bpMap, key) {
for (var i = 0; i < this.activatedBreakpoints.length; i++) {
/** @type {?} */
var activatedBp = this.activatedBreakpoints[i];
/** @type {?} */
var valueMap = bpMap.get(activatedBp.alias);
if (valueMap) {
if (key === undefined || (valueMap.has(key) && valueMap.get(key) != null)) {
return valueMap;
}
}
}
/** @type {?} */
var lastHope = bpMap.get('');
return (key === undefined || lastHope && lastHope.has(key)) ? lastHope : undefined;
};
/**
* Watch for mediaQuery breakpoint activations
*/
/**
* Watch for mediaQuery breakpoint activations
* @private
* @return {?}
*/
MediaMarshaller.prototype.observeActivations = /**
* Watch for mediaQuery breakpoint activations
* @private
* @return {?}
*/
function () {
/** @type {?} */
var target = (/** @type {?} */ ((/** @type {?} */ (this))));
/** @type {?} */
var queries = this.breakpoints.items.map((/**
* @param {?} bp
* @return {?}
*/
function (bp) { return bp.mediaQuery; }));
this.matchMedia
.observe(this.hook.withPrintQuery(queries))
.pipe(operators.tap(this.hook.interceptEvents(target)), operators.filter(this.hook.blockPropagation()))
.subscribe(this.onMediaChange.bind(this));
};
/** @nocollapse */ MediaMarshallerprov = core.ɵɵdefineInjectable({ factory: function MediaMarshaller_Factory() { return new MediaMarshaller(core.ɵɵinject(MatchMedia), core.ɵɵinject(BreakPointRegistry), core.ɵɵinject(PrintHook)); }, token: MediaMarshaller, providedIn: "root" });
MediaMarshaller.decorators = [
{ type: core.Injectable, args: [{ providedIn: 'root' },] }
];
/** @nocollapse */
MediaMarshaller.ctorParameters = function () { return [
{ type: MatchMedia },
{ type: BreakPointRegistry },
{ type: PrintHook }
]; };
return MediaMarshaller;
}());
/**
* @param {?} map
* @param {?} element
* @param {?} key
* @param {?=} input
* @return {?}
*/
function initBuilderMap(map$$1, element, key, input) {
if (input !== undefined) {
/** @type {?} */
var oldMap = map$$1.get(element);
if (!oldMap) {
oldMap = new Map();
map$$1.set(element, oldMap);
}
oldMap.set(key, input);
}
}
exportsMatchMedia = MatchMedia;
exportsMockMatchMedia = MockMatchMedia;
exportsMockMatchMediaProvider = MockMatchMediaProvider;
exports.CoreModule = CoreModule;
exports.removeStyles = removeStyles;
exports.BROWSER_PROVIDER = BROWSER_PROVIDER;
exports.CLASS_NAME = CLASS_NAME;
exports.MediaChange = MediaChange;
exports.StylesheetMap = StylesheetMap;
exports.DEFAULT_CONFIG = DEFAULT_CONFIG;
exports.LAYOUT_CONFIG = LAYOUT_CONFIG;
exports.SERVER_TOKEN = SERVER_TOKEN;
exports.BREAKPOINT = BREAKPOINT;
exports.mergeAlias = mergeAlias;
exports.BaseDirective2 = BaseDirective2;
exports.DEFAULT_BREAKPOINTS = DEFAULT_BREAKPOINTS;
exports.ScreenTypes = ScreenTypes;
exports.ORIENTATION_BREAKPOINTS = ORIENTATION_BREAKPOINTS;
exports.BreakPointRegistry = BreakPointRegistry;
exports.BREAKPOINTS = BREAKPOINTS;
exports.MediaObserver = MediaObserver;
exports.MediaTrigger = MediaTrigger;
exports.sortDescendingPriority = sortDescendingPriority;
exports.sortAscendingPriority = sortAscendingPriority;
exports.coerceArray = coerceArray;
exports.StyleUtils = StyleUtils;
exports.StyleBuilder = StyleBuilder;
exports.validateBasis = validateBasis;
exports.MediaMarshaller = MediaMarshaller;
exports.BREAKPOINT_PRINT = BREAKPOINT_PRINT;
exports.PrintHook = PrintHook;
Object.defineProperty(exports, '__esModule', { value: true });
})));
//# sourceMappingURL=flex-layout-core.umd.js.map