UNPKG

31.9 kBJavaScriptView Raw
1import * as i0 from '@angular/core';
2import { Injectable, PLATFORM_ID, Directive, Inject, Input, Optional, Self, SecurityContext, NgModule } from '@angular/core';
3import * as i1 from '@angular/flex-layout/core';
4import { StyleBuilder, BaseDirective2, SERVER_TOKEN, LAYOUT_CONFIG, CoreModule } from '@angular/flex-layout/core';
5import * as i2 from '@angular/common';
6import { isPlatformServer, NgClass, NgStyle } from '@angular/common';
7import { coerceBooleanProperty } from '@angular/cdk/coercion';
8import { takeUntil } from 'rxjs/operators';
9import * as i2$1 from '@angular/platform-browser';
10
11/**
12 * @license
13 * Copyright Google LLC All Rights Reserved.
14 *
15 * Use of this source code is governed by an MIT-style license that can be
16 * found in the LICENSE file at https://angular.io/license
17 */
18class ImgSrcStyleBuilder extends StyleBuilder {
19 buildStyles(url) {
20 return { 'content': url ? `url(${url})` : '' };
21 }
22}
23ImgSrcStyleBuilder.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: ImgSrcStyleBuilder, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
24ImgSrcStyleBuilder.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: ImgSrcStyleBuilder, providedIn: 'root' });
25i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: ImgSrcStyleBuilder, decorators: [{
26 type: Injectable,
27 args: [{ providedIn: 'root' }]
28 }] });
29class ImgSrcDirective extends BaseDirective2 {
30 constructor(elementRef, styleBuilder, styler, marshal, platformId, serverModuleLoaded) {
31 super(elementRef, styleBuilder, styler, marshal);
32 this.platformId = platformId;
33 this.serverModuleLoaded = serverModuleLoaded;
34 this.DIRECTIVE_KEY = 'img-src';
35 this.defaultSrc = '';
36 this.styleCache = imgSrcCache;
37 this.init();
38 this.setValue(this.nativeElement.getAttribute('src') || '', '');
39 if (isPlatformServer(this.platformId) && this.serverModuleLoaded) {
40 this.nativeElement.setAttribute('src', '');
41 }
42 }
43 set src(val) {
44 this.defaultSrc = val;
45 this.setValue(this.defaultSrc, '');
46 }
47 /**
48 * Use the [responsively] activated input value to update
49 * the host img src attribute or assign a default `img.src=''`
50 * if the src has not been defined.
51 *
52 * Do nothing to standard `<img src="">` usages, only when responsive
53 * keys are present do we actually call `setAttribute()`
54 */
55 updateWithValue(value) {
56 const url = value || this.defaultSrc;
57 if (isPlatformServer(this.platformId) && this.serverModuleLoaded) {
58 this.addStyles(url);
59 }
60 else {
61 this.nativeElement.setAttribute('src', url);
62 }
63 }
64}
65ImgSrcDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: ImgSrcDirective, deps: [{ token: i0.ElementRef }, { token: ImgSrcStyleBuilder }, { token: i1.StyleUtils }, { token: i1.MediaMarshaller }, { token: PLATFORM_ID }, { token: SERVER_TOKEN }], target: i0.ɵɵFactoryTarget.Directive });
66ImgSrcDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.0.2", type: ImgSrcDirective, inputs: { src: "src" }, usesInheritance: true, ngImport: i0 });
67i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: ImgSrcDirective, decorators: [{
68 type: Directive
69 }], ctorParameters: function () {
70 return [{ type: i0.ElementRef }, { type: ImgSrcStyleBuilder }, { type: i1.StyleUtils }, { type: i1.MediaMarshaller }, { type: Object, decorators: [{
71 type: Inject,
72 args: [PLATFORM_ID]
73 }] }, { type: undefined, decorators: [{
74 type: Inject,
75 args: [SERVER_TOKEN]
76 }] }];
77 }, propDecorators: { src: [{
78 type: Input,
79 args: ['src']
80 }] } });
81const imgSrcCache = new Map();
82const inputs$3 = [
83 'src.xs', 'src.sm', 'src.md', 'src.lg', 'src.xl',
84 'src.lt-sm', 'src.lt-md', 'src.lt-lg', 'src.lt-xl',
85 'src.gt-xs', 'src.gt-sm', 'src.gt-md', 'src.gt-lg'
86];
87const selector$3 = `
88 img[src.xs], img[src.sm], img[src.md], img[src.lg], img[src.xl],
89 img[src.lt-sm], img[src.lt-md], img[src.lt-lg], img[src.lt-xl],
90 img[src.gt-xs], img[src.gt-sm], img[src.gt-md], img[src.gt-lg]
91`;
92/**
93 * This directive provides a responsive API for the HTML <img> 'src' attribute
94 * and will update the img.src property upon each responsive activation.
95 *
96 * e.g.
97 * <img src="defaultScene.jpg" src.xs="mobileScene.jpg"></img>
98 *
99 * @see https://css-tricks.com/responsive-images-youre-just-changing-resolutions-use-src/
100 */
101class DefaultImgSrcDirective extends ImgSrcDirective {
102 constructor() {
103 super(...arguments);
104 this.inputs = inputs$3;
105 }
106}
107DefaultImgSrcDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: DefaultImgSrcDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive });
108DefaultImgSrcDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.0.2", type: DefaultImgSrcDirective, selector: "\n img[src.xs], img[src.sm], img[src.md], img[src.lg], img[src.xl],\n img[src.lt-sm], img[src.lt-md], img[src.lt-lg], img[src.lt-xl],\n img[src.gt-xs], img[src.gt-sm], img[src.gt-md], img[src.gt-lg]\n", inputs: { "src.xs": "src.xs", "src.sm": "src.sm", "src.md": "src.md", "src.lg": "src.lg", "src.xl": "src.xl", "src.lt-sm": "src.lt-sm", "src.lt-md": "src.lt-md", "src.lt-lg": "src.lt-lg", "src.lt-xl": "src.lt-xl", "src.gt-xs": "src.gt-xs", "src.gt-sm": "src.gt-sm", "src.gt-md": "src.gt-md", "src.gt-lg": "src.gt-lg" }, usesInheritance: true, ngImport: i0 });
109i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: DefaultImgSrcDirective, decorators: [{
110 type: Directive,
111 args: [{ selector: selector$3, inputs: inputs$3 }]
112 }] });
113
114/**
115 * @license
116 * Copyright Google LLC All Rights Reserved.
117 *
118 * Use of this source code is governed by an MIT-style license that can be
119 * found in the LICENSE file at https://angular.io/license
120 */
121class ClassDirective extends BaseDirective2 {
122 constructor(elementRef, styler, marshal, iterableDiffers, keyValueDiffers, renderer2, ngClassInstance) {
123 super(elementRef, null, styler, marshal);
124 this.ngClassInstance = ngClassInstance;
125 this.DIRECTIVE_KEY = 'ngClass';
126 if (!this.ngClassInstance) {
127 // Create an instance NgClass Directive instance only if `ngClass=""` has NOT been defined on
128 // the same host element; since the responsive variations may be defined...
129 this.ngClassInstance = new NgClass(iterableDiffers, keyValueDiffers, elementRef, renderer2);
130 }
131 this.init();
132 this.setValue('', '');
133 }
134 /**
135 * Capture class assignments so we cache the default classes
136 * which are merged with activated styles and used as fallbacks.
137 */
138 set klass(val) {
139 this.ngClassInstance.klass = val;
140 this.setValue(val, '');
141 }
142 updateWithValue(value) {
143 this.ngClassInstance.ngClass = value;
144 this.ngClassInstance.ngDoCheck();
145 }
146 // ******************************************************************
147 // Lifecycle Hooks
148 // ******************************************************************
149 /**
150 * For ChangeDetectionStrategy.onPush and ngOnChanges() updates
151 */
152 ngDoCheck() {
153 this.ngClassInstance.ngDoCheck();
154 }
155}
156ClassDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: ClassDirective, deps: [{ token: i0.ElementRef }, { token: i1.StyleUtils }, { token: i1.MediaMarshaller }, { token: i0.IterableDiffers }, { token: i0.KeyValueDiffers }, { token: i0.Renderer2 }, { token: i2.NgClass, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Directive });
157ClassDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.0.2", type: ClassDirective, inputs: { klass: ["class", "klass"] }, usesInheritance: true, ngImport: i0 });
158i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: ClassDirective, decorators: [{
159 type: Directive
160 }], ctorParameters: function () {
161 return [{ type: i0.ElementRef }, { type: i1.StyleUtils }, { type: i1.MediaMarshaller }, { type: i0.IterableDiffers }, { type: i0.KeyValueDiffers }, { type: i0.Renderer2 }, { type: i2.NgClass, decorators: [{
162 type: Optional
163 }, {
164 type: Self
165 }] }];
166 }, propDecorators: { klass: [{
167 type: Input,
168 args: ['class']
169 }] } });
170const inputs$2 = [
171 'ngClass', 'ngClass.xs', 'ngClass.sm', 'ngClass.md', 'ngClass.lg', 'ngClass.xl',
172 'ngClass.lt-sm', 'ngClass.lt-md', 'ngClass.lt-lg', 'ngClass.lt-xl',
173 'ngClass.gt-xs', 'ngClass.gt-sm', 'ngClass.gt-md', 'ngClass.gt-lg'
174];
175const selector$2 = `
176 [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl],
177 [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl],
178 [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]
179`;
180/**
181 * Directive to add responsive support for ngClass.
182 * This maintains the core functionality of 'ngClass' and adds responsive API
183 * Note: this class is a no-op when rendered on the server
184 */
185class DefaultClassDirective extends ClassDirective {
186 constructor() {
187 super(...arguments);
188 this.inputs = inputs$2;
189 }
190}
191DefaultClassDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: DefaultClassDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive });
192DefaultClassDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.0.2", type: DefaultClassDirective, selector: "\n [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl],\n [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl],\n [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]\n", inputs: { ngClass: "ngClass", "ngClass.xs": "ngClass.xs", "ngClass.sm": "ngClass.sm", "ngClass.md": "ngClass.md", "ngClass.lg": "ngClass.lg", "ngClass.xl": "ngClass.xl", "ngClass.lt-sm": "ngClass.lt-sm", "ngClass.lt-md": "ngClass.lt-md", "ngClass.lt-lg": "ngClass.lt-lg", "ngClass.lt-xl": "ngClass.lt-xl", "ngClass.gt-xs": "ngClass.gt-xs", "ngClass.gt-sm": "ngClass.gt-sm", "ngClass.gt-md": "ngClass.gt-md", "ngClass.gt-lg": "ngClass.gt-lg" }, usesInheritance: true, ngImport: i0 });
193i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: DefaultClassDirective, decorators: [{
194 type: Directive,
195 args: [{ selector: selector$2, inputs: inputs$2 }]
196 }] });
197
198/**
199 * @license
200 * Copyright Google LLC All Rights Reserved.
201 *
202 * Use of this source code is governed by an MIT-style license that can be
203 * found in the LICENSE file at https://angular.io/license
204 */
205class ShowHideStyleBuilder extends StyleBuilder {
206 buildStyles(show, parent) {
207 const shouldShow = show === 'true';
208 return { 'display': shouldShow ? parent.display || (parent.isServer ? 'initial' : '') : 'none' };
209 }
210}
211ShowHideStyleBuilder.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: ShowHideStyleBuilder, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
212ShowHideStyleBuilder.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: ShowHideStyleBuilder, providedIn: 'root' });
213i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: ShowHideStyleBuilder, decorators: [{
214 type: Injectable,
215 args: [{ providedIn: 'root' }]
216 }] });
217class ShowHideDirective extends BaseDirective2 {
218 constructor(elementRef, styleBuilder, styler, marshal, layoutConfig, platformId, serverModuleLoaded) {
219 super(elementRef, styleBuilder, styler, marshal);
220 this.layoutConfig = layoutConfig;
221 this.platformId = platformId;
222 this.serverModuleLoaded = serverModuleLoaded;
223 this.DIRECTIVE_KEY = 'show-hide';
224 /** Original DOM Element CSS display style */
225 this.display = '';
226 this.hasLayout = false;
227 this.hasFlexChild = false;
228 }
229 // *********************************************
230 // Lifecycle Methods
231 // *********************************************
232 ngAfterViewInit() {
233 this.trackExtraTriggers();
234 const children = Array.from(this.nativeElement.children);
235 for (let i = 0; i < children.length; i++) {
236 if (this.marshal.hasValue(children[i], 'flex')) {
237 this.hasFlexChild = true;
238 break;
239 }
240 }
241 if (DISPLAY_MAP.has(this.nativeElement)) {
242 this.display = DISPLAY_MAP.get(this.nativeElement);
243 }
244 else {
245 this.display = this.getDisplayStyle();
246 DISPLAY_MAP.set(this.nativeElement, this.display);
247 }
248 this.init();
249 // set the default to show unless explicitly overridden
250 const defaultValue = this.marshal.getValue(this.nativeElement, this.DIRECTIVE_KEY, '');
251 if (defaultValue === undefined || defaultValue === '') {
252 this.setValue(true, '');
253 }
254 else {
255 this.triggerUpdate();
256 }
257 }
258 /**
259 * On changes to any @Input properties...
260 * Default to use the non-responsive Input value ('fxShow')
261 * Then conditionally override with the mq-activated Input's current value
262 */
263 ngOnChanges(changes) {
264 Object.keys(changes).forEach(key => {
265 if (this.inputs.indexOf(key) !== -1) {
266 const inputKey = key.split('.');
267 const bp = inputKey.slice(1).join('.');
268 const inputValue = changes[key].currentValue;
269 let shouldShow = inputValue !== '' ?
270 inputValue !== 0 ? coerceBooleanProperty(inputValue) : false
271 : true;
272 if (inputKey[0] === 'fxHide') {
273 shouldShow = !shouldShow;
274 }
275 this.setValue(shouldShow, bp);
276 }
277 });
278 }
279 // *********************************************
280 // Protected methods
281 // *********************************************
282 /**
283 * Watch for these extra triggers to update fxShow, fxHide stylings
284 */
285 trackExtraTriggers() {
286 this.hasLayout = this.marshal.hasValue(this.nativeElement, 'layout');
287 ['layout', 'layout-align'].forEach(key => {
288 this.marshal
289 .trackValue(this.nativeElement, key)
290 .pipe(takeUntil(this.destroySubject))
291 .subscribe(this.triggerUpdate.bind(this));
292 });
293 }
294 /**
295 * Override accessor to the current HTMLElement's `display` style
296 * Note: Show/Hide will not change the display to 'flex' but will set it to 'block'
297 * unless it was already explicitly specified inline or in a CSS stylesheet.
298 */
299 getDisplayStyle() {
300 return (this.hasLayout || (this.hasFlexChild && this.layoutConfig.addFlexToParent)) ?
301 'flex' : this.styler.lookupStyle(this.nativeElement, 'display', true);
302 }
303 /** Validate the visibility value and then update the host's inline display style */
304 updateWithValue(value = true) {
305 if (value === '') {
306 return;
307 }
308 const isServer = isPlatformServer(this.platformId);
309 this.addStyles(value ? 'true' : 'false', { display: this.display, isServer });
310 if (isServer && this.serverModuleLoaded) {
311 this.nativeElement.style.setProperty('display', '');
312 }
313 this.marshal.triggerUpdate(this.parentElement, 'layout-gap');
314 }
315}
316ShowHideDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: ShowHideDirective, deps: [{ token: i0.ElementRef }, { token: ShowHideStyleBuilder }, { token: i1.StyleUtils }, { token: i1.MediaMarshaller }, { token: LAYOUT_CONFIG }, { token: PLATFORM_ID }, { token: SERVER_TOKEN }], target: i0.ɵɵFactoryTarget.Directive });
317ShowHideDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.0.2", type: ShowHideDirective, usesInheritance: true, usesOnChanges: true, ngImport: i0 });
318i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: ShowHideDirective, decorators: [{
319 type: Directive
320 }], ctorParameters: function () {
321 return [{ type: i0.ElementRef }, { type: ShowHideStyleBuilder }, { type: i1.StyleUtils }, { type: i1.MediaMarshaller }, { type: undefined, decorators: [{
322 type: Inject,
323 args: [LAYOUT_CONFIG]
324 }] }, { type: Object, decorators: [{
325 type: Inject,
326 args: [PLATFORM_ID]
327 }] }, { type: undefined, decorators: [{
328 type: Inject,
329 args: [SERVER_TOKEN]
330 }] }];
331 } });
332const DISPLAY_MAP = new WeakMap();
333const inputs$1 = [
334 'fxShow', 'fxShow.print',
335 'fxShow.xs', 'fxShow.sm', 'fxShow.md', 'fxShow.lg', 'fxShow.xl',
336 'fxShow.lt-sm', 'fxShow.lt-md', 'fxShow.lt-lg', 'fxShow.lt-xl',
337 'fxShow.gt-xs', 'fxShow.gt-sm', 'fxShow.gt-md', 'fxShow.gt-lg',
338 'fxHide', 'fxHide.print',
339 'fxHide.xs', 'fxHide.sm', 'fxHide.md', 'fxHide.lg', 'fxHide.xl',
340 'fxHide.lt-sm', 'fxHide.lt-md', 'fxHide.lt-lg', 'fxHide.lt-xl',
341 'fxHide.gt-xs', 'fxHide.gt-sm', 'fxHide.gt-md', 'fxHide.gt-lg'
342];
343const selector$1 = `
344 [fxShow], [fxShow.print],
345 [fxShow.xs], [fxShow.sm], [fxShow.md], [fxShow.lg], [fxShow.xl],
346 [fxShow.lt-sm], [fxShow.lt-md], [fxShow.lt-lg], [fxShow.lt-xl],
347 [fxShow.gt-xs], [fxShow.gt-sm], [fxShow.gt-md], [fxShow.gt-lg],
348 [fxHide], [fxHide.print],
349 [fxHide.xs], [fxHide.sm], [fxHide.md], [fxHide.lg], [fxHide.xl],
350 [fxHide.lt-sm], [fxHide.lt-md], [fxHide.lt-lg], [fxHide.lt-xl],
351 [fxHide.gt-xs], [fxHide.gt-sm], [fxHide.gt-md], [fxHide.gt-lg]
352`;
353/**
354 * 'show' Layout API directive
355 */
356class DefaultShowHideDirective extends ShowHideDirective {
357 constructor() {
358 super(...arguments);
359 this.inputs = inputs$1;
360 }
361}
362DefaultShowHideDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: DefaultShowHideDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive });
363DefaultShowHideDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.0.2", type: DefaultShowHideDirective, selector: "\n [fxShow], [fxShow.print],\n [fxShow.xs], [fxShow.sm], [fxShow.md], [fxShow.lg], [fxShow.xl],\n [fxShow.lt-sm], [fxShow.lt-md], [fxShow.lt-lg], [fxShow.lt-xl],\n [fxShow.gt-xs], [fxShow.gt-sm], [fxShow.gt-md], [fxShow.gt-lg],\n [fxHide], [fxHide.print],\n [fxHide.xs], [fxHide.sm], [fxHide.md], [fxHide.lg], [fxHide.xl],\n [fxHide.lt-sm], [fxHide.lt-md], [fxHide.lt-lg], [fxHide.lt-xl],\n [fxHide.gt-xs], [fxHide.gt-sm], [fxHide.gt-md], [fxHide.gt-lg]\n", inputs: { fxShow: "fxShow", "fxShow.print": "fxShow.print", "fxShow.xs": "fxShow.xs", "fxShow.sm": "fxShow.sm", "fxShow.md": "fxShow.md", "fxShow.lg": "fxShow.lg", "fxShow.xl": "fxShow.xl", "fxShow.lt-sm": "fxShow.lt-sm", "fxShow.lt-md": "fxShow.lt-md", "fxShow.lt-lg": "fxShow.lt-lg", "fxShow.lt-xl": "fxShow.lt-xl", "fxShow.gt-xs": "fxShow.gt-xs", "fxShow.gt-sm": "fxShow.gt-sm", "fxShow.gt-md": "fxShow.gt-md", "fxShow.gt-lg": "fxShow.gt-lg", fxHide: "fxHide", "fxHide.print": "fxHide.print", "fxHide.xs": "fxHide.xs", "fxHide.sm": "fxHide.sm", "fxHide.md": "fxHide.md", "fxHide.lg": "fxHide.lg", "fxHide.xl": "fxHide.xl", "fxHide.lt-sm": "fxHide.lt-sm", "fxHide.lt-md": "fxHide.lt-md", "fxHide.lt-lg": "fxHide.lt-lg", "fxHide.lt-xl": "fxHide.lt-xl", "fxHide.gt-xs": "fxHide.gt-xs", "fxHide.gt-sm": "fxHide.gt-sm", "fxHide.gt-md": "fxHide.gt-md", "fxHide.gt-lg": "fxHide.gt-lg" }, usesInheritance: true, ngImport: i0 });
364i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: DefaultShowHideDirective, decorators: [{
365 type: Directive,
366 args: [{ selector: selector$1, inputs: inputs$1 }]
367 }] });
368
369/**
370 * @license
371 * Copyright Google LLC All Rights Reserved.
372 *
373 * Use of this source code is governed by an MIT-style license that can be
374 * found in the LICENSE file at https://angular.io/license
375 */
376/** NgStyle allowed inputs */
377class NgStyleKeyValue {
378 constructor(key, value, noQuotes = true) {
379 this.key = key;
380 this.value = value;
381 this.key = noQuotes ? key.replace(/['"]/g, '').trim() : key.trim();
382 this.value = noQuotes ? value.replace(/['"]/g, '').trim() : value.trim();
383 this.value = this.value.replace(/;/, '');
384 }
385}
386function getType(target) {
387 let what = typeof target;
388 if (what === 'object') {
389 return (target.constructor === Array) ? 'array' :
390 (target.constructor === Set) ? 'set' : 'object';
391 }
392 return what;
393}
394/**
395 * Split string of key:value pairs into Array of k-v pairs
396 * e.g. 'key:value; key:value; key:value;' -> ['key:value',...]
397 */
398function buildRawList(source, delimiter = ';') {
399 return String(source)
400 .trim()
401 .split(delimiter)
402 .map((val) => val.trim())
403 .filter(val => val !== '');
404}
405/** Convert array of key:value strings to a iterable map object */
406function buildMapFromList$1(styles, sanitize) {
407 const sanitizeValue = (it) => {
408 if (sanitize) {
409 it.value = sanitize(it.value);
410 }
411 return it;
412 };
413 return styles
414 .map(stringToKeyValue)
415 .filter(entry => !!entry)
416 .map(sanitizeValue)
417 .reduce(keyValuesToMap, {});
418}
419/** Convert Set<string> or raw Object to an iterable NgStyleMap */
420function buildMapFromSet(source, sanitize) {
421 let list = [];
422 if (getType(source) === 'set') {
423 source.forEach(entry => list.push(entry));
424 }
425 else {
426 Object.keys(source).forEach((key) => {
427 list.push(`${key}:${source[key]}`);
428 });
429 }
430 return buildMapFromList$1(list, sanitize);
431}
432/** Convert 'key:value' -> [key, value] */
433function stringToKeyValue(it) {
434 const [key, ...vals] = it.split(':');
435 return new NgStyleKeyValue(key, vals.join(':'));
436}
437/** Convert [ [key,value] ] -> { key : value } */
438function keyValuesToMap(map, entry) {
439 if (!!entry.key) {
440 map[entry.key] = entry.value;
441 }
442 return map;
443}
444
445/**
446 * @license
447 * Copyright Google LLC All Rights Reserved.
448 *
449 * Use of this source code is governed by an MIT-style license that can be
450 * found in the LICENSE file at https://angular.io/license
451 */
452class StyleDirective extends BaseDirective2 {
453 constructor(elementRef, styler, marshal, sanitizer, differs, renderer2, ngStyleInstance, serverLoaded, platformId) {
454 var _a;
455 super(elementRef, null, styler, marshal);
456 this.sanitizer = sanitizer;
457 this.ngStyleInstance = ngStyleInstance;
458 this.DIRECTIVE_KEY = 'ngStyle';
459 if (!this.ngStyleInstance) {
460 // Create an instance NgStyle Directive instance only if `ngStyle=""` has NOT been
461 // defined on the same host element; since the responsive variations may be defined...
462 this.ngStyleInstance = new NgStyle(elementRef, differs, renderer2);
463 }
464 this.init();
465 const styles = (_a = this.nativeElement.getAttribute('style')) !== null && _a !== void 0 ? _a : '';
466 this.fallbackStyles = this.buildStyleMap(styles);
467 this.isServer = serverLoaded && isPlatformServer(platformId);
468 }
469 /** Add generated styles */
470 updateWithValue(value) {
471 const styles = this.buildStyleMap(value);
472 this.ngStyleInstance.ngStyle = Object.assign(Object.assign({}, this.fallbackStyles), styles);
473 if (this.isServer) {
474 this.applyStyleToElement(styles);
475 }
476 this.ngStyleInstance.ngDoCheck();
477 }
478 /** Remove generated styles */
479 clearStyles() {
480 this.ngStyleInstance.ngStyle = this.fallbackStyles;
481 this.ngStyleInstance.ngDoCheck();
482 }
483 /**
484 * Convert raw strings to ngStyleMap; which is required by ngStyle
485 * NOTE: Raw string key-value pairs MUST be delimited by `;`
486 * Comma-delimiters are not supported due to complexities of
487 * possible style values such as `rgba(x,x,x,x)` and others
488 */
489 buildStyleMap(styles) {
490 // Always safe-guard (aka sanitize) style property values
491 const sanitizer = (val) => { var _a; return (_a = this.sanitizer.sanitize(SecurityContext.STYLE, val)) !== null && _a !== void 0 ? _a : ''; };
492 if (styles) {
493 switch (getType(styles)) {
494 case 'string': return buildMapFromList(buildRawList(styles), sanitizer);
495 case 'array': return buildMapFromList(styles, sanitizer);
496 case 'set': return buildMapFromSet(styles, sanitizer);
497 default: return buildMapFromSet(styles, sanitizer);
498 }
499 }
500 return {};
501 }
502 // ******************************************************************
503 // Lifecycle Hooks
504 // ******************************************************************
505 /** For ChangeDetectionStrategy.onPush and ngOnChanges() updates */
506 ngDoCheck() {
507 this.ngStyleInstance.ngDoCheck();
508 }
509}
510StyleDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: StyleDirective, deps: [{ token: i0.ElementRef }, { token: i1.StyleUtils }, { token: i1.MediaMarshaller }, { token: i2$1.DomSanitizer }, { token: i0.KeyValueDiffers }, { token: i0.Renderer2 }, { token: i2.NgStyle, optional: true, self: true }, { token: SERVER_TOKEN }, { token: PLATFORM_ID }], target: i0.ɵɵFactoryTarget.Directive });
511StyleDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.0.2", type: StyleDirective, usesInheritance: true, ngImport: i0 });
512i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: StyleDirective, decorators: [{
513 type: Directive
514 }], ctorParameters: function () {
515 return [{ type: i0.ElementRef }, { type: i1.StyleUtils }, { type: i1.MediaMarshaller }, { type: i2$1.DomSanitizer }, { type: i0.KeyValueDiffers }, { type: i0.Renderer2 }, { type: i2.NgStyle, decorators: [{
516 type: Optional
517 }, {
518 type: Self
519 }] }, { type: undefined, decorators: [{
520 type: Inject,
521 args: [SERVER_TOKEN]
522 }] }, { type: Object, decorators: [{
523 type: Inject,
524 args: [PLATFORM_ID]
525 }] }];
526 } });
527const inputs = [
528 'ngStyle',
529 'ngStyle.xs', 'ngStyle.sm', 'ngStyle.md', 'ngStyle.lg', 'ngStyle.xl',
530 'ngStyle.lt-sm', 'ngStyle.lt-md', 'ngStyle.lt-lg', 'ngStyle.lt-xl',
531 'ngStyle.gt-xs', 'ngStyle.gt-sm', 'ngStyle.gt-md', 'ngStyle.gt-lg'
532];
533const selector = `
534 [ngStyle],
535 [ngStyle.xs], [ngStyle.sm], [ngStyle.md], [ngStyle.lg], [ngStyle.xl],
536 [ngStyle.lt-sm], [ngStyle.lt-md], [ngStyle.lt-lg], [ngStyle.lt-xl],
537 [ngStyle.gt-xs], [ngStyle.gt-sm], [ngStyle.gt-md], [ngStyle.gt-lg]
538`;
539/**
540 * Directive to add responsive support for ngStyle.
541 *
542 */
543class DefaultStyleDirective extends StyleDirective {
544 constructor() {
545 super(...arguments);
546 this.inputs = inputs;
547 }
548}
549DefaultStyleDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: DefaultStyleDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive });
550DefaultStyleDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.0.2", type: DefaultStyleDirective, selector: "\n [ngStyle],\n [ngStyle.xs], [ngStyle.sm], [ngStyle.md], [ngStyle.lg], [ngStyle.xl],\n [ngStyle.lt-sm], [ngStyle.lt-md], [ngStyle.lt-lg], [ngStyle.lt-xl],\n [ngStyle.gt-xs], [ngStyle.gt-sm], [ngStyle.gt-md], [ngStyle.gt-lg]\n", inputs: { ngStyle: "ngStyle", "ngStyle.xs": "ngStyle.xs", "ngStyle.sm": "ngStyle.sm", "ngStyle.md": "ngStyle.md", "ngStyle.lg": "ngStyle.lg", "ngStyle.xl": "ngStyle.xl", "ngStyle.lt-sm": "ngStyle.lt-sm", "ngStyle.lt-md": "ngStyle.lt-md", "ngStyle.lt-lg": "ngStyle.lt-lg", "ngStyle.lt-xl": "ngStyle.lt-xl", "ngStyle.gt-xs": "ngStyle.gt-xs", "ngStyle.gt-sm": "ngStyle.gt-sm", "ngStyle.gt-md": "ngStyle.gt-md", "ngStyle.gt-lg": "ngStyle.gt-lg" }, usesInheritance: true, ngImport: i0 });
551i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: DefaultStyleDirective, decorators: [{
552 type: Directive,
553 args: [{ selector, inputs }]
554 }] });
555/** Build a styles map from a list of styles, while sanitizing bad values first */
556function buildMapFromList(styles, sanitize) {
557 const sanitizeValue = (it) => {
558 if (sanitize) {
559 it.value = sanitize(it.value);
560 }
561 return it;
562 };
563 return styles
564 .map(stringToKeyValue)
565 .filter(entry => !!entry)
566 .map(sanitizeValue)
567 .reduce(keyValuesToMap, {});
568}
569
570/**
571 * @license
572 * Copyright Google LLC All Rights Reserved.
573 *
574 * Use of this source code is governed by an MIT-style license that can be
575 * found in the LICENSE file at https://angular.io/license
576 */
577const ALL_DIRECTIVES = [
578 DefaultShowHideDirective,
579 DefaultClassDirective,
580 DefaultStyleDirective,
581 DefaultImgSrcDirective,
582];
583/**
584 * *****************************************************************
585 * Define module for the Extended API
586 * *****************************************************************
587 */
588class ExtendedModule {
589}
590ExtendedModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: ExtendedModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
591ExtendedModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: ExtendedModule, declarations: [DefaultShowHideDirective,
592 DefaultClassDirective,
593 DefaultStyleDirective,
594 DefaultImgSrcDirective], imports: [CoreModule], exports: [DefaultShowHideDirective,
595 DefaultClassDirective,
596 DefaultStyleDirective,
597 DefaultImgSrcDirective] });
598ExtendedModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: ExtendedModule, imports: [[CoreModule]] });
599i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: ExtendedModule, decorators: [{
600 type: NgModule,
601 args: [{
602 imports: [CoreModule],
603 declarations: [...ALL_DIRECTIVES],
604 exports: [...ALL_DIRECTIVES]
605 }]
606 }] });
607
608/**
609 * @license
610 * Copyright Google LLC All Rights Reserved.
611 *
612 * Use of this source code is governed by an MIT-style license that can be
613 * found in the LICENSE file at https://angular.io/license
614 */
615
616/**
617 * Generated bundle index. Do not edit.
618 */
619
620export { ClassDirective, DefaultClassDirective, DefaultImgSrcDirective, DefaultShowHideDirective, DefaultStyleDirective, ExtendedModule, ImgSrcDirective, ImgSrcStyleBuilder, ShowHideDirective, ShowHideStyleBuilder, StyleDirective };
621//# sourceMappingURL=angular-flex-layout-extended.mjs.map