1 | import * as i0 from '@angular/core';
|
2 | import { Injectable, PLATFORM_ID, Directive, Inject, Input, Optional, Self, SecurityContext, NgModule } from '@angular/core';
|
3 | import * as i1 from '@angular/flex-layout/core';
|
4 | import { StyleBuilder, BaseDirective2, SERVER_TOKEN, LAYOUT_CONFIG, CoreModule } from '@angular/flex-layout/core';
|
5 | import * as i2 from '@angular/common';
|
6 | import { isPlatformServer, NgClass, NgStyle } from '@angular/common';
|
7 | import { coerceBooleanProperty } from '@angular/cdk/coercion';
|
8 | import { takeUntil } from 'rxjs/operators';
|
9 | import * as i2$1 from '@angular/platform-browser';
|
10 |
|
11 |
|
12 |
|
13 |
|
14 |
|
15 |
|
16 |
|
17 |
|
18 | class ImgSrcStyleBuilder extends StyleBuilder {
|
19 | buildStyles(url) {
|
20 | return { 'content': url ? `url(${url})` : '' };
|
21 | }
|
22 | }
|
23 | ImgSrcStyleBuilder.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: ImgSrcStyleBuilder, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
|
24 | ImgSrcStyleBuilder.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: ImgSrcStyleBuilder, providedIn: 'root' });
|
25 | i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: ImgSrcStyleBuilder, decorators: [{
|
26 | type: Injectable,
|
27 | args: [{ providedIn: 'root' }]
|
28 | }] });
|
29 | class 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 |
|
49 |
|
50 |
|
51 |
|
52 |
|
53 |
|
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 | }
|
65 | ImgSrcDirective.ɵ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 });
|
66 | ImgSrcDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.0.2", type: ImgSrcDirective, inputs: { src: "src" }, usesInheritance: true, ngImport: i0 });
|
67 | i0.ɵɵ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 | }] } });
|
81 | const imgSrcCache = new Map();
|
82 | const 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 | ];
|
87 | const 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 |
|
94 |
|
95 |
|
96 |
|
97 |
|
98 |
|
99 |
|
100 |
|
101 | class DefaultImgSrcDirective extends ImgSrcDirective {
|
102 | constructor() {
|
103 | super(...arguments);
|
104 | this.inputs = inputs$3;
|
105 | }
|
106 | }
|
107 | DefaultImgSrcDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: DefaultImgSrcDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive });
|
108 | DefaultImgSrcDirective.ɵ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 });
|
109 | i0.ɵɵ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 |
|
116 |
|
117 |
|
118 |
|
119 |
|
120 |
|
121 | class 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 |
|
128 |
|
129 | this.ngClassInstance = new NgClass(iterableDiffers, keyValueDiffers, elementRef, renderer2);
|
130 | }
|
131 | this.init();
|
132 | this.setValue('', '');
|
133 | }
|
134 | |
135 |
|
136 |
|
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 |
|
148 |
|
149 | |
150 |
|
151 |
|
152 | ngDoCheck() {
|
153 | this.ngClassInstance.ngDoCheck();
|
154 | }
|
155 | }
|
156 | ClassDirective.ɵ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 });
|
157 | ClassDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.0.2", type: ClassDirective, inputs: { klass: ["class", "klass"] }, usesInheritance: true, ngImport: i0 });
|
158 | i0.ɵɵ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 | }] } });
|
170 | const 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 | ];
|
175 | const 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 |
|
182 |
|
183 |
|
184 |
|
185 | class DefaultClassDirective extends ClassDirective {
|
186 | constructor() {
|
187 | super(...arguments);
|
188 | this.inputs = inputs$2;
|
189 | }
|
190 | }
|
191 | DefaultClassDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: DefaultClassDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive });
|
192 | DefaultClassDirective.ɵ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 });
|
193 | i0.ɵɵ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 |
|
200 |
|
201 |
|
202 |
|
203 |
|
204 |
|
205 | class ShowHideStyleBuilder extends StyleBuilder {
|
206 | buildStyles(show, parent) {
|
207 | const shouldShow = show === 'true';
|
208 | return { 'display': shouldShow ? parent.display || (parent.isServer ? 'initial' : '') : 'none' };
|
209 | }
|
210 | }
|
211 | ShowHideStyleBuilder.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: ShowHideStyleBuilder, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
|
212 | ShowHideStyleBuilder.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: ShowHideStyleBuilder, providedIn: 'root' });
|
213 | i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: ShowHideStyleBuilder, decorators: [{
|
214 | type: Injectable,
|
215 | args: [{ providedIn: 'root' }]
|
216 | }] });
|
217 | class 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 |
|
225 | this.display = '';
|
226 | this.hasLayout = false;
|
227 | this.hasFlexChild = false;
|
228 | }
|
229 |
|
230 |
|
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 |
|
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 |
|
260 |
|
261 |
|
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 |
|
281 |
|
282 | |
283 |
|
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 |
|
296 |
|
297 |
|
298 |
|
299 | getDisplayStyle() {
|
300 | return (this.hasLayout || (this.hasFlexChild && this.layoutConfig.addFlexToParent)) ?
|
301 | 'flex' : this.styler.lookupStyle(this.nativeElement, 'display', true);
|
302 | }
|
303 |
|
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 | }
|
316 | ShowHideDirective.ɵ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 });
|
317 | ShowHideDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.0.2", type: ShowHideDirective, usesInheritance: true, usesOnChanges: true, ngImport: i0 });
|
318 | i0.ɵɵ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 | } });
|
332 | const DISPLAY_MAP = new WeakMap();
|
333 | const 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 | ];
|
343 | const 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 |
|
355 |
|
356 | class DefaultShowHideDirective extends ShowHideDirective {
|
357 | constructor() {
|
358 | super(...arguments);
|
359 | this.inputs = inputs$1;
|
360 | }
|
361 | }
|
362 | DefaultShowHideDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: DefaultShowHideDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive });
|
363 | DefaultShowHideDirective.ɵ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 });
|
364 | i0.ɵɵ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 |
|
371 |
|
372 |
|
373 |
|
374 |
|
375 |
|
376 |
|
377 | class 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 | }
|
386 | function 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 |
|
396 |
|
397 |
|
398 | function buildRawList(source, delimiter = ';') {
|
399 | return String(source)
|
400 | .trim()
|
401 | .split(delimiter)
|
402 | .map((val) => val.trim())
|
403 | .filter(val => val !== '');
|
404 | }
|
405 |
|
406 | function 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 |
|
420 | function 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 |
|
433 | function stringToKeyValue(it) {
|
434 | const [key, ...vals] = it.split(':');
|
435 | return new NgStyleKeyValue(key, vals.join(':'));
|
436 | }
|
437 |
|
438 | function keyValuesToMap(map, entry) {
|
439 | if (!!entry.key) {
|
440 | map[entry.key] = entry.value;
|
441 | }
|
442 | return map;
|
443 | }
|
444 |
|
445 |
|
446 |
|
447 |
|
448 |
|
449 |
|
450 |
|
451 |
|
452 | class 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 |
|
461 |
|
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 |
|
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 |
|
479 | clearStyles() {
|
480 | this.ngStyleInstance.ngStyle = this.fallbackStyles;
|
481 | this.ngStyleInstance.ngDoCheck();
|
482 | }
|
483 | |
484 |
|
485 |
|
486 |
|
487 |
|
488 |
|
489 | buildStyleMap(styles) {
|
490 |
|
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 |
|
504 |
|
505 |
|
506 | ngDoCheck() {
|
507 | this.ngStyleInstance.ngDoCheck();
|
508 | }
|
509 | }
|
510 | StyleDirective.ɵ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 });
|
511 | StyleDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.0.2", type: StyleDirective, usesInheritance: true, ngImport: i0 });
|
512 | i0.ɵɵ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 | } });
|
527 | const 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 | ];
|
533 | const 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 |
|
541 |
|
542 |
|
543 | class DefaultStyleDirective extends StyleDirective {
|
544 | constructor() {
|
545 | super(...arguments);
|
546 | this.inputs = inputs;
|
547 | }
|
548 | }
|
549 | DefaultStyleDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: DefaultStyleDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive });
|
550 | DefaultStyleDirective.ɵ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 });
|
551 | i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: DefaultStyleDirective, decorators: [{
|
552 | type: Directive,
|
553 | args: [{ selector, inputs }]
|
554 | }] });
|
555 |
|
556 | function 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 |
|
572 |
|
573 |
|
574 |
|
575 |
|
576 |
|
577 | const ALL_DIRECTIVES = [
|
578 | DefaultShowHideDirective,
|
579 | DefaultClassDirective,
|
580 | DefaultStyleDirective,
|
581 | DefaultImgSrcDirective,
|
582 | ];
|
583 |
|
584 |
|
585 |
|
586 |
|
587 |
|
588 | class ExtendedModule {
|
589 | }
|
590 | ExtendedModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: ExtendedModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
591 | ExtendedModule.ɵ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] });
|
598 | ExtendedModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: ExtendedModule, imports: [[CoreModule]] });
|
599 | i0.ɵɵ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 |
|
610 |
|
611 |
|
612 |
|
613 |
|
614 |
|
615 |
|
616 |
|
617 |
|
618 |
|
619 |
|
620 | export { ClassDirective, DefaultClassDirective, DefaultImgSrcDirective, DefaultShowHideDirective, DefaultStyleDirective, ExtendedModule, ImgSrcDirective, ImgSrcStyleBuilder, ShowHideDirective, ShowHideStyleBuilder, StyleDirective };
|
621 |
|