ngx-picture - npm Package Compare versions

Comparing version 2.0.8 to 2.0.9

__ivy_ngcc__/bundles/ngx-picture.umd.js

@@ -8,3 +8,3 @@ (function (global, factory) {
 function PictureComponent_picture_0_ng_container_1_source_1_Template(rf, ctx) { if (rf & 1) {
-    ɵngcc0.ɵɵelement(0, "source", 5);
+    ɵngcc0.ɵɵelement(0, "source", 6);
 } if (rf & 2) {
@@ -19,3 +19,3 @@ var breakpoint_r6 = ctx.$implicit;
     ɵngcc0.ɵɵelementContainerStart(0);
-    ɵngcc0.ɵɵtemplate(1, PictureComponent_picture_0_ng_container_1_source_1_Template, 1, 3, "source", 4);
+    ɵngcc0.ɵɵtemplate(1, PictureComponent_picture_0_ng_container_1_source_1_Template, 1, 3, "source", 5);
     ɵngcc0.ɵɵpipe(2, "keyvalue");
@@ -30,3 +30,3 @@ ɵngcc0.ɵɵelementContainerEnd();
     var _r10 = ɵngcc0.ɵɵgetCurrentView();
-    ɵngcc0.ɵɵelementStart(0, "img", 6, 7);
+    ɵngcc0.ɵɵelementStart(0, "img", 7, 8);
     ɵngcc0.ɵɵlistener("load", function PictureComponent_picture_0_ng_template_3_Template_img_load_0_listener($event) { ɵngcc0.ɵɵrestoreView(_r10); var ctx_r9 = ɵngcc0.ɵɵnextContext(2); return ctx_r9.loaded.emit($event); });
@@ -41,6 +41,6 @@ ɵngcc0.ɵɵelementEnd();
 function PictureComponent_picture_0_Template(rf, ctx) { if (rf & 1) {
-    ɵngcc0.ɵɵelementStart(0, "picture");
-    ɵngcc0.ɵɵtemplate(1, PictureComponent_picture_0_ng_container_1_Template, 3, 3, "ng-container", 1);
-    ɵngcc0.ɵɵelementContainer(2, 2);
-    ɵngcc0.ɵɵtemplate(3, PictureComponent_picture_0_ng_template_3_Template, 2, 2, "ng-template", null, 3, ɵngcc0.ɵɵtemplateRefExtractor);
+    ɵngcc0.ɵɵelementStart(0, "picture", 1);
+    ɵngcc0.ɵɵtemplate(1, PictureComponent_picture_0_ng_container_1_Template, 3, 3, "ng-container", 2);
+    ɵngcc0.ɵɵelementContainer(2, 3);
+    ɵngcc0.ɵɵtemplate(3, PictureComponent_picture_0_ng_template_3_Template, 2, 2, "ng-template", null, 4, ɵngcc0.ɵɵtemplateRefExtractor);
     ɵngcc0.ɵɵelementEnd();
@@ -125,6 +125,7 @@ } if (rf & 2) {
     function __awaiter(thisArg, _arguments, P, generator) {
+        function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
         return new (P || (P = Promise))(function (resolve, reject) {
             function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
             function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-            function step(result) { result.done ? resolve(result.value) : new P(function (resolve) { resolve(result.value); }).then(fulfilled, rejected); }
+            function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
             step((generator = generator.apply(thisArg, _arguments || [])).next());
@@ -167,5 +168,5 @@ });
     function __values(o) {
-        var m = typeof Symbol === "function" && o[Symbol.iterator], i = 0;
+        var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
         if (m) return m.call(o);
-        return {
+        if (o && typeof o.length === "number") return {
             next: function () {
@@ -176,2 +177,3 @@ if (o && i >= o.length) o = void 0;
         };
+        throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
     }
@@ -257,2 +259,17 @@
 
+    function __classPrivateFieldGet(receiver, privateMap) {
+        if (!privateMap.has(receiver)) {
+            throw new TypeError("attempted to get private field on non-instance");
+        }
+        return privateMap.get(receiver);
+    }
+
+    function __classPrivateFieldSet(receiver, privateMap, value) {
+        if (!privateMap.has(receiver)) {
+            throw new TypeError("attempted to set private field on non-instance");
+        }
+        privateMap.set(receiver, value);
+        return value;
+    }
+
     var DEFAULT_BREAKPOINTS = {
@@ -378,7 +395,7 @@ '(min-width: 1280px) and (max-width: 1919.99px)': 1280,
         ɵngcc0.ɵɵqueryRefresh(_t = ɵngcc0.ɵɵloadQuery()) && (ctx.imgTemplate = _t.first);
-    } }, inputs: { imageFormats: "imageFormats", breakpoints: "breakpoints", srcInterpolator: "srcInterpolator", src: "src", alt: "alt", lazyLoad: "lazyLoad" }, outputs: { loaded: "loaded" }, decls: 1, vars: 1, consts: [[4, "ngIf"], [4, "ngFor", "ngForOf"], [3, "ngTemplateOutlet", "ngTemplateOutletContext"], ["defaultImageTemplate", ""], [3, "srcset", "media", "type", 4, "ngFor", "ngForOf"], [3, "srcset", "media", "type"], ["loading", "lazy", 3, "src", "alt", "load"], ["img", ""]], template: function PictureComponent_Template(rf, ctx) { if (rf & 1) {
+    } }, inputs: { imageFormats: "imageFormats", breakpoints: "breakpoints", srcInterpolator: "srcInterpolator", src: "src", alt: "alt", lazyLoad: "lazyLoad" }, outputs: { loaded: "loaded" }, decls: 1, vars: 1, consts: [["class", "ngx-picture__picture", 4, "ngIf"], [1, "ngx-picture__picture"], [4, "ngFor", "ngForOf"], [3, "ngTemplateOutlet", "ngTemplateOutletContext"], ["defaultImageTemplate", ""], [3, "srcset", "media", "type", 4, "ngFor", "ngForOf"], [3, "srcset", "media", "type"], ["loading", "lazy", 1, "ngx-picture__picture__img", 3, "src", "alt", "load"], ["img", ""]], template: function PictureComponent_Template(rf, ctx) { if (rf & 1) {
         ɵngcc0.ɵɵtemplate(0, PictureComponent_picture_0_Template, 5, 8, "picture", 0);
     } if (rf & 2) {
         ɵngcc0.ɵɵproperty("ngIf", ctx.show);
-    } }, directives: [ɵngcc1.NgIf, ɵngcc1.NgForOf, ɵngcc1.NgTemplateOutlet], pipes: [ɵngcc1.KeyValuePipe], styles: ["[_nghost-%COMP%]{width:100%;height:inherit;display:block;min-height:1px}picture[_ngcontent-%COMP%], picture[_ngcontent-%COMP%]   img[_ngcontent-%COMP%]{width:100%;height:inherit}"], changeDetection: 0 });
+    } }, directives: [ɵngcc1.NgIf, ɵngcc1.NgForOf, ɵngcc1.NgTemplateOutlet], pipes: [ɵngcc1.KeyValuePipe], styles: ["[_nghost-%COMP%]{width:100%;height:inherit;display:block;min-height:1px}.ngx-picture__picture[_ngcontent-%COMP%], .ngx-picture__picture[_ngcontent-%COMP%]   .ngx-picture__picture__img[_ngcontent-%COMP%]{width:100%;height:inherit}"], changeDetection: 0 });
 /*@__PURE__*/ (function () { ɵngcc0.ɵsetClassMetadata(PictureComponent, [{
@@ -388,5 +405,5 @@ type: core.Component,
                 selector: 'ngx-picture',
-                template: "<picture *ngIf=\"show\">\r\n  <ng-container *ngFor=\"let imageFormat of imageFormats\">\r\n    <source\r\n      *ngFor=\"let breakpoint of breakpoints | keyvalue\"\r\n      [srcset]=\"\r\n        srcInterpolator(src, imageFormat, breakpoint.key, breakpoint.value)\r\n      \"\r\n      [media]=\"breakpoint.key\"\r\n      type=\"image/{{ imageFormat }}\"\r\n    />\r\n  </ng-container>\r\n  <ng-container\r\n    [ngTemplateOutlet]=\"imgTemplate || defaultImageTemplate\"\r\n    [ngTemplateOutletContext]=\"{ $implicit: { src: src, alt: alt } }\"\r\n  >\r\n  </ng-container>\r\n  <ng-template #defaultImageTemplate>\r\n    <img\r\n      [src]=\"src\"\r\n      [alt]=\"alt\"\r\n      (load)=\"loaded.emit($event)\"\r\n      loading=\"lazy\"\r\n      #img\r\n    />\r\n  </ng-template>\r\n</picture>\r\n",
+                template: "<picture class=\"ngx-picture__picture\" *ngIf=\"show\">\r\n  <ng-container *ngFor=\"let imageFormat of imageFormats\">\r\n    <source\r\n      *ngFor=\"let breakpoint of breakpoints | keyvalue\"\r\n      [srcset]=\"\r\n        srcInterpolator(src, imageFormat, breakpoint.key, breakpoint.value)\r\n      \"\r\n      [media]=\"breakpoint.key\"\r\n      type=\"image/{{ imageFormat }}\"\r\n    />\r\n  </ng-container>\r\n  <ng-container\r\n    [ngTemplateOutlet]=\"imgTemplate || defaultImageTemplate\"\r\n    [ngTemplateOutletContext]=\"{ $implicit: { src: src, alt: alt } }\"\r\n  >\r\n  </ng-container>\r\n  <ng-template #defaultImageTemplate>\r\n    <img\r\n      [src]=\"src\"\r\n      [alt]=\"alt\"\r\n      (load)=\"loaded.emit($event)\"\r\n      class=\"ngx-picture__picture__img\"\r\n      loading=\"lazy\"\r\n      #img\r\n    />\r\n  </ng-template>\r\n</picture>\r\n",
                 changeDetection: core.ChangeDetectionStrategy.OnPush,
-                styles: [":host{width:100%;height:inherit;display:block;min-height:1px}picture,picture img{width:100%;height:inherit}"]
+                styles: [":host{width:100%;height:inherit;display:block;min-height:1px}.ngx-picture__picture,.ngx-picture__picture .ngx-picture__picture__img{width:100%;height:inherit}"]
             }]
@@ -393,0 +410,0 @@ }], function () { return [{ type: undefined, decorators: [{

__ivy_ngcc__/fesm5/ngx-picture.js

@@ -11,3 +11,3 @@ import { InjectionToken, EventEmitter, Inject, PLATFORM_ID, Optional, ElementRef, ChangeDetectorRef, ContentChild, Input, Output, Component, ChangeDetectionStrategy, NgModule } from '@angular/core';
 function PictureComponent_picture_0_ng_container_1_source_1_Template(rf, ctx) { if (rf & 1) {
-    ɵngcc0.ɵɵelement(0, "source", 5);
+    ɵngcc0.ɵɵelement(0, "source", 6);
 } if (rf & 2) {
@@ -22,3 +22,3 @@ var breakpoint_r6 = ctx.$implicit;
     ɵngcc0.ɵɵelementContainerStart(0);
-    ɵngcc0.ɵɵtemplate(1, PictureComponent_picture_0_ng_container_1_source_1_Template, 1, 3, "source", 4);
+    ɵngcc0.ɵɵtemplate(1, PictureComponent_picture_0_ng_container_1_source_1_Template, 1, 3, "source", 5);
     ɵngcc0.ɵɵpipe(2, "keyvalue");
@@ -33,3 +33,3 @@ ɵngcc0.ɵɵelementContainerEnd();
     var _r10 = ɵngcc0.ɵɵgetCurrentView();
-    ɵngcc0.ɵɵelementStart(0, "img", 6, 7);
+    ɵngcc0.ɵɵelementStart(0, "img", 7, 8);
     ɵngcc0.ɵɵlistener("load", function PictureComponent_picture_0_ng_template_3_Template_img_load_0_listener($event) { ɵngcc0.ɵɵrestoreView(_r10); var ctx_r9 = ɵngcc0.ɵɵnextContext(2); return ctx_r9.loaded.emit($event); });
@@ -44,6 +44,6 @@ ɵngcc0.ɵɵelementEnd();
 function PictureComponent_picture_0_Template(rf, ctx) { if (rf & 1) {
-    ɵngcc0.ɵɵelementStart(0, "picture");
-    ɵngcc0.ɵɵtemplate(1, PictureComponent_picture_0_ng_container_1_Template, 3, 3, "ng-container", 1);
-    ɵngcc0.ɵɵelementContainer(2, 2);
-    ɵngcc0.ɵɵtemplate(3, PictureComponent_picture_0_ng_template_3_Template, 2, 2, "ng-template", null, 3, ɵngcc0.ɵɵtemplateRefExtractor);
+    ɵngcc0.ɵɵelementStart(0, "picture", 1);
+    ɵngcc0.ɵɵtemplate(1, PictureComponent_picture_0_ng_container_1_Template, 3, 3, "ng-container", 2);
+    ɵngcc0.ɵɵelementContainer(2, 3);
+    ɵngcc0.ɵɵtemplate(3, PictureComponent_picture_0_ng_template_3_Template, 2, 2, "ng-template", null, 4, ɵngcc0.ɵɵtemplateRefExtractor);
     ɵngcc0.ɵɵelementEnd();
@@ -178,7 +178,7 @@ } if (rf & 2) {
         ɵngcc0.ɵɵqueryRefresh(_t = ɵngcc0.ɵɵloadQuery()) && (ctx.imgTemplate = _t.first);
-    } }, inputs: { imageFormats: "imageFormats", breakpoints: "breakpoints", srcInterpolator: "srcInterpolator", src: "src", alt: "alt", lazyLoad: "lazyLoad" }, outputs: { loaded: "loaded" }, decls: 1, vars: 1, consts: [[4, "ngIf"], [4, "ngFor", "ngForOf"], [3, "ngTemplateOutlet", "ngTemplateOutletContext"], ["defaultImageTemplate", ""], [3, "srcset", "media", "type", 4, "ngFor", "ngForOf"], [3, "srcset", "media", "type"], ["loading", "lazy", 3, "src", "alt", "load"], ["img", ""]], template: function PictureComponent_Template(rf, ctx) { if (rf & 1) {
+    } }, inputs: { imageFormats: "imageFormats", breakpoints: "breakpoints", srcInterpolator: "srcInterpolator", src: "src", alt: "alt", lazyLoad: "lazyLoad" }, outputs: { loaded: "loaded" }, decls: 1, vars: 1, consts: [["class", "ngx-picture__picture", 4, "ngIf"], [1, "ngx-picture__picture"], [4, "ngFor", "ngForOf"], [3, "ngTemplateOutlet", "ngTemplateOutletContext"], ["defaultImageTemplate", ""], [3, "srcset", "media", "type", 4, "ngFor", "ngForOf"], [3, "srcset", "media", "type"], ["loading", "lazy", 1, "ngx-picture__picture__img", 3, "src", "alt", "load"], ["img", ""]], template: function PictureComponent_Template(rf, ctx) { if (rf & 1) {
         ɵngcc0.ɵɵtemplate(0, PictureComponent_picture_0_Template, 5, 8, "picture", 0);
     } if (rf & 2) {
         ɵngcc0.ɵɵproperty("ngIf", ctx.show);
-    } }, directives: [ɵngcc1.NgIf, ɵngcc1.NgForOf, ɵngcc1.NgTemplateOutlet], pipes: [ɵngcc1.KeyValuePipe], styles: ["[_nghost-%COMP%]{width:100%;height:inherit;display:block;min-height:1px}picture[_ngcontent-%COMP%], picture[_ngcontent-%COMP%]   img[_ngcontent-%COMP%]{width:100%;height:inherit}"], changeDetection: 0 });
+    } }, directives: [ɵngcc1.NgIf, ɵngcc1.NgForOf, ɵngcc1.NgTemplateOutlet], pipes: [ɵngcc1.KeyValuePipe], styles: ["[_nghost-%COMP%]{width:100%;height:inherit;display:block;min-height:1px}.ngx-picture__picture[_ngcontent-%COMP%], .ngx-picture__picture[_ngcontent-%COMP%]   .ngx-picture__picture__img[_ngcontent-%COMP%]{width:100%;height:inherit}"], changeDetection: 0 });
 /*@__PURE__*/ (function () { ɵngcc0.ɵsetClassMetadata(PictureComponent, [{
@@ -188,5 +188,5 @@ type: Component,
                 selector: 'ngx-picture',
-                template: "<picture *ngIf=\"show\">\r\n  <ng-container *ngFor=\"let imageFormat of imageFormats\">\r\n    <source\r\n      *ngFor=\"let breakpoint of breakpoints | keyvalue\"\r\n      [srcset]=\"\r\n        srcInterpolator(src, imageFormat, breakpoint.key, breakpoint.value)\r\n      \"\r\n      [media]=\"breakpoint.key\"\r\n      type=\"image/{{ imageFormat }}\"\r\n    />\r\n  </ng-container>\r\n  <ng-container\r\n    [ngTemplateOutlet]=\"imgTemplate || defaultImageTemplate\"\r\n    [ngTemplateOutletContext]=\"{ $implicit: { src: src, alt: alt } }\"\r\n  >\r\n  </ng-container>\r\n  <ng-template #defaultImageTemplate>\r\n    <img\r\n      [src]=\"src\"\r\n      [alt]=\"alt\"\r\n      (load)=\"loaded.emit($event)\"\r\n      loading=\"lazy\"\r\n      #img\r\n    />\r\n  </ng-template>\r\n</picture>\r\n",
+                template: "<picture class=\"ngx-picture__picture\" *ngIf=\"show\">\r\n  <ng-container *ngFor=\"let imageFormat of imageFormats\">\r\n    <source\r\n      *ngFor=\"let breakpoint of breakpoints | keyvalue\"\r\n      [srcset]=\"\r\n        srcInterpolator(src, imageFormat, breakpoint.key, breakpoint.value)\r\n      \"\r\n      [media]=\"breakpoint.key\"\r\n      type=\"image/{{ imageFormat }}\"\r\n    />\r\n  </ng-container>\r\n  <ng-container\r\n    [ngTemplateOutlet]=\"imgTemplate || defaultImageTemplate\"\r\n    [ngTemplateOutletContext]=\"{ $implicit: { src: src, alt: alt } }\"\r\n  >\r\n  </ng-container>\r\n  <ng-template #defaultImageTemplate>\r\n    <img\r\n      [src]=\"src\"\r\n      [alt]=\"alt\"\r\n      (load)=\"loaded.emit($event)\"\r\n      class=\"ngx-picture__picture__img\"\r\n      loading=\"lazy\"\r\n      #img\r\n    />\r\n  </ng-template>\r\n</picture>\r\n",
                 changeDetection: ChangeDetectionStrategy.OnPush,
-                styles: [":host{width:100%;height:inherit;display:block;min-height:1px}picture,picture img{width:100%;height:inherit}"]
+                styles: [":host{width:100%;height:inherit;display:block;min-height:1px}.ngx-picture__picture,.ngx-picture__picture .ngx-picture__picture__img{width:100%;height:inherit}"]
             }]
@@ -193,0 +193,0 @@ }], function () { return [{ type: undefined, decorators: [{

bundles/ngx-picture.umd.js

@@ -75,6 +75,7 @@ (function (global, factory) {
     function __awaiter(thisArg, _arguments, P, generator) {
+        function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
         return new (P || (P = Promise))(function (resolve, reject) {
             function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
             function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-            function step(result) { result.done ? resolve(result.value) : new P(function (resolve) { resolve(result.value); }).then(fulfilled, rejected); }
+            function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
             step((generator = generator.apply(thisArg, _arguments || [])).next());
@@ -117,5 +118,5 @@ });
     function __values(o) {
-        var m = typeof Symbol === "function" && o[Symbol.iterator], i = 0;
+        var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
         if (m) return m.call(o);
-        return {
+        if (o && typeof o.length === "number") return {
             next: function () {
@@ -126,2 +127,3 @@ if (o && i >= o.length) o = void 0;
         };
+        throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
     }
@@ -207,2 +209,17 @@
 
+    function __classPrivateFieldGet(receiver, privateMap) {
+        if (!privateMap.has(receiver)) {
+            throw new TypeError("attempted to get private field on non-instance");
+        }
+        return privateMap.get(receiver);
+    }
+
+    function __classPrivateFieldSet(receiver, privateMap, value) {
+        if (!privateMap.has(receiver)) {
+            throw new TypeError("attempted to set private field on non-instance");
+        }
+        privateMap.set(receiver, value);
+        return value;
+    }
+
     var DEFAULT_BREAKPOINTS = {
@@ -321,5 +338,5 @@ '(min-width: 1280px) and (max-width: 1919.99px)': 1280,
                 selector: 'ngx-picture',
-                template: "<picture *ngIf=\"show\">\r\n  <ng-container *ngFor=\"let imageFormat of imageFormats\">\r\n    <source\r\n      *ngFor=\"let breakpoint of breakpoints | keyvalue\"\r\n      [srcset]=\"\r\n        srcInterpolator(src, imageFormat, breakpoint.key, breakpoint.value)\r\n      \"\r\n      [media]=\"breakpoint.key\"\r\n      type=\"image/{{ imageFormat }}\"\r\n    />\r\n  </ng-container>\r\n  <ng-container\r\n    [ngTemplateOutlet]=\"imgTemplate || defaultImageTemplate\"\r\n    [ngTemplateOutletContext]=\"{ $implicit: { src: src, alt: alt } }\"\r\n  >\r\n  </ng-container>\r\n  <ng-template #defaultImageTemplate>\r\n    <img\r\n      [src]=\"src\"\r\n      [alt]=\"alt\"\r\n      (load)=\"loaded.emit($event)\"\r\n      loading=\"lazy\"\r\n      #img\r\n    />\r\n  </ng-template>\r\n</picture>\r\n",
+                template: "<picture class=\"ngx-picture__picture\" *ngIf=\"show\">\r\n  <ng-container *ngFor=\"let imageFormat of imageFormats\">\r\n    <source\r\n      *ngFor=\"let breakpoint of breakpoints | keyvalue\"\r\n      [srcset]=\"\r\n        srcInterpolator(src, imageFormat, breakpoint.key, breakpoint.value)\r\n      \"\r\n      [media]=\"breakpoint.key\"\r\n      type=\"image/{{ imageFormat }}\"\r\n    />\r\n  </ng-container>\r\n  <ng-container\r\n    [ngTemplateOutlet]=\"imgTemplate || defaultImageTemplate\"\r\n    [ngTemplateOutletContext]=\"{ $implicit: { src: src, alt: alt } }\"\r\n  >\r\n  </ng-container>\r\n  <ng-template #defaultImageTemplate>\r\n    <img\r\n      [src]=\"src\"\r\n      [alt]=\"alt\"\r\n      (load)=\"loaded.emit($event)\"\r\n      class=\"ngx-picture__picture__img\"\r\n      loading=\"lazy\"\r\n      #img\r\n    />\r\n  </ng-template>\r\n</picture>\r\n",
                 changeDetection: core.ChangeDetectionStrategy.OnPush,
-                styles: [":host{width:100%;height:inherit;display:block;min-height:1px}picture,picture img{width:100%;height:inherit}"]
+                styles: [":host{width:100%;height:inherit;display:block;min-height:1px}.ngx-picture__picture,.ngx-picture__picture .ngx-picture__picture__img{width:100%;height:inherit}"]
             }),
@@ -326,0 +343,0 @@ __param(0, core.Inject(core.PLATFORM_ID)),

bundles/ngx-picture.umd.min.js

@@ -15,3 +15,3 @@ !function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/core"),require("@angular/common"),require("ngx-window-token")):"function"==typeof define&&define.amd?define("ngx-picture",["exports","@angular/core","@angular/common","ngx-window-token"],t):t((e=e||self)["ngx-picture"]={},e.ng.core,e.ng.common,e.ngxWindowToken)}(this,(function(e,t,n,r){"use strict";
     and limitations under the License.
-    ***************************************************************************** */function o(e,t,n,r){var o,i=arguments.length,a=i<3?t:null===r?r=Object.getOwnPropertyDescriptor(t,n):r;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,n,r);else for(var p=e.length-1;p>=0;p--)(o=e[p])&&(a=(i<3?o(a):i>3?o(t,n,a):o(t,n))||a);return i>3&&a&&Object.defineProperty(t,n,a),a}function i(e,t){return function(n,r){t(n,r,e)}}var a={"(min-width: 1280px) and (max-width: 1919.99px)":1280,"(max-width: 599.99px)":300,"(min-width: 600px) and (max-width: 959.99px)":600,"(min-width: 960px) and (max-width: 1279.99px)":960,"(min-width: 1920px)":1920};function p(e,t,n,r){return""+e.replace("upload/","upload/w_"+r+"/f_"+t+"/")}var s={breakpoints:a,imageFormats:["webp","jpg"],srcInterpolator:p};function c(e,t,n,r){return"https://media.graphcms.com/resize=w:"+r+",fit:scale/output=format:"+("jpeg"===t?"jpg":"webp")+"/"+e.replace("https://media.graphcms.com/","")}var l={breakpoints:a,imageFormats:["webp","jpg"],srcInterpolator:c};function u(e,t,n,r){var o=e.substring(e.lastIndexOf("/"));return""+e.replace(o,"/tr:w-"+r+",f-"+t+o)}var m={breakpoints:a,imageFormats:["webp","jpg"],srcInterpolator:u},g=new t.InjectionToken("NGX_PICTURE_CONFIG"),d=function(){function e(e,n,r,o,i){this.platformId=e,this.ngxPictureConfig=n,this.window=r,this.elementRef=o,this.changeDetectorRef=i,this.imageFormats=this.ngxPictureConfig.imageFormats,this.breakpoints=this.ngxPictureConfig.breakpoints,this.srcInterpolator=this.ngxPictureConfig.srcInterpolator,this.loaded=new t.EventEmitter,this.show=!1}return e.prototype.ngOnInit=function(){n.isPlatformServer(this.platformId)&&(this.show=!0)},e.prototype.ngAfterViewInit=function(){var e=this;this.lazyLoad&&this.window&&"IntersectionObserver"in this.window?(this.intersectionObserver=new IntersectionObserver((function(t){t.find((function(t){return t.isIntersecting&&t.target===e.elementRef.nativeElement}))&&e.showLazyPicture()}),{}),this.intersectionObserver.observe(this.elementRef.nativeElement)):(this.show=!0,this.changeDetectorRef.detectChanges())},e.prototype.showLazyPicture=function(){this.intersectionObserver.unobserve(this.elementRef.nativeElement),this.show=!0,this.changeDetectorRef.detectChanges()},e.ctorParameters=function(){return[{type:void 0,decorators:[{type:t.Inject,args:[t.PLATFORM_ID]}]},{type:void 0,decorators:[{type:t.Inject,args:[g]}]},{type:void 0,decorators:[{type:t.Optional},{type:t.Inject,args:[r.WINDOW]}]},{type:t.ElementRef},{type:t.ChangeDetectorRef}]},o([t.ContentChild("imgTemplate")],e.prototype,"imgTemplate",void 0),o([t.Input()],e.prototype,"src",void 0),o([t.Input()],e.prototype,"imageFormats",void 0),o([t.Input()],e.prototype,"breakpoints",void 0),o([t.Input()],e.prototype,"alt",void 0),o([t.Input()],e.prototype,"lazyLoad",void 0),o([t.Input()],e.prototype,"srcInterpolator",void 0),o([t.Output()],e.prototype,"loaded",void 0),e=o([t.Component({selector:"ngx-picture",template:'<picture *ngIf="show">\r\n  <ng-container *ngFor="let imageFormat of imageFormats">\r\n    <source\r\n      *ngFor="let breakpoint of breakpoints | keyvalue"\r\n      [srcset]="\r\n        srcInterpolator(src, imageFormat, breakpoint.key, breakpoint.value)\r\n      "\r\n      [media]="breakpoint.key"\r\n      type="image/{{ imageFormat }}"\r\n    />\r\n  </ng-container>\r\n  <ng-container\r\n    [ngTemplateOutlet]="imgTemplate || defaultImageTemplate"\r\n    [ngTemplateOutletContext]="{ $implicit: { src: src, alt: alt } }"\r\n  >\r\n  </ng-container>\r\n  <ng-template #defaultImageTemplate>\r\n    <img\r\n      [src]="src"\r\n      [alt]="alt"\r\n      (load)="loaded.emit($event)"\r\n      loading="lazy"\r\n      #img\r\n    />\r\n  </ng-template>\r\n</picture>\r\n',changeDetection:t.ChangeDetectionStrategy.OnPush,styles:[":host{width:100%;height:inherit;display:block;min-height:1px}picture,picture img{width:100%;height:inherit}"]}),i(0,t.Inject(t.PLATFORM_ID)),i(1,t.Inject(g)),i(2,t.Optional()),i(2,t.Inject(r.WINDOW))],e)}(),h=function(){function e(){}var r;return r=e,e.forRoot=function(e){return{ngModule:r,providers:[{provide:g,useValue:e}]}},e=r=o([t.NgModule({declarations:[d],imports:[n.CommonModule],exports:[d],entryComponents:[d]})],e)}();e.CLOUDINARY_CONFIG=s,e.DEFAULT_BREAKPOINTS=a,e.GRAPH_CMS_CONFIG=l,e.IMAGEKIT_CONFIG=m,e.NGX_PICTURE_CONFIG=g,e.NgxPictureModule=h,e.PictureComponent=d,e.cloudinarySrcInterpolator=p,e.graphCmsSrcInterpolator=c,e.imagekitSrcInterpolator=u,Object.defineProperty(e,"__esModule",{value:!0})}));
+    ***************************************************************************** */function o(e,t,n,r){var o,i=arguments.length,a=i<3?t:null===r?r=Object.getOwnPropertyDescriptor(t,n):r;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,n,r);else for(var p=e.length-1;p>=0;p--)(o=e[p])&&(a=(i<3?o(a):i>3?o(t,n,a):o(t,n))||a);return i>3&&a&&Object.defineProperty(t,n,a),a}function i(e,t){return function(n,r){t(n,r,e)}}var a={"(min-width: 1280px) and (max-width: 1919.99px)":1280,"(max-width: 599.99px)":300,"(min-width: 600px) and (max-width: 959.99px)":600,"(min-width: 960px) and (max-width: 1279.99px)":960,"(min-width: 1920px)":1920};function p(e,t,n,r){return""+e.replace("upload/","upload/w_"+r+"/f_"+t+"/")}var c={breakpoints:a,imageFormats:["webp","jpg"],srcInterpolator:p};function s(e,t,n,r){return"https://media.graphcms.com/resize=w:"+r+",fit:scale/output=format:"+("jpeg"===t?"jpg":"webp")+"/"+e.replace("https://media.graphcms.com/","")}var u={breakpoints:a,imageFormats:["webp","jpg"],srcInterpolator:s};function g(e,t,n,r){var o=e.substring(e.lastIndexOf("/"));return""+e.replace(o,"/tr:w-"+r+",f-"+t+o)}var l={breakpoints:a,imageFormats:["webp","jpg"],srcInterpolator:g},m=new t.InjectionToken("NGX_PICTURE_CONFIG"),d=function(){function e(e,n,r,o,i){this.platformId=e,this.ngxPictureConfig=n,this.window=r,this.elementRef=o,this.changeDetectorRef=i,this.imageFormats=this.ngxPictureConfig.imageFormats,this.breakpoints=this.ngxPictureConfig.breakpoints,this.srcInterpolator=this.ngxPictureConfig.srcInterpolator,this.loaded=new t.EventEmitter,this.show=!1}return e.prototype.ngOnInit=function(){n.isPlatformServer(this.platformId)&&(this.show=!0)},e.prototype.ngAfterViewInit=function(){var e=this;this.lazyLoad&&this.window&&"IntersectionObserver"in this.window?(this.intersectionObserver=new IntersectionObserver((function(t){t.find((function(t){return t.isIntersecting&&t.target===e.elementRef.nativeElement}))&&e.showLazyPicture()}),{}),this.intersectionObserver.observe(this.elementRef.nativeElement)):(this.show=!0,this.changeDetectorRef.detectChanges())},e.prototype.showLazyPicture=function(){this.intersectionObserver.unobserve(this.elementRef.nativeElement),this.show=!0,this.changeDetectorRef.detectChanges()},e.ctorParameters=function(){return[{type:void 0,decorators:[{type:t.Inject,args:[t.PLATFORM_ID]}]},{type:void 0,decorators:[{type:t.Inject,args:[m]}]},{type:void 0,decorators:[{type:t.Optional},{type:t.Inject,args:[r.WINDOW]}]},{type:t.ElementRef},{type:t.ChangeDetectorRef}]},o([t.ContentChild("imgTemplate")],e.prototype,"imgTemplate",void 0),o([t.Input()],e.prototype,"src",void 0),o([t.Input()],e.prototype,"imageFormats",void 0),o([t.Input()],e.prototype,"breakpoints",void 0),o([t.Input()],e.prototype,"alt",void 0),o([t.Input()],e.prototype,"lazyLoad",void 0),o([t.Input()],e.prototype,"srcInterpolator",void 0),o([t.Output()],e.prototype,"loaded",void 0),e=o([t.Component({selector:"ngx-picture",template:'<picture class="ngx-picture__picture" *ngIf="show">\r\n  <ng-container *ngFor="let imageFormat of imageFormats">\r\n    <source\r\n      *ngFor="let breakpoint of breakpoints | keyvalue"\r\n      [srcset]="\r\n        srcInterpolator(src, imageFormat, breakpoint.key, breakpoint.value)\r\n      "\r\n      [media]="breakpoint.key"\r\n      type="image/{{ imageFormat }}"\r\n    />\r\n  </ng-container>\r\n  <ng-container\r\n    [ngTemplateOutlet]="imgTemplate || defaultImageTemplate"\r\n    [ngTemplateOutletContext]="{ $implicit: { src: src, alt: alt } }"\r\n  >\r\n  </ng-container>\r\n  <ng-template #defaultImageTemplate>\r\n    <img\r\n      [src]="src"\r\n      [alt]="alt"\r\n      (load)="loaded.emit($event)"\r\n      class="ngx-picture__picture__img"\r\n      loading="lazy"\r\n      #img\r\n    />\r\n  </ng-template>\r\n</picture>\r\n',changeDetection:t.ChangeDetectionStrategy.OnPush,styles:[":host{width:100%;height:inherit;display:block;min-height:1px}.ngx-picture__picture,.ngx-picture__picture .ngx-picture__picture__img{width:100%;height:inherit}"]}),i(0,t.Inject(t.PLATFORM_ID)),i(1,t.Inject(m)),i(2,t.Optional()),i(2,t.Inject(r.WINDOW))],e)}(),h=function(){function e(){}var r;return r=e,e.forRoot=function(e){return{ngModule:r,providers:[{provide:m,useValue:e}]}},e=r=o([t.NgModule({declarations:[d],imports:[n.CommonModule],exports:[d],entryComponents:[d]})],e)}();e.CLOUDINARY_CONFIG=c,e.DEFAULT_BREAKPOINTS=a,e.GRAPH_CMS_CONFIG=u,e.IMAGEKIT_CONFIG=l,e.NGX_PICTURE_CONFIG=m,e.NgxPictureModule=h,e.PictureComponent=d,e.cloudinarySrcInterpolator=p,e.graphCmsSrcInterpolator=s,e.imagekitSrcInterpolator=g,Object.defineProperty(e,"__esModule",{value:!0})}));
 //# sourceMappingURL=ngx-picture.umd.min.js.map

esm2015/lib/picture/picture.component.js

@@ -81,5 +81,5 @@ import { __decorate, __param } from "tslib";
         selector: 'ngx-picture',
-        template: "<picture *ngIf=\"show\">\r\n  <ng-container *ngFor=\"let imageFormat of imageFormats\">\r\n    <source\r\n      *ngFor=\"let breakpoint of breakpoints | keyvalue\"\r\n      [srcset]=\"\r\n        srcInterpolator(src, imageFormat, breakpoint.key, breakpoint.value)\r\n      \"\r\n      [media]=\"breakpoint.key\"\r\n      type=\"image/{{ imageFormat }}\"\r\n    />\r\n  </ng-container>\r\n  <ng-container\r\n    [ngTemplateOutlet]=\"imgTemplate || defaultImageTemplate\"\r\n    [ngTemplateOutletContext]=\"{ $implicit: { src: src, alt: alt } }\"\r\n  >\r\n  </ng-container>\r\n  <ng-template #defaultImageTemplate>\r\n    <img\r\n      [src]=\"src\"\r\n      [alt]=\"alt\"\r\n      (load)=\"loaded.emit($event)\"\r\n      loading=\"lazy\"\r\n      #img\r\n    />\r\n  </ng-template>\r\n</picture>\r\n",
+        template: "<picture class=\"ngx-picture__picture\" *ngIf=\"show\">\r\n  <ng-container *ngFor=\"let imageFormat of imageFormats\">\r\n    <source\r\n      *ngFor=\"let breakpoint of breakpoints | keyvalue\"\r\n      [srcset]=\"\r\n        srcInterpolator(src, imageFormat, breakpoint.key, breakpoint.value)\r\n      \"\r\n      [media]=\"breakpoint.key\"\r\n      type=\"image/{{ imageFormat }}\"\r\n    />\r\n  </ng-container>\r\n  <ng-container\r\n    [ngTemplateOutlet]=\"imgTemplate || defaultImageTemplate\"\r\n    [ngTemplateOutletContext]=\"{ $implicit: { src: src, alt: alt } }\"\r\n  >\r\n  </ng-container>\r\n  <ng-template #defaultImageTemplate>\r\n    <img\r\n      [src]=\"src\"\r\n      [alt]=\"alt\"\r\n      (load)=\"loaded.emit($event)\"\r\n      class=\"ngx-picture__picture__img\"\r\n      loading=\"lazy\"\r\n      #img\r\n    />\r\n  </ng-template>\r\n</picture>\r\n",
         changeDetection: ChangeDetectionStrategy.OnPush,
-        styles: [":host{width:100%;height:inherit;display:block;min-height:1px}picture,picture img{width:100%;height:inherit}"]
+        styles: [":host{width:100%;height:inherit;display:block;min-height:1px}.ngx-picture__picture,.ngx-picture__picture .ngx-picture__picture__img{width:100%;height:inherit}"]
     }),
@@ -91,2 +91,2 @@ __param(0, Inject(PLATFORM_ID)),
 export { PictureComponent };
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicGljdHVyZS5jb21wb25lbnQuanMiLCJzb3VyY2VSb290Ijoibmc6Ly9uZ3gtcGljdHVyZS8iLCJzb3VyY2VzIjpbImxpYi9waWN0dXJlL3BpY3R1cmUuY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEVBQUUsZ0JBQWdCLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQztBQUNuRCxPQUFPLEVBQ0wsYUFBYSxFQUNiLHVCQUF1QixFQUN2QixpQkFBaUIsRUFDakIsU0FBUyxFQUNULFlBQVksRUFDWixVQUFVLEVBQ1YsWUFBWSxFQUNaLE1BQU0sRUFDTixLQUFLLEVBQ0wsTUFBTSxFQUNOLFFBQVEsRUFDUixNQUFNLEVBQ04sV0FBVyxFQUNYLFdBQVcsRUFDWixNQUFNLGVBQWUsQ0FBQztBQUN2QixPQUFPLEVBQUUsTUFBTSxFQUFFLE1BQU0sa0JBQWtCLENBQUM7QUFFMUMsT0FBTyxFQUFFLGtCQUFrQixFQUFFLE1BQU0sNkJBQTZCLENBQUM7QUFvQmpFLElBQWEsZ0JBQWdCLEdBQTdCLE1BQWEsZ0JBQWdCO0lBaUIzQixZQUMrQixVQUFlLEVBQ1IsZ0JBQWtDLEVBQ2xDLE1BQU0sRUFDbEMsVUFBc0IsRUFDdEIsaUJBQW9DO1FBSmYsZUFBVSxHQUFWLFVBQVUsQ0FBSztRQUNSLHFCQUFnQixHQUFoQixnQkFBZ0IsQ0FBa0I7UUFDbEMsV0FBTSxHQUFOLE1BQU0sQ0FBQTtRQUNsQyxlQUFVLEdBQVYsVUFBVSxDQUFZO1FBQ3RCLHNCQUFpQixHQUFqQixpQkFBaUIsQ0FBbUI7UUFqQnJDLGlCQUFZLEdBQUcsSUFBSSxDQUFDLGdCQUFnQixDQUFDLFlBQVksQ0FBQztRQUNsRCxnQkFBVyxHQUFHLElBQUksQ0FBQyxnQkFBZ0IsQ0FBQyxXQUFXLENBQUM7UUFJaEQsb0JBQWUsR0FBRyxJQUFJLENBQUMsZ0JBQWdCLENBQUMsZUFBZSxDQUFDO1FBQ3ZELFdBQU0sR0FBRyxJQUFJLFlBQVksRUFBUyxDQUFDO1FBRTdDLFNBQUksR0FBRyxLQUFLLENBQUM7SUFVVixDQUFDO0lBRUosUUFBUTtRQUNOLElBQUksZ0JBQWdCLENBQUMsSUFBSSxDQUFDLFVBQVUsQ0FBQyxFQUFFO1lBQ3JDLElBQUksQ0FBQyxJQUFJLEdBQUcsSUFBSSxDQUFDO1NBQ2xCO0lBQ0gsQ0FBQztJQUVELGVBQWU7UUFDYixJQUFJLElBQUksQ0FBQyxRQUFRLElBQUksSUFBSSxDQUFDLE1BQU0sSUFBSSxzQkFBc0IsSUFBSSxJQUFJLENBQUMsTUFBTSxFQUFFO1lBQ3pFLElBQUksQ0FBQyxvQkFBb0IsR0FBRyxJQUFJLG9CQUFvQixDQUNsRCxDQUFDLE9BQXlDLEVBQUUsRUFBRTtnQkFDNUMsSUFDRSxPQUFPLENBQUMsSUFBSSxDQUFDLENBQUMsS0FBZ0MsRUFBRSxFQUFFO29CQUNoRCxPQUFPLENBQ0wsS0FBSyxDQUFDLGNBQWM7d0JBQ3BCLEtBQUssQ0FBQyxNQUFNLEtBQUssSUFBSSxDQUFDLFVBQVUsQ0FBQyxhQUFhLENBQy9DLENBQUM7Z0JBQ0osQ0FBQyxDQUFDLEVBQ0Y7b0JBQ0EsSUFBSSxDQUFDLGVBQWUsRUFBRSxDQUFDO2lCQUN4QjtZQUNILENBQUMsRUFDRCxFQUFFLENBQ0gsQ0FBQztZQUVGLElBQUksQ0FBQyxvQkFBb0IsQ0FBQyxPQUFPLENBQUMsSUFBSSxDQUFDLFVBQVUsQ0FBQyxhQUFhLENBQUMsQ0FBQztTQUNsRTthQUFNO1lBQ0wsSUFBSSxDQUFDLElBQUksR0FBRyxJQUFJLENBQUM7WUFDakIsSUFBSSxDQUFDLGlCQUFpQixDQUFDLGFBQWEsRUFBRSxDQUFDO1NBQ3hDO0lBQ0gsQ0FBQztJQUVPLGVBQWU7UUFDckIsSUFBSSxDQUFDLG9CQUFvQixDQUFDLFNBQVMsQ0FBQyxJQUFJLENBQUMsVUFBVSxDQUFDLGFBQWEsQ0FBQyxDQUFDO1FBQ25FLElBQUksQ0FBQyxJQUFJLEdBQUcsSUFBSSxDQUFDO1FBQ2pCLElBQUksQ0FBQyxpQkFBaUIsQ0FBQyxhQUFhLEVBQUUsQ0FBQztJQUN6QyxDQUFDO0NBQ0YsQ0FBQTs7NENBM0NJLE1BQU0sU0FBQyxXQUFXOzRDQUNsQixNQUFNLFNBQUMsa0JBQWtCOzRDQUN6QixRQUFRLFlBQUksTUFBTSxTQUFDLE1BQU07WUFDTixVQUFVO1lBQ0gsaUJBQWlCOztBQXJCakI7SUFBNUIsWUFBWSxDQUFDLGFBQWEsQ0FBQztxREFFMUI7QUFDTztJQUFSLEtBQUssRUFBRTs2Q0FBYTtBQUNaO0lBQVIsS0FBSyxFQUFFO3NEQUFtRDtBQUNsRDtJQUFSLEtBQUssRUFBRTtxREFBaUQ7QUFDaEQ7SUFBUixLQUFLLEVBQUU7NkNBQWE7QUFDWjtJQUFSLEtBQUssRUFBRTtrREFBbUI7QUFFbEI7SUFBUixLQUFLLEVBQUU7eURBQXlEO0FBQ3ZEO0lBQVQsTUFBTSxFQUFFO2dEQUFvQztBQVhsQyxnQkFBZ0I7SUFONUIsU0FBUyxDQUFDO1FBQ1QsUUFBUSxFQUFFLGFBQWE7UUFDdkIsMnlCQUF1QztRQUV2QyxlQUFlLEVBQUUsdUJBQXVCLENBQUMsTUFBTTs7S0FDaEQsQ0FBQztJQW1CRyxXQUFBLE1BQU0sQ0FBQyxXQUFXLENBQUMsQ0FBQTtJQUNuQixXQUFBLE1BQU0sQ0FBQyxrQkFBa0IsQ0FBQyxDQUFBO0lBQzFCLFdBQUEsUUFBUSxFQUFFLENBQUEsRUFBRSxXQUFBLE1BQU0sQ0FBQyxNQUFNLENBQUMsQ0FBQTtHQXBCbEIsZ0JBQWdCLENBNkQ1QjtTQTdEWSxnQkFBZ0IiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBpc1BsYXRmb3JtU2VydmVyIH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJztcclxuaW1wb3J0IHtcclxuICBBZnRlclZpZXdJbml0LFxyXG4gIENoYW5nZURldGVjdGlvblN0cmF0ZWd5LFxyXG4gIENoYW5nZURldGVjdG9yUmVmLFxyXG4gIENvbXBvbmVudCxcclxuICBDb250ZW50Q2hpbGQsXHJcbiAgRWxlbWVudFJlZixcclxuICBFdmVudEVtaXR0ZXIsXHJcbiAgSW5qZWN0LFxyXG4gIElucHV0LFxyXG4gIE9uSW5pdCxcclxuICBPcHRpb25hbCxcclxuICBPdXRwdXQsXHJcbiAgUExBVEZPUk1fSUQsXHJcbiAgVGVtcGxhdGVSZWZcclxufSBmcm9tICdAYW5ndWxhci9jb3JlJztcclxuaW1wb3J0IHsgV0lORE9XIH0gZnJvbSAnbmd4LXdpbmRvdy10b2tlbic7XHJcbmltcG9ydCB7IE5neFBpY3R1cmVDb25maWcgfSBmcm9tICcuLi9uZ3gtcGljdHVyZS1jb25maWcnO1xyXG5pbXBvcnQgeyBOR1hfUElDVFVSRV9DT05GSUcgfSBmcm9tICcuLi9uZ3gtcGljdHVyZS1jb25maWcudG9rZW4nO1xyXG5cclxuZXhwb3J0IHR5cGUgSW1hZ2VGb3JtYXQgPVxyXG4gIHwgJ2FwbmcnXHJcbiAgfCAnYm1wJ1xyXG4gIHwgJ2dpZidcclxuICB8ICdqcGVnJ1xyXG4gIHwgJ3BuZydcclxuICB8ICdzdmcnXHJcbiAgfCAndGlmZidcclxuICB8ICd3ZWJwJ1xyXG4gIHwgJ2pwMidcclxuICB8ICdqeHInO1xyXG5cclxuQENvbXBvbmVudCh7XHJcbiAgc2VsZWN0b3I6ICduZ3gtcGljdHVyZScsXHJcbiAgdGVtcGxhdGVVcmw6ICcuL3BpY3R1cmUuY29tcG9uZW50Lmh0bWwnLFxyXG4gIHN0eWxlVXJsczogWycuL3BpY3R1cmUuY29tcG9uZW50LnNjc3MnXSxcclxuICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaFxyXG59KVxyXG5leHBvcnQgY2xhc3MgUGljdHVyZUNvbXBvbmVudCBpbXBsZW1lbnRzIE9uSW5pdCwgQWZ0ZXJWaWV3SW5pdCB7XHJcbiAgQENvbnRlbnRDaGlsZCgnaW1nVGVtcGxhdGUnKSBpbWdUZW1wbGF0ZTogVGVtcGxhdGVSZWY8XHJcbiAgICBIVE1MSW1hZ2VFbGVtZW50XHJcbiAgPjtcclxuICBASW5wdXQoKSBzcmM6IHN0cmluZztcclxuICBASW5wdXQoKSBpbWFnZUZvcm1hdHMgPSB0aGlzLm5neFBpY3R1cmVDb25maWcuaW1hZ2VGb3JtYXRzO1xyXG4gIEBJbnB1dCgpIGJyZWFrcG9pbnRzID0gdGhpcy5uZ3hQaWN0dXJlQ29uZmlnLmJyZWFrcG9pbnRzO1xyXG4gIEBJbnB1dCgpIGFsdDogc3RyaW5nO1xyXG4gIEBJbnB1dCgpIGxhenlMb2FkOiBib29sZWFuO1xyXG5cclxuICBASW5wdXQoKSBzcmNJbnRlcnBvbGF0b3IgPSB0aGlzLm5neFBpY3R1cmVDb25maWcuc3JjSW50ZXJwb2xhdG9yO1xyXG4gIEBPdXRwdXQoKSBsb2FkZWQgPSBuZXcgRXZlbnRFbWl0dGVyPEV2ZW50PigpO1xyXG5cclxuICBzaG93ID0gZmFsc2U7XHJcblxyXG4gIHByaXZhdGUgaW50ZXJzZWN0aW9uT2JzZXJ2ZXI6IEludGVyc2VjdGlvbk9ic2VydmVyO1xyXG5cclxuICBjb25zdHJ1Y3RvcihcclxuICAgIEBJbmplY3QoUExBVEZPUk1fSUQpIHByaXZhdGUgcGxhdGZvcm1JZDogYW55LFxyXG4gICAgQEluamVjdChOR1hfUElDVFVSRV9DT05GSUcpIHByaXZhdGUgbmd4UGljdHVyZUNvbmZpZzogTmd4UGljdHVyZUNvbmZpZyxcclxuICAgIEBPcHRpb25hbCgpIEBJbmplY3QoV0lORE9XKSBwcml2YXRlIHdpbmRvdyxcclxuICAgIHByaXZhdGUgZWxlbWVudFJlZjogRWxlbWVudFJlZixcclxuICAgIHByaXZhdGUgY2hhbmdlRGV0ZWN0b3JSZWY6IENoYW5nZURldGVjdG9yUmVmXHJcbiAgKSB7fVxyXG5cclxuICBuZ09uSW5pdCgpIHtcclxuICAgIGlmIChpc1BsYXRmb3JtU2VydmVyKHRoaXMucGxhdGZvcm1JZCkpIHtcclxuICAgICAgdGhpcy5zaG93ID0gdHJ1ZTtcclxuICAgIH1cclxuICB9XHJcblxyXG4gIG5nQWZ0ZXJWaWV3SW5pdCgpIHtcclxuICAgIGlmICh0aGlzLmxhenlMb2FkICYmIHRoaXMud2luZG93ICYmICdJbnRlcnNlY3Rpb25PYnNlcnZlcicgaW4gdGhpcy53aW5kb3cpIHtcclxuICAgICAgdGhpcy5pbnRlcnNlY3Rpb25PYnNlcnZlciA9IG5ldyBJbnRlcnNlY3Rpb25PYnNlcnZlcihcclxuICAgICAgICAoZW50cmllczogQXJyYXk8SW50ZXJzZWN0aW9uT2JzZXJ2ZXJFbnRyeT4pID0+IHtcclxuICAgICAgICAgIGlmIChcclxuICAgICAgICAgICAgZW50cmllcy5maW5kKChlbnRyeTogSW50ZXJzZWN0aW9uT2JzZXJ2ZXJFbnRyeSkgPT4ge1xyXG4gICAgICAgICAgICAgIHJldHVybiAoXHJcbiAgICAgICAgICAgICAgICBlbnRyeS5pc0ludGVyc2VjdGluZyAmJlxyXG4gICAgICAgICAgICAgICAgZW50cnkudGFyZ2V0ID09PSB0aGlzLmVsZW1lbnRSZWYubmF0aXZlRWxlbWVudFxyXG4gICAgICAgICAgICAgICk7XHJcbiAgICAgICAgICAgIH0pXHJcbiAgICAgICAgICApIHtcclxuICAgICAgICAgICAgdGhpcy5zaG93TGF6eVBpY3R1cmUoKTtcclxuICAgICAgICAgIH1cclxuICAgICAgICB9LFxyXG4gICAgICAgIHt9XHJcbiAgICAgICk7XHJcblxyXG4gICAgICB0aGlzLmludGVyc2VjdGlvbk9ic2VydmVyLm9ic2VydmUodGhpcy5lbGVtZW50UmVmLm5hdGl2ZUVsZW1lbnQpO1xyXG4gICAgfSBlbHNlIHtcclxuICAgICAgdGhpcy5zaG93ID0gdHJ1ZTtcclxuICAgICAgdGhpcy5jaGFuZ2VEZXRlY3RvclJlZi5kZXRlY3RDaGFuZ2VzKCk7XHJcbiAgICB9XHJcbiAgfVxyXG5cclxuICBwcml2YXRlIHNob3dMYXp5UGljdHVyZSgpIHtcclxuICAgIHRoaXMuaW50ZXJzZWN0aW9uT2JzZXJ2ZXIudW5vYnNlcnZlKHRoaXMuZWxlbWVudFJlZi5uYXRpdmVFbGVtZW50KTtcclxuICAgIHRoaXMuc2hvdyA9IHRydWU7XHJcbiAgICB0aGlzLmNoYW5nZURldGVjdG9yUmVmLmRldGVjdENoYW5nZXMoKTtcclxuICB9XHJcbn1cclxuIl19
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicGljdHVyZS5jb21wb25lbnQuanMiLCJzb3VyY2VSb290Ijoibmc6Ly9uZ3gtcGljdHVyZS8iLCJzb3VyY2VzIjpbImxpYi9waWN0dXJlL3BpY3R1cmUuY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEVBQUUsZ0JBQWdCLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQztBQUNuRCxPQUFPLEVBQ0wsYUFBYSxFQUNiLHVCQUF1QixFQUN2QixpQkFBaUIsRUFDakIsU0FBUyxFQUNULFlBQVksRUFDWixVQUFVLEVBQ1YsWUFBWSxFQUNaLE1BQU0sRUFDTixLQUFLLEVBQ0wsTUFBTSxFQUNOLFFBQVEsRUFDUixNQUFNLEVBQ04sV0FBVyxFQUNYLFdBQVcsRUFDWixNQUFNLGVBQWUsQ0FBQztBQUN2QixPQUFPLEVBQUUsTUFBTSxFQUFFLE1BQU0sa0JBQWtCLENBQUM7QUFFMUMsT0FBTyxFQUFFLGtCQUFrQixFQUFFLE1BQU0sNkJBQTZCLENBQUM7QUFvQmpFLElBQWEsZ0JBQWdCLEdBQTdCLE1BQWEsZ0JBQWdCO0lBaUIzQixZQUMrQixVQUFlLEVBQ1IsZ0JBQWtDLEVBQ2xDLE1BQU0sRUFDbEMsVUFBc0IsRUFDdEIsaUJBQW9DO1FBSmYsZUFBVSxHQUFWLFVBQVUsQ0FBSztRQUNSLHFCQUFnQixHQUFoQixnQkFBZ0IsQ0FBa0I7UUFDbEMsV0FBTSxHQUFOLE1BQU0sQ0FBQTtRQUNsQyxlQUFVLEdBQVYsVUFBVSxDQUFZO1FBQ3RCLHNCQUFpQixHQUFqQixpQkFBaUIsQ0FBbUI7UUFqQnJDLGlCQUFZLEdBQUcsSUFBSSxDQUFDLGdCQUFnQixDQUFDLFlBQVksQ0FBQztRQUNsRCxnQkFBVyxHQUFHLElBQUksQ0FBQyxnQkFBZ0IsQ0FBQyxXQUFXLENBQUM7UUFJaEQsb0JBQWUsR0FBRyxJQUFJLENBQUMsZ0JBQWdCLENBQUMsZUFBZSxDQUFDO1FBQ3ZELFdBQU0sR0FBRyxJQUFJLFlBQVksRUFBUyxDQUFDO1FBRTdDLFNBQUksR0FBRyxLQUFLLENBQUM7SUFVVixDQUFDO0lBRUosUUFBUTtRQUNOLElBQUksZ0JBQWdCLENBQUMsSUFBSSxDQUFDLFVBQVUsQ0FBQyxFQUFFO1lBQ3JDLElBQUksQ0FBQyxJQUFJLEdBQUcsSUFBSSxDQUFDO1NBQ2xCO0lBQ0gsQ0FBQztJQUVELGVBQWU7UUFDYixJQUFJLElBQUksQ0FBQyxRQUFRLElBQUksSUFBSSxDQUFDLE1BQU0sSUFBSSxzQkFBc0IsSUFBSSxJQUFJLENBQUMsTUFBTSxFQUFFO1lBQ3pFLElBQUksQ0FBQyxvQkFBb0IsR0FBRyxJQUFJLG9CQUFvQixDQUNsRCxDQUFDLE9BQXlDLEVBQUUsRUFBRTtnQkFDNUMsSUFDRSxPQUFPLENBQUMsSUFBSSxDQUFDLENBQUMsS0FBZ0MsRUFBRSxFQUFFO29CQUNoRCxPQUFPLENBQ0wsS0FBSyxDQUFDLGNBQWM7d0JBQ3BCLEtBQUssQ0FBQyxNQUFNLEtBQUssSUFBSSxDQUFDLFVBQVUsQ0FBQyxhQUFhLENBQy9DLENBQUM7Z0JBQ0osQ0FBQyxDQUFDLEVBQ0Y7b0JBQ0EsSUFBSSxDQUFDLGVBQWUsRUFBRSxDQUFDO2lCQUN4QjtZQUNILENBQUMsRUFDRCxFQUFFLENBQ0gsQ0FBQztZQUVGLElBQUksQ0FBQyxvQkFBb0IsQ0FBQyxPQUFPLENBQUMsSUFBSSxDQUFDLFVBQVUsQ0FBQyxhQUFhLENBQUMsQ0FBQztTQUNsRTthQUFNO1lBQ0wsSUFBSSxDQUFDLElBQUksR0FBRyxJQUFJLENBQUM7WUFDakIsSUFBSSxDQUFDLGlCQUFpQixDQUFDLGFBQWEsRUFBRSxDQUFDO1NBQ3hDO0lBQ0gsQ0FBQztJQUVPLGVBQWU7UUFDckIsSUFBSSxDQUFDLG9CQUFvQixDQUFDLFNBQVMsQ0FBQyxJQUFJLENBQUMsVUFBVSxDQUFDLGFBQWEsQ0FBQyxDQUFDO1FBQ25FLElBQUksQ0FBQyxJQUFJLEdBQUcsSUFBSSxDQUFDO1FBQ2pCLElBQUksQ0FBQyxpQkFBaUIsQ0FBQyxhQUFhLEVBQUUsQ0FBQztJQUN6QyxDQUFDO0NBQ0YsQ0FBQTs7NENBM0NJLE1BQU0sU0FBQyxXQUFXOzRDQUNsQixNQUFNLFNBQUMsa0JBQWtCOzRDQUN6QixRQUFRLFlBQUksTUFBTSxTQUFDLE1BQU07WUFDTixVQUFVO1lBQ0gsaUJBQWlCOztBQXJCakI7SUFBNUIsWUFBWSxDQUFDLGFBQWEsQ0FBQztxREFFMUI7QUFDTztJQUFSLEtBQUssRUFBRTs2Q0FBYTtBQUNaO0lBQVIsS0FBSyxFQUFFO3NEQUFtRDtBQUNsRDtJQUFSLEtBQUssRUFBRTtxREFBaUQ7QUFDaEQ7SUFBUixLQUFLLEVBQUU7NkNBQWE7QUFDWjtJQUFSLEtBQUssRUFBRTtrREFBbUI7QUFFbEI7SUFBUixLQUFLLEVBQUU7eURBQXlEO0FBQ3ZEO0lBQVQsTUFBTSxFQUFFO2dEQUFvQztBQVhsQyxnQkFBZ0I7SUFONUIsU0FBUyxDQUFDO1FBQ1QsUUFBUSxFQUFFLGFBQWE7UUFDdkIsdTNCQUF1QztRQUV2QyxlQUFlLEVBQUUsdUJBQXVCLENBQUMsTUFBTTs7S0FDaEQsQ0FBQztJQW1CRyxXQUFBLE1BQU0sQ0FBQyxXQUFXLENBQUMsQ0FBQTtJQUNuQixXQUFBLE1BQU0sQ0FBQyxrQkFBa0IsQ0FBQyxDQUFBO0lBQzFCLFdBQUEsUUFBUSxFQUFFLENBQUEsRUFBRSxXQUFBLE1BQU0sQ0FBQyxNQUFNLENBQUMsQ0FBQTtHQXBCbEIsZ0JBQWdCLENBNkQ1QjtTQTdEWSxnQkFBZ0IiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBpc1BsYXRmb3JtU2VydmVyIH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJztcclxuaW1wb3J0IHtcclxuICBBZnRlclZpZXdJbml0LFxyXG4gIENoYW5nZURldGVjdGlvblN0cmF0ZWd5LFxyXG4gIENoYW5nZURldGVjdG9yUmVmLFxyXG4gIENvbXBvbmVudCxcclxuICBDb250ZW50Q2hpbGQsXHJcbiAgRWxlbWVudFJlZixcclxuICBFdmVudEVtaXR0ZXIsXHJcbiAgSW5qZWN0LFxyXG4gIElucHV0LFxyXG4gIE9uSW5pdCxcclxuICBPcHRpb25hbCxcclxuICBPdXRwdXQsXHJcbiAgUExBVEZPUk1fSUQsXHJcbiAgVGVtcGxhdGVSZWZcclxufSBmcm9tICdAYW5ndWxhci9jb3JlJztcclxuaW1wb3J0IHsgV0lORE9XIH0gZnJvbSAnbmd4LXdpbmRvdy10b2tlbic7XHJcbmltcG9ydCB7IE5neFBpY3R1cmVDb25maWcgfSBmcm9tICcuLi9uZ3gtcGljdHVyZS1jb25maWcnO1xyXG5pbXBvcnQgeyBOR1hfUElDVFVSRV9DT05GSUcgfSBmcm9tICcuLi9uZ3gtcGljdHVyZS1jb25maWcudG9rZW4nO1xyXG5cclxuZXhwb3J0IHR5cGUgSW1hZ2VGb3JtYXQgPVxyXG4gIHwgJ2FwbmcnXHJcbiAgfCAnYm1wJ1xyXG4gIHwgJ2dpZidcclxuICB8ICdqcGVnJ1xyXG4gIHwgJ3BuZydcclxuICB8ICdzdmcnXHJcbiAgfCAndGlmZidcclxuICB8ICd3ZWJwJ1xyXG4gIHwgJ2pwMidcclxuICB8ICdqeHInO1xyXG5cclxuQENvbXBvbmVudCh7XHJcbiAgc2VsZWN0b3I6ICduZ3gtcGljdHVyZScsXHJcbiAgdGVtcGxhdGVVcmw6ICcuL3BpY3R1cmUuY29tcG9uZW50Lmh0bWwnLFxyXG4gIHN0eWxlVXJsczogWycuL3BpY3R1cmUuY29tcG9uZW50LnNjc3MnXSxcclxuICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaFxyXG59KVxyXG5leHBvcnQgY2xhc3MgUGljdHVyZUNvbXBvbmVudCBpbXBsZW1lbnRzIE9uSW5pdCwgQWZ0ZXJWaWV3SW5pdCB7XHJcbiAgQENvbnRlbnRDaGlsZCgnaW1nVGVtcGxhdGUnKSBpbWdUZW1wbGF0ZTogVGVtcGxhdGVSZWY8XHJcbiAgICBIVE1MSW1hZ2VFbGVtZW50XHJcbiAgPjtcclxuICBASW5wdXQoKSBzcmM6IHN0cmluZztcclxuICBASW5wdXQoKSBpbWFnZUZvcm1hdHMgPSB0aGlzLm5neFBpY3R1cmVDb25maWcuaW1hZ2VGb3JtYXRzO1xyXG4gIEBJbnB1dCgpIGJyZWFrcG9pbnRzID0gdGhpcy5uZ3hQaWN0dXJlQ29uZmlnLmJyZWFrcG9pbnRzO1xyXG4gIEBJbnB1dCgpIGFsdDogc3RyaW5nO1xyXG4gIEBJbnB1dCgpIGxhenlMb2FkOiBib29sZWFuO1xyXG5cclxuICBASW5wdXQoKSBzcmNJbnRlcnBvbGF0b3IgPSB0aGlzLm5neFBpY3R1cmVDb25maWcuc3JjSW50ZXJwb2xhdG9yO1xyXG4gIEBPdXRwdXQoKSBsb2FkZWQgPSBuZXcgRXZlbnRFbWl0dGVyPEV2ZW50PigpO1xyXG5cclxuICBzaG93ID0gZmFsc2U7XHJcblxyXG4gIHByaXZhdGUgaW50ZXJzZWN0aW9uT2JzZXJ2ZXI6IEludGVyc2VjdGlvbk9ic2VydmVyO1xyXG5cclxuICBjb25zdHJ1Y3RvcihcclxuICAgIEBJbmplY3QoUExBVEZPUk1fSUQpIHByaXZhdGUgcGxhdGZvcm1JZDogYW55LFxyXG4gICAgQEluamVjdChOR1hfUElDVFVSRV9DT05GSUcpIHByaXZhdGUgbmd4UGljdHVyZUNvbmZpZzogTmd4UGljdHVyZUNvbmZpZyxcclxuICAgIEBPcHRpb25hbCgpIEBJbmplY3QoV0lORE9XKSBwcml2YXRlIHdpbmRvdyxcclxuICAgIHByaXZhdGUgZWxlbWVudFJlZjogRWxlbWVudFJlZixcclxuICAgIHByaXZhdGUgY2hhbmdlRGV0ZWN0b3JSZWY6IENoYW5nZURldGVjdG9yUmVmXHJcbiAgKSB7fVxyXG5cclxuICBuZ09uSW5pdCgpIHtcclxuICAgIGlmIChpc1BsYXRmb3JtU2VydmVyKHRoaXMucGxhdGZvcm1JZCkpIHtcclxuICAgICAgdGhpcy5zaG93ID0gdHJ1ZTtcclxuICAgIH1cclxuICB9XHJcblxyXG4gIG5nQWZ0ZXJWaWV3SW5pdCgpIHtcclxuICAgIGlmICh0aGlzLmxhenlMb2FkICYmIHRoaXMud2luZG93ICYmICdJbnRlcnNlY3Rpb25PYnNlcnZlcicgaW4gdGhpcy53aW5kb3cpIHtcclxuICAgICAgdGhpcy5pbnRlcnNlY3Rpb25PYnNlcnZlciA9IG5ldyBJbnRlcnNlY3Rpb25PYnNlcnZlcihcclxuICAgICAgICAoZW50cmllczogQXJyYXk8SW50ZXJzZWN0aW9uT2JzZXJ2ZXJFbnRyeT4pID0+IHtcclxuICAgICAgICAgIGlmIChcclxuICAgICAgICAgICAgZW50cmllcy5maW5kKChlbnRyeTogSW50ZXJzZWN0aW9uT2JzZXJ2ZXJFbnRyeSkgPT4ge1xyXG4gICAgICAgICAgICAgIHJldHVybiAoXHJcbiAgICAgICAgICAgICAgICBlbnRyeS5pc0ludGVyc2VjdGluZyAmJlxyXG4gICAgICAgICAgICAgICAgZW50cnkudGFyZ2V0ID09PSB0aGlzLmVsZW1lbnRSZWYubmF0aXZlRWxlbWVudFxyXG4gICAgICAgICAgICAgICk7XHJcbiAgICAgICAgICAgIH0pXHJcbiAgICAgICAgICApIHtcclxuICAgICAgICAgICAgdGhpcy5zaG93TGF6eVBpY3R1cmUoKTtcclxuICAgICAgICAgIH1cclxuICAgICAgICB9LFxyXG4gICAgICAgIHt9XHJcbiAgICAgICk7XHJcblxyXG4gICAgICB0aGlzLmludGVyc2VjdGlvbk9ic2VydmVyLm9ic2VydmUodGhpcy5lbGVtZW50UmVmLm5hdGl2ZUVsZW1lbnQpO1xyXG4gICAgfSBlbHNlIHtcclxuICAgICAgdGhpcy5zaG93ID0gdHJ1ZTtcclxuICAgICAgdGhpcy5jaGFuZ2VEZXRlY3RvclJlZi5kZXRlY3RDaGFuZ2VzKCk7XHJcbiAgICB9XHJcbiAgfVxyXG5cclxuICBwcml2YXRlIHNob3dMYXp5UGljdHVyZSgpIHtcclxuICAgIHRoaXMuaW50ZXJzZWN0aW9uT2JzZXJ2ZXIudW5vYnNlcnZlKHRoaXMuZWxlbWVudFJlZi5uYXRpdmVFbGVtZW50KTtcclxuICAgIHRoaXMuc2hvdyA9IHRydWU7XHJcbiAgICB0aGlzLmNoYW5nZURldGVjdG9yUmVmLmRldGVjdENoYW5nZXMoKTtcclxuICB9XHJcbn1cclxuIl19

esm5/lib/picture/picture.component.js

@@ -81,5 +81,5 @@ import { __decorate, __param } from "tslib";
             selector: 'ngx-picture',
-            template: "<picture *ngIf=\"show\">\r\n  <ng-container *ngFor=\"let imageFormat of imageFormats\">\r\n    <source\r\n      *ngFor=\"let breakpoint of breakpoints | keyvalue\"\r\n      [srcset]=\"\r\n        srcInterpolator(src, imageFormat, breakpoint.key, breakpoint.value)\r\n      \"\r\n      [media]=\"breakpoint.key\"\r\n      type=\"image/{{ imageFormat }}\"\r\n    />\r\n  </ng-container>\r\n  <ng-container\r\n    [ngTemplateOutlet]=\"imgTemplate || defaultImageTemplate\"\r\n    [ngTemplateOutletContext]=\"{ $implicit: { src: src, alt: alt } }\"\r\n  >\r\n  </ng-container>\r\n  <ng-template #defaultImageTemplate>\r\n    <img\r\n      [src]=\"src\"\r\n      [alt]=\"alt\"\r\n      (load)=\"loaded.emit($event)\"\r\n      loading=\"lazy\"\r\n      #img\r\n    />\r\n  </ng-template>\r\n</picture>\r\n",
+            template: "<picture class=\"ngx-picture__picture\" *ngIf=\"show\">\r\n  <ng-container *ngFor=\"let imageFormat of imageFormats\">\r\n    <source\r\n      *ngFor=\"let breakpoint of breakpoints | keyvalue\"\r\n      [srcset]=\"\r\n        srcInterpolator(src, imageFormat, breakpoint.key, breakpoint.value)\r\n      \"\r\n      [media]=\"breakpoint.key\"\r\n      type=\"image/{{ imageFormat }}\"\r\n    />\r\n  </ng-container>\r\n  <ng-container\r\n    [ngTemplateOutlet]=\"imgTemplate || defaultImageTemplate\"\r\n    [ngTemplateOutletContext]=\"{ $implicit: { src: src, alt: alt } }\"\r\n  >\r\n  </ng-container>\r\n  <ng-template #defaultImageTemplate>\r\n    <img\r\n      [src]=\"src\"\r\n      [alt]=\"alt\"\r\n      (load)=\"loaded.emit($event)\"\r\n      class=\"ngx-picture__picture__img\"\r\n      loading=\"lazy\"\r\n      #img\r\n    />\r\n  </ng-template>\r\n</picture>\r\n",
             changeDetection: ChangeDetectionStrategy.OnPush,
-            styles: [":host{width:100%;height:inherit;display:block;min-height:1px}picture,picture img{width:100%;height:inherit}"]
+            styles: [":host{width:100%;height:inherit;display:block;min-height:1px}.ngx-picture__picture,.ngx-picture__picture .ngx-picture__picture__img{width:100%;height:inherit}"]
         }),
@@ -93,2 +93,2 @@ __param(0, Inject(PLATFORM_ID)),
 export { PictureComponent };
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicGljdHVyZS5jb21wb25lbnQuanMiLCJzb3VyY2VSb290Ijoibmc6Ly9uZ3gtcGljdHVyZS8iLCJzb3VyY2VzIjpbImxpYi9waWN0dXJlL3BpY3R1cmUuY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEVBQUUsZ0JBQWdCLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQztBQUNuRCxPQUFPLEVBQ0wsYUFBYSxFQUNiLHVCQUF1QixFQUN2QixpQkFBaUIsRUFDakIsU0FBUyxFQUNULFlBQVksRUFDWixVQUFVLEVBQ1YsWUFBWSxFQUNaLE1BQU0sRUFDTixLQUFLLEVBQ0wsTUFBTSxFQUNOLFFBQVEsRUFDUixNQUFNLEVBQ04sV0FBVyxFQUNYLFdBQVcsRUFDWixNQUFNLGVBQWUsQ0FBQztBQUN2QixPQUFPLEVBQUUsTUFBTSxFQUFFLE1BQU0sa0JBQWtCLENBQUM7QUFFMUMsT0FBTyxFQUFFLGtCQUFrQixFQUFFLE1BQU0sNkJBQTZCLENBQUM7QUFvQmpFO0lBaUJFLDBCQUMrQixVQUFlLEVBQ1IsZ0JBQWtDLEVBQ2xDLE1BQU0sRUFDbEMsVUFBc0IsRUFDdEIsaUJBQW9DO1FBSmYsZUFBVSxHQUFWLFVBQVUsQ0FBSztRQUNSLHFCQUFnQixHQUFoQixnQkFBZ0IsQ0FBa0I7UUFDbEMsV0FBTSxHQUFOLE1BQU0sQ0FBQTtRQUNsQyxlQUFVLEdBQVYsVUFBVSxDQUFZO1FBQ3RCLHNCQUFpQixHQUFqQixpQkFBaUIsQ0FBbUI7UUFqQnJDLGlCQUFZLEdBQUcsSUFBSSxDQUFDLGdCQUFnQixDQUFDLFlBQVksQ0FBQztRQUNsRCxnQkFBVyxHQUFHLElBQUksQ0FBQyxnQkFBZ0IsQ0FBQyxXQUFXLENBQUM7UUFJaEQsb0JBQWUsR0FBRyxJQUFJLENBQUMsZ0JBQWdCLENBQUMsZUFBZSxDQUFDO1FBQ3ZELFdBQU0sR0FBRyxJQUFJLFlBQVksRUFBUyxDQUFDO1FBRTdDLFNBQUksR0FBRyxLQUFLLENBQUM7SUFVVixDQUFDO0lBRUosbUNBQVEsR0FBUjtRQUNFLElBQUksZ0JBQWdCLENBQUMsSUFBSSxDQUFDLFVBQVUsQ0FBQyxFQUFFO1lBQ3JDLElBQUksQ0FBQyxJQUFJLEdBQUcsSUFBSSxDQUFDO1NBQ2xCO0lBQ0gsQ0FBQztJQUVELDBDQUFlLEdBQWY7UUFBQSxpQkF1QkM7UUF0QkMsSUFBSSxJQUFJLENBQUMsUUFBUSxJQUFJLElBQUksQ0FBQyxNQUFNLElBQUksc0JBQXNCLElBQUksSUFBSSxDQUFDLE1BQU0sRUFBRTtZQUN6RSxJQUFJLENBQUMsb0JBQW9CLEdBQUcsSUFBSSxvQkFBb0IsQ0FDbEQsVUFBQyxPQUF5QztnQkFDeEMsSUFDRSxPQUFPLENBQUMsSUFBSSxDQUFDLFVBQUMsS0FBZ0M7b0JBQzVDLE9BQU8sQ0FDTCxLQUFLLENBQUMsY0FBYzt3QkFDcEIsS0FBSyxDQUFDLE1BQU0sS0FBSyxLQUFJLENBQUMsVUFBVSxDQUFDLGFBQWEsQ0FDL0MsQ0FBQztnQkFDSixDQUFDLENBQUMsRUFDRjtvQkFDQSxLQUFJLENBQUMsZUFBZSxFQUFFLENBQUM7aUJBQ3hCO1lBQ0gsQ0FBQyxFQUNELEVBQUUsQ0FDSCxDQUFDO1lBRUYsSUFBSSxDQUFDLG9CQUFvQixDQUFDLE9BQU8sQ0FBQyxJQUFJLENBQUMsVUFBVSxDQUFDLGFBQWEsQ0FBQyxDQUFDO1NBQ2xFO2FBQU07WUFDTCxJQUFJLENBQUMsSUFBSSxHQUFHLElBQUksQ0FBQztZQUNqQixJQUFJLENBQUMsaUJBQWlCLENBQUMsYUFBYSxFQUFFLENBQUM7U0FDeEM7SUFDSCxDQUFDO0lBRU8sMENBQWUsR0FBdkI7UUFDRSxJQUFJLENBQUMsb0JBQW9CLENBQUMsU0FBUyxDQUFDLElBQUksQ0FBQyxVQUFVLENBQUMsYUFBYSxDQUFDLENBQUM7UUFDbkUsSUFBSSxDQUFDLElBQUksR0FBRyxJQUFJLENBQUM7UUFDakIsSUFBSSxDQUFDLGlCQUFpQixDQUFDLGFBQWEsRUFBRSxDQUFDO0lBQ3pDLENBQUM7O2dEQTFDRSxNQUFNLFNBQUMsV0FBVztnREFDbEIsTUFBTSxTQUFDLGtCQUFrQjtnREFDekIsUUFBUSxZQUFJLE1BQU0sU0FBQyxNQUFNO2dCQUNOLFVBQVU7Z0JBQ0gsaUJBQWlCOztJQXJCakI7UUFBNUIsWUFBWSxDQUFDLGFBQWEsQ0FBQzt5REFFMUI7SUFDTztRQUFSLEtBQUssRUFBRTtpREFBYTtJQUNaO1FBQVIsS0FBSyxFQUFFOzBEQUFtRDtJQUNsRDtRQUFSLEtBQUssRUFBRTt5REFBaUQ7SUFDaEQ7UUFBUixLQUFLLEVBQUU7aURBQWE7SUFDWjtRQUFSLEtBQUssRUFBRTtzREFBbUI7SUFFbEI7UUFBUixLQUFLLEVBQUU7NkRBQXlEO0lBQ3ZEO1FBQVQsTUFBTSxFQUFFO29EQUFvQztJQVhsQyxnQkFBZ0I7UUFONUIsU0FBUyxDQUFDO1lBQ1QsUUFBUSxFQUFFLGFBQWE7WUFDdkIsMnlCQUF1QztZQUV2QyxlQUFlLEVBQUUsdUJBQXVCLENBQUMsTUFBTTs7U0FDaEQsQ0FBQztRQW1CRyxXQUFBLE1BQU0sQ0FBQyxXQUFXLENBQUMsQ0FBQTtRQUNuQixXQUFBLE1BQU0sQ0FBQyxrQkFBa0IsQ0FBQyxDQUFBO1FBQzFCLFdBQUEsUUFBUSxFQUFFLENBQUEsRUFBRSxXQUFBLE1BQU0sQ0FBQyxNQUFNLENBQUMsQ0FBQTtPQXBCbEIsZ0JBQWdCLENBNkQ1QjtJQUFELHVCQUFDO0NBQUEsQUE3REQsSUE2REM7U0E3RFksZ0JBQWdCIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgaXNQbGF0Zm9ybVNlcnZlciB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbic7XHJcbmltcG9ydCB7XHJcbiAgQWZ0ZXJWaWV3SW5pdCxcclxuICBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSxcclxuICBDaGFuZ2VEZXRlY3RvclJlZixcclxuICBDb21wb25lbnQsXHJcbiAgQ29udGVudENoaWxkLFxyXG4gIEVsZW1lbnRSZWYsXHJcbiAgRXZlbnRFbWl0dGVyLFxyXG4gIEluamVjdCxcclxuICBJbnB1dCxcclxuICBPbkluaXQsXHJcbiAgT3B0aW9uYWwsXHJcbiAgT3V0cHV0LFxyXG4gIFBMQVRGT1JNX0lELFxyXG4gIFRlbXBsYXRlUmVmXHJcbn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCB7IFdJTkRPVyB9IGZyb20gJ25neC13aW5kb3ctdG9rZW4nO1xyXG5pbXBvcnQgeyBOZ3hQaWN0dXJlQ29uZmlnIH0gZnJvbSAnLi4vbmd4LXBpY3R1cmUtY29uZmlnJztcclxuaW1wb3J0IHsgTkdYX1BJQ1RVUkVfQ09ORklHIH0gZnJvbSAnLi4vbmd4LXBpY3R1cmUtY29uZmlnLnRva2VuJztcclxuXHJcbmV4cG9ydCB0eXBlIEltYWdlRm9ybWF0ID1cclxuICB8ICdhcG5nJ1xyXG4gIHwgJ2JtcCdcclxuICB8ICdnaWYnXHJcbiAgfCAnanBlZydcclxuICB8ICdwbmcnXHJcbiAgfCAnc3ZnJ1xyXG4gIHwgJ3RpZmYnXHJcbiAgfCAnd2VicCdcclxuICB8ICdqcDInXHJcbiAgfCAnanhyJztcclxuXHJcbkBDb21wb25lbnQoe1xyXG4gIHNlbGVjdG9yOiAnbmd4LXBpY3R1cmUnLFxyXG4gIHRlbXBsYXRlVXJsOiAnLi9waWN0dXJlLmNvbXBvbmVudC5odG1sJyxcclxuICBzdHlsZVVybHM6IFsnLi9waWN0dXJlLmNvbXBvbmVudC5zY3NzJ10sXHJcbiAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2hcclxufSlcclxuZXhwb3J0IGNsYXNzIFBpY3R1cmVDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQsIEFmdGVyVmlld0luaXQge1xyXG4gIEBDb250ZW50Q2hpbGQoJ2ltZ1RlbXBsYXRlJykgaW1nVGVtcGxhdGU6IFRlbXBsYXRlUmVmPFxyXG4gICAgSFRNTEltYWdlRWxlbWVudFxyXG4gID47XHJcbiAgQElucHV0KCkgc3JjOiBzdHJpbmc7XHJcbiAgQElucHV0KCkgaW1hZ2VGb3JtYXRzID0gdGhpcy5uZ3hQaWN0dXJlQ29uZmlnLmltYWdlRm9ybWF0cztcclxuICBASW5wdXQoKSBicmVha3BvaW50cyA9IHRoaXMubmd4UGljdHVyZUNvbmZpZy5icmVha3BvaW50cztcclxuICBASW5wdXQoKSBhbHQ6IHN0cmluZztcclxuICBASW5wdXQoKSBsYXp5TG9hZDogYm9vbGVhbjtcclxuXHJcbiAgQElucHV0KCkgc3JjSW50ZXJwb2xhdG9yID0gdGhpcy5uZ3hQaWN0dXJlQ29uZmlnLnNyY0ludGVycG9sYXRvcjtcclxuICBAT3V0cHV0KCkgbG9hZGVkID0gbmV3IEV2ZW50RW1pdHRlcjxFdmVudD4oKTtcclxuXHJcbiAgc2hvdyA9IGZhbHNlO1xyXG5cclxuICBwcml2YXRlIGludGVyc2VjdGlvbk9ic2VydmVyOiBJbnRlcnNlY3Rpb25PYnNlcnZlcjtcclxuXHJcbiAgY29uc3RydWN0b3IoXHJcbiAgICBASW5qZWN0KFBMQVRGT1JNX0lEKSBwcml2YXRlIHBsYXRmb3JtSWQ6IGFueSxcclxuICAgIEBJbmplY3QoTkdYX1BJQ1RVUkVfQ09ORklHKSBwcml2YXRlIG5neFBpY3R1cmVDb25maWc6IE5neFBpY3R1cmVDb25maWcsXHJcbiAgICBAT3B0aW9uYWwoKSBASW5qZWN0KFdJTkRPVykgcHJpdmF0ZSB3aW5kb3csXHJcbiAgICBwcml2YXRlIGVsZW1lbnRSZWY6IEVsZW1lbnRSZWYsXHJcbiAgICBwcml2YXRlIGNoYW5nZURldGVjdG9yUmVmOiBDaGFuZ2VEZXRlY3RvclJlZlxyXG4gICkge31cclxuXHJcbiAgbmdPbkluaXQoKSB7XHJcbiAgICBpZiAoaXNQbGF0Zm9ybVNlcnZlcih0aGlzLnBsYXRmb3JtSWQpKSB7XHJcbiAgICAgIHRoaXMuc2hvdyA9IHRydWU7XHJcbiAgICB9XHJcbiAgfVxyXG5cclxuICBuZ0FmdGVyVmlld0luaXQoKSB7XHJcbiAgICBpZiAodGhpcy5sYXp5TG9hZCAmJiB0aGlzLndpbmRvdyAmJiAnSW50ZXJzZWN0aW9uT2JzZXJ2ZXInIGluIHRoaXMud2luZG93KSB7XHJcbiAgICAgIHRoaXMuaW50ZXJzZWN0aW9uT2JzZXJ2ZXIgPSBuZXcgSW50ZXJzZWN0aW9uT2JzZXJ2ZXIoXHJcbiAgICAgICAgKGVudHJpZXM6IEFycmF5PEludGVyc2VjdGlvbk9ic2VydmVyRW50cnk+KSA9PiB7XHJcbiAgICAgICAgICBpZiAoXHJcbiAgICAgICAgICAgIGVudHJpZXMuZmluZCgoZW50cnk6IEludGVyc2VjdGlvbk9ic2VydmVyRW50cnkpID0+IHtcclxuICAgICAgICAgICAgICByZXR1cm4gKFxyXG4gICAgICAgICAgICAgICAgZW50cnkuaXNJbnRlcnNlY3RpbmcgJiZcclxuICAgICAgICAgICAgICAgIGVudHJ5LnRhcmdldCA9PT0gdGhpcy5lbGVtZW50UmVmLm5hdGl2ZUVsZW1lbnRcclxuICAgICAgICAgICAgICApO1xyXG4gICAgICAgICAgICB9KVxyXG4gICAgICAgICAgKSB7XHJcbiAgICAgICAgICAgIHRoaXMuc2hvd0xhenlQaWN0dXJlKCk7XHJcbiAgICAgICAgICB9XHJcbiAgICAgICAgfSxcclxuICAgICAgICB7fVxyXG4gICAgICApO1xyXG5cclxuICAgICAgdGhpcy5pbnRlcnNlY3Rpb25PYnNlcnZlci5vYnNlcnZlKHRoaXMuZWxlbWVudFJlZi5uYXRpdmVFbGVtZW50KTtcclxuICAgIH0gZWxzZSB7XHJcbiAgICAgIHRoaXMuc2hvdyA9IHRydWU7XHJcbiAgICAgIHRoaXMuY2hhbmdlRGV0ZWN0b3JSZWYuZGV0ZWN0Q2hhbmdlcygpO1xyXG4gICAgfVxyXG4gIH1cclxuXHJcbiAgcHJpdmF0ZSBzaG93TGF6eVBpY3R1cmUoKSB7XHJcbiAgICB0aGlzLmludGVyc2VjdGlvbk9ic2VydmVyLnVub2JzZXJ2ZSh0aGlzLmVsZW1lbnRSZWYubmF0aXZlRWxlbWVudCk7XHJcbiAgICB0aGlzLnNob3cgPSB0cnVlO1xyXG4gICAgdGhpcy5jaGFuZ2VEZXRlY3RvclJlZi5kZXRlY3RDaGFuZ2VzKCk7XHJcbiAgfVxyXG59XHJcbiJdfQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicGljdHVyZS5jb21wb25lbnQuanMiLCJzb3VyY2VSb290Ijoibmc6Ly9uZ3gtcGljdHVyZS8iLCJzb3VyY2VzIjpbImxpYi9waWN0dXJlL3BpY3R1cmUuY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEVBQUUsZ0JBQWdCLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQztBQUNuRCxPQUFPLEVBQ0wsYUFBYSxFQUNiLHVCQUF1QixFQUN2QixpQkFBaUIsRUFDakIsU0FBUyxFQUNULFlBQVksRUFDWixVQUFVLEVBQ1YsWUFBWSxFQUNaLE1BQU0sRUFDTixLQUFLLEVBQ0wsTUFBTSxFQUNOLFFBQVEsRUFDUixNQUFNLEVBQ04sV0FBVyxFQUNYLFdBQVcsRUFDWixNQUFNLGVBQWUsQ0FBQztBQUN2QixPQUFPLEVBQUUsTUFBTSxFQUFFLE1BQU0sa0JBQWtCLENBQUM7QUFFMUMsT0FBTyxFQUFFLGtCQUFrQixFQUFFLE1BQU0sNkJBQTZCLENBQUM7QUFvQmpFO0lBaUJFLDBCQUMrQixVQUFlLEVBQ1IsZ0JBQWtDLEVBQ2xDLE1BQU0sRUFDbEMsVUFBc0IsRUFDdEIsaUJBQW9DO1FBSmYsZUFBVSxHQUFWLFVBQVUsQ0FBSztRQUNSLHFCQUFnQixHQUFoQixnQkFBZ0IsQ0FBa0I7UUFDbEMsV0FBTSxHQUFOLE1BQU0sQ0FBQTtRQUNsQyxlQUFVLEdBQVYsVUFBVSxDQUFZO1FBQ3RCLHNCQUFpQixHQUFqQixpQkFBaUIsQ0FBbUI7UUFqQnJDLGlCQUFZLEdBQUcsSUFBSSxDQUFDLGdCQUFnQixDQUFDLFlBQVksQ0FBQztRQUNsRCxnQkFBVyxHQUFHLElBQUksQ0FBQyxnQkFBZ0IsQ0FBQyxXQUFXLENBQUM7UUFJaEQsb0JBQWUsR0FBRyxJQUFJLENBQUMsZ0JBQWdCLENBQUMsZUFBZSxDQUFDO1FBQ3ZELFdBQU0sR0FBRyxJQUFJLFlBQVksRUFBUyxDQUFDO1FBRTdDLFNBQUksR0FBRyxLQUFLLENBQUM7SUFVVixDQUFDO0lBRUosbUNBQVEsR0FBUjtRQUNFLElBQUksZ0JBQWdCLENBQUMsSUFBSSxDQUFDLFVBQVUsQ0FBQyxFQUFFO1lBQ3JDLElBQUksQ0FBQyxJQUFJLEdBQUcsSUFBSSxDQUFDO1NBQ2xCO0lBQ0gsQ0FBQztJQUVELDBDQUFlLEdBQWY7UUFBQSxpQkF1QkM7UUF0QkMsSUFBSSxJQUFJLENBQUMsUUFBUSxJQUFJLElBQUksQ0FBQyxNQUFNLElBQUksc0JBQXNCLElBQUksSUFBSSxDQUFDLE1BQU0sRUFBRTtZQUN6RSxJQUFJLENBQUMsb0JBQW9CLEdBQUcsSUFBSSxvQkFBb0IsQ0FDbEQsVUFBQyxPQUF5QztnQkFDeEMsSUFDRSxPQUFPLENBQUMsSUFBSSxDQUFDLFVBQUMsS0FBZ0M7b0JBQzVDLE9BQU8sQ0FDTCxLQUFLLENBQUMsY0FBYzt3QkFDcEIsS0FBSyxDQUFDLE1BQU0sS0FBSyxLQUFJLENBQUMsVUFBVSxDQUFDLGFBQWEsQ0FDL0MsQ0FBQztnQkFDSixDQUFDLENBQUMsRUFDRjtvQkFDQSxLQUFJLENBQUMsZUFBZSxFQUFFLENBQUM7aUJBQ3hCO1lBQ0gsQ0FBQyxFQUNELEVBQUUsQ0FDSCxDQUFDO1lBRUYsSUFBSSxDQUFDLG9CQUFvQixDQUFDLE9BQU8sQ0FBQyxJQUFJLENBQUMsVUFBVSxDQUFDLGFBQWEsQ0FBQyxDQUFDO1NBQ2xFO2FBQU07WUFDTCxJQUFJLENBQUMsSUFBSSxHQUFHLElBQUksQ0FBQztZQUNqQixJQUFJLENBQUMsaUJBQWlCLENBQUMsYUFBYSxFQUFFLENBQUM7U0FDeEM7SUFDSCxDQUFDO0lBRU8sMENBQWUsR0FBdkI7UUFDRSxJQUFJLENBQUMsb0JBQW9CLENBQUMsU0FBUyxDQUFDLElBQUksQ0FBQyxVQUFVLENBQUMsYUFBYSxDQUFDLENBQUM7UUFDbkUsSUFBSSxDQUFDLElBQUksR0FBRyxJQUFJLENBQUM7UUFDakIsSUFBSSxDQUFDLGlCQUFpQixDQUFDLGFBQWEsRUFBRSxDQUFDO0lBQ3pDLENBQUM7O2dEQTFDRSxNQUFNLFNBQUMsV0FBVztnREFDbEIsTUFBTSxTQUFDLGtCQUFrQjtnREFDekIsUUFBUSxZQUFJLE1BQU0sU0FBQyxNQUFNO2dCQUNOLFVBQVU7Z0JBQ0gsaUJBQWlCOztJQXJCakI7UUFBNUIsWUFBWSxDQUFDLGFBQWEsQ0FBQzt5REFFMUI7SUFDTztRQUFSLEtBQUssRUFBRTtpREFBYTtJQUNaO1FBQVIsS0FBSyxFQUFFOzBEQUFtRDtJQUNsRDtRQUFSLEtBQUssRUFBRTt5REFBaUQ7SUFDaEQ7UUFBUixLQUFLLEVBQUU7aURBQWE7SUFDWjtRQUFSLEtBQUssRUFBRTtzREFBbUI7SUFFbEI7UUFBUixLQUFLLEVBQUU7NkRBQXlEO0lBQ3ZEO1FBQVQsTUFBTSxFQUFFO29EQUFvQztJQVhsQyxnQkFBZ0I7UUFONUIsU0FBUyxDQUFDO1lBQ1QsUUFBUSxFQUFFLGFBQWE7WUFDdkIsdTNCQUF1QztZQUV2QyxlQUFlLEVBQUUsdUJBQXVCLENBQUMsTUFBTTs7U0FDaEQsQ0FBQztRQW1CRyxXQUFBLE1BQU0sQ0FBQyxXQUFXLENBQUMsQ0FBQTtRQUNuQixXQUFBLE1BQU0sQ0FBQyxrQkFBa0IsQ0FBQyxDQUFBO1FBQzFCLFdBQUEsUUFBUSxFQUFFLENBQUEsRUFBRSxXQUFBLE1BQU0sQ0FBQyxNQUFNLENBQUMsQ0FBQTtPQXBCbEIsZ0JBQWdCLENBNkQ1QjtJQUFELHVCQUFDO0NBQUEsQUE3REQsSUE2REM7U0E3RFksZ0JBQWdCIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgaXNQbGF0Zm9ybVNlcnZlciB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbic7XHJcbmltcG9ydCB7XHJcbiAgQWZ0ZXJWaWV3SW5pdCxcclxuICBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSxcclxuICBDaGFuZ2VEZXRlY3RvclJlZixcclxuICBDb21wb25lbnQsXHJcbiAgQ29udGVudENoaWxkLFxyXG4gIEVsZW1lbnRSZWYsXHJcbiAgRXZlbnRFbWl0dGVyLFxyXG4gIEluamVjdCxcclxuICBJbnB1dCxcclxuICBPbkluaXQsXHJcbiAgT3B0aW9uYWwsXHJcbiAgT3V0cHV0LFxyXG4gIFBMQVRGT1JNX0lELFxyXG4gIFRlbXBsYXRlUmVmXHJcbn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCB7IFdJTkRPVyB9IGZyb20gJ25neC13aW5kb3ctdG9rZW4nO1xyXG5pbXBvcnQgeyBOZ3hQaWN0dXJlQ29uZmlnIH0gZnJvbSAnLi4vbmd4LXBpY3R1cmUtY29uZmlnJztcclxuaW1wb3J0IHsgTkdYX1BJQ1RVUkVfQ09ORklHIH0gZnJvbSAnLi4vbmd4LXBpY3R1cmUtY29uZmlnLnRva2VuJztcclxuXHJcbmV4cG9ydCB0eXBlIEltYWdlRm9ybWF0ID1cclxuICB8ICdhcG5nJ1xyXG4gIHwgJ2JtcCdcclxuICB8ICdnaWYnXHJcbiAgfCAnanBlZydcclxuICB8ICdwbmcnXHJcbiAgfCAnc3ZnJ1xyXG4gIHwgJ3RpZmYnXHJcbiAgfCAnd2VicCdcclxuICB8ICdqcDInXHJcbiAgfCAnanhyJztcclxuXHJcbkBDb21wb25lbnQoe1xyXG4gIHNlbGVjdG9yOiAnbmd4LXBpY3R1cmUnLFxyXG4gIHRlbXBsYXRlVXJsOiAnLi9waWN0dXJlLmNvbXBvbmVudC5odG1sJyxcclxuICBzdHlsZVVybHM6IFsnLi9waWN0dXJlLmNvbXBvbmVudC5zY3NzJ10sXHJcbiAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2hcclxufSlcclxuZXhwb3J0IGNsYXNzIFBpY3R1cmVDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQsIEFmdGVyVmlld0luaXQge1xyXG4gIEBDb250ZW50Q2hpbGQoJ2ltZ1RlbXBsYXRlJykgaW1nVGVtcGxhdGU6IFRlbXBsYXRlUmVmPFxyXG4gICAgSFRNTEltYWdlRWxlbWVudFxyXG4gID47XHJcbiAgQElucHV0KCkgc3JjOiBzdHJpbmc7XHJcbiAgQElucHV0KCkgaW1hZ2VGb3JtYXRzID0gdGhpcy5uZ3hQaWN0dXJlQ29uZmlnLmltYWdlRm9ybWF0cztcclxuICBASW5wdXQoKSBicmVha3BvaW50cyA9IHRoaXMubmd4UGljdHVyZUNvbmZpZy5icmVha3BvaW50cztcclxuICBASW5wdXQoKSBhbHQ6IHN0cmluZztcclxuICBASW5wdXQoKSBsYXp5TG9hZDogYm9vbGVhbjtcclxuXHJcbiAgQElucHV0KCkgc3JjSW50ZXJwb2xhdG9yID0gdGhpcy5uZ3hQaWN0dXJlQ29uZmlnLnNyY0ludGVycG9sYXRvcjtcclxuICBAT3V0cHV0KCkgbG9hZGVkID0gbmV3IEV2ZW50RW1pdHRlcjxFdmVudD4oKTtcclxuXHJcbiAgc2hvdyA9IGZhbHNlO1xyXG5cclxuICBwcml2YXRlIGludGVyc2VjdGlvbk9ic2VydmVyOiBJbnRlcnNlY3Rpb25PYnNlcnZlcjtcclxuXHJcbiAgY29uc3RydWN0b3IoXHJcbiAgICBASW5qZWN0KFBMQVRGT1JNX0lEKSBwcml2YXRlIHBsYXRmb3JtSWQ6IGFueSxcclxuICAgIEBJbmplY3QoTkdYX1BJQ1RVUkVfQ09ORklHKSBwcml2YXRlIG5neFBpY3R1cmVDb25maWc6IE5neFBpY3R1cmVDb25maWcsXHJcbiAgICBAT3B0aW9uYWwoKSBASW5qZWN0KFdJTkRPVykgcHJpdmF0ZSB3aW5kb3csXHJcbiAgICBwcml2YXRlIGVsZW1lbnRSZWY6IEVsZW1lbnRSZWYsXHJcbiAgICBwcml2YXRlIGNoYW5nZURldGVjdG9yUmVmOiBDaGFuZ2VEZXRlY3RvclJlZlxyXG4gICkge31cclxuXHJcbiAgbmdPbkluaXQoKSB7XHJcbiAgICBpZiAoaXNQbGF0Zm9ybVNlcnZlcih0aGlzLnBsYXRmb3JtSWQpKSB7XHJcbiAgICAgIHRoaXMuc2hvdyA9IHRydWU7XHJcbiAgICB9XHJcbiAgfVxyXG5cclxuICBuZ0FmdGVyVmlld0luaXQoKSB7XHJcbiAgICBpZiAodGhpcy5sYXp5TG9hZCAmJiB0aGlzLndpbmRvdyAmJiAnSW50ZXJzZWN0aW9uT2JzZXJ2ZXInIGluIHRoaXMud2luZG93KSB7XHJcbiAgICAgIHRoaXMuaW50ZXJzZWN0aW9uT2JzZXJ2ZXIgPSBuZXcgSW50ZXJzZWN0aW9uT2JzZXJ2ZXIoXHJcbiAgICAgICAgKGVudHJpZXM6IEFycmF5PEludGVyc2VjdGlvbk9ic2VydmVyRW50cnk+KSA9PiB7XHJcbiAgICAgICAgICBpZiAoXHJcbiAgICAgICAgICAgIGVudHJpZXMuZmluZCgoZW50cnk6IEludGVyc2VjdGlvbk9ic2VydmVyRW50cnkpID0+IHtcclxuICAgICAgICAgICAgICByZXR1cm4gKFxyXG4gICAgICAgICAgICAgICAgZW50cnkuaXNJbnRlcnNlY3RpbmcgJiZcclxuICAgICAgICAgICAgICAgIGVudHJ5LnRhcmdldCA9PT0gdGhpcy5lbGVtZW50UmVmLm5hdGl2ZUVsZW1lbnRcclxuICAgICAgICAgICAgICApO1xyXG4gICAgICAgICAgICB9KVxyXG4gICAgICAgICAgKSB7XHJcbiAgICAgICAgICAgIHRoaXMuc2hvd0xhenlQaWN0dXJlKCk7XHJcbiAgICAgICAgICB9XHJcbiAgICAgICAgfSxcclxuICAgICAgICB7fVxyXG4gICAgICApO1xyXG5cclxuICAgICAgdGhpcy5pbnRlcnNlY3Rpb25PYnNlcnZlci5vYnNlcnZlKHRoaXMuZWxlbWVudFJlZi5uYXRpdmVFbGVtZW50KTtcclxuICAgIH0gZWxzZSB7XHJcbiAgICAgIHRoaXMuc2hvdyA9IHRydWU7XHJcbiAgICAgIHRoaXMuY2hhbmdlRGV0ZWN0b3JSZWYuZGV0ZWN0Q2hhbmdlcygpO1xyXG4gICAgfVxyXG4gIH1cclxuXHJcbiAgcHJpdmF0ZSBzaG93TGF6eVBpY3R1cmUoKSB7XHJcbiAgICB0aGlzLmludGVyc2VjdGlvbk9ic2VydmVyLnVub2JzZXJ2ZSh0aGlzLmVsZW1lbnRSZWYubmF0aXZlRWxlbWVudCk7XHJcbiAgICB0aGlzLnNob3cgPSB0cnVlO1xyXG4gICAgdGhpcy5jaGFuZ2VEZXRlY3RvclJlZi5kZXRlY3RDaGFuZ2VzKCk7XHJcbiAgfVxyXG59XHJcbiJdfQ==

fesm2015/ngx-picture.js

@@ -119,5 +119,5 @@ import { InjectionToken, EventEmitter, Inject, PLATFORM_ID, Optional, ElementRef, ChangeDetectorRef, ContentChild, Input, Output, Component, ChangeDetectionStrategy, NgModule } from '@angular/core';
         selector: 'ngx-picture',
-        template: "<picture *ngIf=\"show\">\r\n  <ng-container *ngFor=\"let imageFormat of imageFormats\">\r\n    <source\r\n      *ngFor=\"let breakpoint of breakpoints | keyvalue\"\r\n      [srcset]=\"\r\n        srcInterpolator(src, imageFormat, breakpoint.key, breakpoint.value)\r\n      \"\r\n      [media]=\"breakpoint.key\"\r\n      type=\"image/{{ imageFormat }}\"\r\n    />\r\n  </ng-container>\r\n  <ng-container\r\n    [ngTemplateOutlet]=\"imgTemplate || defaultImageTemplate\"\r\n    [ngTemplateOutletContext]=\"{ $implicit: { src: src, alt: alt } }\"\r\n  >\r\n  </ng-container>\r\n  <ng-template #defaultImageTemplate>\r\n    <img\r\n      [src]=\"src\"\r\n      [alt]=\"alt\"\r\n      (load)=\"loaded.emit($event)\"\r\n      loading=\"lazy\"\r\n      #img\r\n    />\r\n  </ng-template>\r\n</picture>\r\n",
+        template: "<picture class=\"ngx-picture__picture\" *ngIf=\"show\">\r\n  <ng-container *ngFor=\"let imageFormat of imageFormats\">\r\n    <source\r\n      *ngFor=\"let breakpoint of breakpoints | keyvalue\"\r\n      [srcset]=\"\r\n        srcInterpolator(src, imageFormat, breakpoint.key, breakpoint.value)\r\n      \"\r\n      [media]=\"breakpoint.key\"\r\n      type=\"image/{{ imageFormat }}\"\r\n    />\r\n  </ng-container>\r\n  <ng-container\r\n    [ngTemplateOutlet]=\"imgTemplate || defaultImageTemplate\"\r\n    [ngTemplateOutletContext]=\"{ $implicit: { src: src, alt: alt } }\"\r\n  >\r\n  </ng-container>\r\n  <ng-template #defaultImageTemplate>\r\n    <img\r\n      [src]=\"src\"\r\n      [alt]=\"alt\"\r\n      (load)=\"loaded.emit($event)\"\r\n      class=\"ngx-picture__picture__img\"\r\n      loading=\"lazy\"\r\n      #img\r\n    />\r\n  </ng-template>\r\n</picture>\r\n",
         changeDetection: ChangeDetectionStrategy.OnPush,
-        styles: [":host{width:100%;height:inherit;display:block;min-height:1px}picture,picture img{width:100%;height:inherit}"]
+        styles: [":host{width:100%;height:inherit;display:block;min-height:1px}.ngx-picture__picture,.ngx-picture__picture .ngx-picture__picture__img{width:100%;height:inherit}"]
     }),
@@ -124,0 +124,0 @@ __param(0, Inject(PLATFORM_ID)),

fesm5/ngx-picture.js

@@ -119,5 +119,5 @@ import { InjectionToken, EventEmitter, Inject, PLATFORM_ID, Optional, ElementRef, ChangeDetectorRef, ContentChild, Input, Output, Component, ChangeDetectionStrategy, NgModule } from '@angular/core';
             selector: 'ngx-picture',
-            template: "<picture *ngIf=\"show\">\r\n  <ng-container *ngFor=\"let imageFormat of imageFormats\">\r\n    <source\r\n      *ngFor=\"let breakpoint of breakpoints | keyvalue\"\r\n      [srcset]=\"\r\n        srcInterpolator(src, imageFormat, breakpoint.key, breakpoint.value)\r\n      \"\r\n      [media]=\"breakpoint.key\"\r\n      type=\"image/{{ imageFormat }}\"\r\n    />\r\n  </ng-container>\r\n  <ng-container\r\n    [ngTemplateOutlet]=\"imgTemplate || defaultImageTemplate\"\r\n    [ngTemplateOutletContext]=\"{ $implicit: { src: src, alt: alt } }\"\r\n  >\r\n  </ng-container>\r\n  <ng-template #defaultImageTemplate>\r\n    <img\r\n      [src]=\"src\"\r\n      [alt]=\"alt\"\r\n      (load)=\"loaded.emit($event)\"\r\n      loading=\"lazy\"\r\n      #img\r\n    />\r\n  </ng-template>\r\n</picture>\r\n",
+            template: "<picture class=\"ngx-picture__picture\" *ngIf=\"show\">\r\n  <ng-container *ngFor=\"let imageFormat of imageFormats\">\r\n    <source\r\n      *ngFor=\"let breakpoint of breakpoints | keyvalue\"\r\n      [srcset]=\"\r\n        srcInterpolator(src, imageFormat, breakpoint.key, breakpoint.value)\r\n      \"\r\n      [media]=\"breakpoint.key\"\r\n      type=\"image/{{ imageFormat }}\"\r\n    />\r\n  </ng-container>\r\n  <ng-container\r\n    [ngTemplateOutlet]=\"imgTemplate || defaultImageTemplate\"\r\n    [ngTemplateOutletContext]=\"{ $implicit: { src: src, alt: alt } }\"\r\n  >\r\n  </ng-container>\r\n  <ng-template #defaultImageTemplate>\r\n    <img\r\n      [src]=\"src\"\r\n      [alt]=\"alt\"\r\n      (load)=\"loaded.emit($event)\"\r\n      class=\"ngx-picture__picture__img\"\r\n      loading=\"lazy\"\r\n      #img\r\n    />\r\n  </ng-template>\r\n</picture>\r\n",
             changeDetection: ChangeDetectionStrategy.OnPush,
-            styles: [":host{width:100%;height:inherit;display:block;min-height:1px}picture,picture img{width:100%;height:inherit}"]
+            styles: [":host{width:100%;height:inherit;display:block;min-height:1px}.ngx-picture__picture,.ngx-picture__picture .ngx-picture__picture__img{width:100%;height:inherit}"]
         }),
@@ -124,0 +124,0 @@ __param(0, Inject(PLATFORM_ID)),

lib/ngx-picture.module.d.ts

@@ -12,2 +12,2 @@ import { ModuleWithProviders } from '@angular/core';
 
-//# sourceMappingURL=ngx-picture.module.d.ts.map
+//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibmd4LXBpY3R1cmUubW9kdWxlLmQudHMiLCJzb3VyY2VzIjpbIm5neC1waWN0dXJlLm1vZHVsZS5kLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBOzs7OztBQUVBOzs7O0FBRUEiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBNb2R1bGVXaXRoUHJvdmlkZXJzIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCB7IE5neFBpY3R1cmVDb25maWcgfSBmcm9tICcuL25neC1waWN0dXJlLWNvbmZpZyc7XHJcbmV4cG9ydCBkZWNsYXJlIGNsYXNzIE5neFBpY3R1cmVNb2R1bGUge1xyXG4gICAgc3RhdGljIGZvclJvb3Q8VD4oY29uZmlnOiBOZ3hQaWN0dXJlQ29uZmlnPFQ+KTogTW9kdWxlV2l0aFByb3ZpZGVyczxOZ3hQaWN0dXJlTW9kdWxlPjtcclxufVxyXG4iXX0=

lib/picture/picture.component.d.ts

@@ -40,2 +40,2 @@ import { AfterViewInit, ChangeDetectorRef, ElementRef, EventEmitter, OnInit, TemplateRef } from '@angular/core';
 
-//# sourceMappingURL=picture.component.d.ts.map
+//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicGljdHVyZS5jb21wb25lbnQuZC50cyIsInNvdXJjZXMiOlsicGljdHVyZS5jb21wb25lbnQuZC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTs7O0FBRUE7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7QUF1QkEiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBBZnRlclZpZXdJbml0LCBDaGFuZ2VEZXRlY3RvclJlZiwgRWxlbWVudFJlZiwgRXZlbnRFbWl0dGVyLCBPbkluaXQsIFRlbXBsYXRlUmVmIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCB7IE5neFBpY3R1cmVDb25maWcgfSBmcm9tICcuLi9uZ3gtcGljdHVyZS1jb25maWcnO1xyXG5leHBvcnQgZGVjbGFyZSB0eXBlIEltYWdlRm9ybWF0ID0gJ2FwbmcnIHwgJ2JtcCcgfCAnZ2lmJyB8ICdqcGVnJyB8ICdwbmcnIHwgJ3N2ZycgfCAndGlmZicgfCAnd2VicCcgfCAnanAyJyB8ICdqeHInO1xyXG5leHBvcnQgZGVjbGFyZSBjbGFzcyBQaWN0dXJlQ29tcG9uZW50IGltcGxlbWVudHMgT25Jbml0LCBBZnRlclZpZXdJbml0IHtcclxuICAgIHByaXZhdGUgcGxhdGZvcm1JZDtcclxuICAgIHByaXZhdGUgbmd4UGljdHVyZUNvbmZpZztcclxuICAgIHByaXZhdGUgd2luZG93O1xyXG4gICAgcHJpdmF0ZSBlbGVtZW50UmVmO1xyXG4gICAgcHJpdmF0ZSBjaGFuZ2VEZXRlY3RvclJlZjtcclxuICAgIGltZ1RlbXBsYXRlOiBUZW1wbGF0ZVJlZjxIVE1MSW1hZ2VFbGVtZW50PjtcclxuICAgIHNyYzogc3RyaW5nO1xyXG4gICAgaW1hZ2VGb3JtYXRzOiBhbnlbXTtcclxuICAgIGJyZWFrcG9pbnRzOiB7XHJcbiAgICAgICAgW2tleTogc3RyaW5nXTogbnVtYmVyO1xyXG4gICAgfTtcclxuICAgIGFsdDogc3RyaW5nO1xyXG4gICAgbGF6eUxvYWQ6IGJvb2xlYW47XHJcbiAgICBzcmNJbnRlcnBvbGF0b3I6ICh1cmw6IHN0cmluZywgaW1hZ2VGb3JtYXQ6IEltYWdlRm9ybWF0LCBicmVha3BvaW50OiBzdHJpbmcsIGJyZWFrcG9pbnRWYWx1ZTogbnVtYmVyKSA9PiBzdHJpbmc7XHJcbiAgICBsb2FkZWQ6IEV2ZW50RW1pdHRlcjxFdmVudD47XHJcbiAgICBzaG93OiBib29sZWFuO1xyXG4gICAgcHJpdmF0ZSBpbnRlcnNlY3Rpb25PYnNlcnZlcjtcclxuICAgIGNvbnN0cnVjdG9yKHBsYXRmb3JtSWQ6IGFueSwgbmd4UGljdHVyZUNvbmZpZzogTmd4UGljdHVyZUNvbmZpZywgd2luZG93OiBhbnksIGVsZW1lbnRSZWY6IEVsZW1lbnRSZWYsIGNoYW5nZURldGVjdG9yUmVmOiBDaGFuZ2VEZXRlY3RvclJlZik7XHJcbiAgICBuZ09uSW5pdCgpOiB2b2lkO1xyXG4gICAgbmdBZnRlclZpZXdJbml0KCk6IHZvaWQ7XHJcbiAgICBwcml2YXRlIHNob3dMYXp5UGljdHVyZTtcclxufVxyXG4iXX0=

ngx-picture.d.ts

@@ -6,2 +6,2 @@ /**
 
-//# sourceMappingURL=ngx-picture.d.ts.map
+//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibmd4LXBpY3R1cmUuZC50cyIsInNvdXJjZXMiOlsibmd4LXBpY3R1cmUuZC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxyXG4gKiBHZW5lcmF0ZWQgYnVuZGxlIGluZGV4LiBEbyBub3QgZWRpdC5cclxuICovXHJcbmV4cG9ydCAqIGZyb20gJy4vcHVibGljLWFwaSc7XHJcbiJdfQ==

ngx-picture.metadata.json

@@ -1,1 +0,1 @@
-{"__symbolic":"module","version":4,"metadata":{"cloudinarySrcInterpolator":{"__symbolic":"function","parameters":["url","imageFormat","breakpoint","breakpointValue"],"value":{"__symbolic":"call","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"url"},"member":"replace"},"arguments":["upload/",{"__symbolic":"binop","operator":"+","left":{"__symbolic":"binop","operator":"+","left":{"__symbolic":"binop","operator":"+","left":{"__symbolic":"binop","operator":"+","left":"upload/w_","right":{"__symbolic":"reference","name":"breakpointValue"}},"right":"/f_"},"right":{"__symbolic":"reference","name":"imageFormat"}},"right":"/"}]}},"CLOUDINARY_CONFIG":{"breakpoints":{"__symbolic":"reference","name":"DEFAULT_BREAKPOINTS"},"imageFormats":["webp","jpg"],"srcInterpolator":{"__symbolic":"reference","name":"cloudinarySrcInterpolator"}},"DEFAULT_BREAKPOINTS":{"(min-width: 1280px) and (max-width: 1919.99px)":1280,"(max-width: 599.99px)":300,"(min-width: 600px) and (max-width: 959.99px)":600,"(min-width: 960px) and (max-width: 1279.99px)":960,"(min-width: 1920px)":1920,"$quoted$":["(min-width: 1280px) and (max-width: 1919.99px)","(max-width: 599.99px)","(min-width: 600px) and (max-width: 959.99px)","(min-width: 960px) and (max-width: 1279.99px)","(min-width: 1920px)"]},"graphCmsSrcInterpolator":{"__symbolic":"function","parameters":["url","imageFormat","breakpoint","breakpointValue"],"value":{"__symbolic":"binop","operator":"+","left":{"__symbolic":"binop","operator":"+","left":{"__symbolic":"binop","operator":"+","left":{"__symbolic":"binop","operator":"+","left":{"__symbolic":"binop","operator":"+","left":"https://media.graphcms.com/resize=w:","right":{"__symbolic":"reference","name":"breakpointValue"}},"right":",fit:scale/output=format:"},"right":{"__symbolic":"if","condition":{"__symbolic":"binop","operator":"===","left":{"__symbolic":"reference","name":"imageFormat"},"right":"jpeg"},"thenExpression":"jpg","elseExpression":"webp"}},"right":"/"},"right":{"__symbolic":"call","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"url"},"member":"replace"},"arguments":["https://media.graphcms.com/",""]}}},"GRAPH_CMS_CONFIG":{"breakpoints":{"__symbolic":"reference","name":"DEFAULT_BREAKPOINTS"},"imageFormats":["webp","jpg"],"srcInterpolator":{"__symbolic":"reference","name":"graphCmsSrcInterpolator"}},"imagekitSrcInterpolator":{"__symbolic":"function"},"IMAGEKIT_CONFIG":{"breakpoints":{"__symbolic":"reference","name":"DEFAULT_BREAKPOINTS"},"imageFormats":["webp","jpg"],"srcInterpolator":{"__symbolic":"reference","name":"imagekitSrcInterpolator"}},"NgxPictureConfig":{"__symbolic":"interface"},"NGX_PICTURE_CONFIG":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":3,"character":38},"arguments":["NGX_PICTURE_CONFIG"]},"NgxPictureModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":6,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"PictureComponent"}],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":8,"character":12}],"exports":[{"__symbolic":"reference","name":"PictureComponent"}],"entryComponents":[{"__symbolic":"reference","name":"PictureComponent"}]}]}],"members":{},"statics":{"forRoot":{"__symbolic":"function","parameters":["config"],"value":{"ngModule":{"__symbolic":"reference","name":"NgxPictureModule"},"providers":[{"provide":{"__symbolic":"reference","name":"NGX_PICTURE_CONFIG"},"useValue":{"__symbolic":"reference","name":"config"}}]}}}},"ImageFormat":{"__symbolic":"interface"},"PictureComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":33,"character":1},"arguments":[{"selector":"ngx-picture","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":37,"character":19},"member":"OnPush"},"template":"<picture *ngIf=\"show\">\r\n  <ng-container *ngFor=\"let imageFormat of imageFormats\">\r\n    <source\r\n      *ngFor=\"let breakpoint of breakpoints | keyvalue\"\r\n      [srcset]=\"\r\n        srcInterpolator(src, imageFormat, breakpoint.key, breakpoint.value)\r\n      \"\r\n      [media]=\"breakpoint.key\"\r\n      type=\"image/{{ imageFormat }}\"\r\n    />\r\n  </ng-container>\r\n  <ng-container\r\n    [ngTemplateOutlet]=\"imgTemplate || defaultImageTemplate\"\r\n    [ngTemplateOutletContext]=\"{ $implicit: { src: src, alt: alt } }\"\r\n  >\r\n  </ng-container>\r\n  <ng-template #defaultImageTemplate>\r\n    <img\r\n      [src]=\"src\"\r\n      [alt]=\"alt\"\r\n      (load)=\"loaded.emit($event)\"\r\n      loading=\"lazy\"\r\n      #img\r\n    />\r\n  </ng-template>\r\n</picture>\r\n","styles":[":host{width:100%;height:inherit;display:block;min-height:1px}picture,picture img{width:100%;height:inherit}"]}]}],"members":{"imgTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild","line":40,"character":3},"arguments":["imgTemplate"]}]}],"src":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":43,"character":3}}]}],"imageFormats":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":44,"character":3}}]}],"breakpoints":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":45,"character":3}}]}],"alt":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":46,"character":3}}]}],"lazyLoad":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":47,"character":3}}]}],"srcInterpolator":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":49,"character":3}}]}],"loaded":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":50,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":57,"character":5},"arguments":[{"__symbolic":"reference","module":"@angular/core","name":"PLATFORM_ID","line":57,"character":12}]}],[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":58,"character":5},"arguments":[{"__symbolic":"reference","name":"NGX_PICTURE_CONFIG"}]}],[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional","line":59,"character":5}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":59,"character":17},"arguments":[{"__symbolic":"reference","module":"ngx-window-token","name":"WINDOW","line":59,"character":24}]}],null,null],"parameters":[{"__symbolic":"reference","name":"any"},{"__symbolic":"reference","name":"NgxPictureConfig"},null,{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":60,"character":24},{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":61,"character":31}]}],"ngOnInit":[{"__symbolic":"method"}],"ngAfterViewInit":[{"__symbolic":"method"}],"showLazyPicture":[{"__symbolic":"method"}]}}},"origins":{"cloudinarySrcInterpolator":"./lib/cloudinary-config","CLOUDINARY_CONFIG":"./lib/cloudinary-config","DEFAULT_BREAKPOINTS":"./lib/default-breakpoints","graphCmsSrcInterpolator":"./lib/graph-cms-config","GRAPH_CMS_CONFIG":"./lib/graph-cms-config","imagekitSrcInterpolator":"./lib/imagekit-config","IMAGEKIT_CONFIG":"./lib/imagekit-config","NgxPictureConfig":"./lib/ngx-picture-config","NGX_PICTURE_CONFIG":"./lib/ngx-picture-config.token","NgxPictureModule":"./lib/ngx-picture.module","ImageFormat":"./lib/picture/picture.component","PictureComponent":"./lib/picture/picture.component"},"importAs":"ngx-picture"}
+{"__symbolic":"module","version":4,"metadata":{"cloudinarySrcInterpolator":{"__symbolic":"function","parameters":["url","imageFormat","breakpoint","breakpointValue"],"value":{"__symbolic":"call","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"url"},"member":"replace"},"arguments":["upload/",{"__symbolic":"binop","operator":"+","left":{"__symbolic":"binop","operator":"+","left":{"__symbolic":"binop","operator":"+","left":{"__symbolic":"binop","operator":"+","left":"upload/w_","right":{"__symbolic":"reference","name":"breakpointValue"}},"right":"/f_"},"right":{"__symbolic":"reference","name":"imageFormat"}},"right":"/"}]}},"CLOUDINARY_CONFIG":{"breakpoints":{"__symbolic":"reference","name":"DEFAULT_BREAKPOINTS"},"imageFormats":["webp","jpg"],"srcInterpolator":{"__symbolic":"reference","name":"cloudinarySrcInterpolator"}},"DEFAULT_BREAKPOINTS":{"(min-width: 1280px) and (max-width: 1919.99px)":1280,"(max-width: 599.99px)":300,"(min-width: 600px) and (max-width: 959.99px)":600,"(min-width: 960px) and (max-width: 1279.99px)":960,"(min-width: 1920px)":1920,"$quoted$":["(min-width: 1280px) and (max-width: 1919.99px)","(max-width: 599.99px)","(min-width: 600px) and (max-width: 959.99px)","(min-width: 960px) and (max-width: 1279.99px)","(min-width: 1920px)"]},"graphCmsSrcInterpolator":{"__symbolic":"function","parameters":["url","imageFormat","breakpoint","breakpointValue"],"value":{"__symbolic":"binop","operator":"+","left":{"__symbolic":"binop","operator":"+","left":{"__symbolic":"binop","operator":"+","left":{"__symbolic":"binop","operator":"+","left":{"__symbolic":"binop","operator":"+","left":"https://media.graphcms.com/resize=w:","right":{"__symbolic":"reference","name":"breakpointValue"}},"right":",fit:scale/output=format:"},"right":{"__symbolic":"if","condition":{"__symbolic":"binop","operator":"===","left":{"__symbolic":"reference","name":"imageFormat"},"right":"jpeg"},"thenExpression":"jpg","elseExpression":"webp"}},"right":"/"},"right":{"__symbolic":"call","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"url"},"member":"replace"},"arguments":["https://media.graphcms.com/",""]}}},"GRAPH_CMS_CONFIG":{"breakpoints":{"__symbolic":"reference","name":"DEFAULT_BREAKPOINTS"},"imageFormats":["webp","jpg"],"srcInterpolator":{"__symbolic":"reference","name":"graphCmsSrcInterpolator"}},"imagekitSrcInterpolator":{"__symbolic":"function"},"IMAGEKIT_CONFIG":{"breakpoints":{"__symbolic":"reference","name":"DEFAULT_BREAKPOINTS"},"imageFormats":["webp","jpg"],"srcInterpolator":{"__symbolic":"reference","name":"imagekitSrcInterpolator"}},"NgxPictureConfig":{"__symbolic":"interface"},"NGX_PICTURE_CONFIG":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":3,"character":38},"arguments":["NGX_PICTURE_CONFIG"]},"NgxPictureModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":6,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"PictureComponent"}],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":8,"character":12}],"exports":[{"__symbolic":"reference","name":"PictureComponent"}],"entryComponents":[{"__symbolic":"reference","name":"PictureComponent"}]}]}],"members":{},"statics":{"forRoot":{"__symbolic":"function","parameters":["config"],"value":{"ngModule":{"__symbolic":"reference","name":"NgxPictureModule"},"providers":[{"provide":{"__symbolic":"reference","name":"NGX_PICTURE_CONFIG"},"useValue":{"__symbolic":"reference","name":"config"}}]}}}},"ImageFormat":{"__symbolic":"interface"},"PictureComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":33,"character":1},"arguments":[{"selector":"ngx-picture","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":37,"character":19},"member":"OnPush"},"template":"<picture class=\"ngx-picture__picture\" *ngIf=\"show\">\r\n  <ng-container *ngFor=\"let imageFormat of imageFormats\">\r\n    <source\r\n      *ngFor=\"let breakpoint of breakpoints | keyvalue\"\r\n      [srcset]=\"\r\n        srcInterpolator(src, imageFormat, breakpoint.key, breakpoint.value)\r\n      \"\r\n      [media]=\"breakpoint.key\"\r\n      type=\"image/{{ imageFormat }}\"\r\n    />\r\n  </ng-container>\r\n  <ng-container\r\n    [ngTemplateOutlet]=\"imgTemplate || defaultImageTemplate\"\r\n    [ngTemplateOutletContext]=\"{ $implicit: { src: src, alt: alt } }\"\r\n  >\r\n  </ng-container>\r\n  <ng-template #defaultImageTemplate>\r\n    <img\r\n      [src]=\"src\"\r\n      [alt]=\"alt\"\r\n      (load)=\"loaded.emit($event)\"\r\n      class=\"ngx-picture__picture__img\"\r\n      loading=\"lazy\"\r\n      #img\r\n    />\r\n  </ng-template>\r\n</picture>\r\n","styles":[":host{width:100%;height:inherit;display:block;min-height:1px}.ngx-picture__picture,.ngx-picture__picture .ngx-picture__picture__img{width:100%;height:inherit}"]}]}],"members":{"imgTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild","line":40,"character":3},"arguments":["imgTemplate"]}]}],"src":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":43,"character":3}}]}],"imageFormats":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":44,"character":3}}]}],"breakpoints":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":45,"character":3}}]}],"alt":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":46,"character":3}}]}],"lazyLoad":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":47,"character":3}}]}],"srcInterpolator":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":49,"character":3}}]}],"loaded":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":50,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":57,"character":5},"arguments":[{"__symbolic":"reference","module":"@angular/core","name":"PLATFORM_ID","line":57,"character":12}]}],[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":58,"character":5},"arguments":[{"__symbolic":"reference","name":"NGX_PICTURE_CONFIG"}]}],[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional","line":59,"character":5}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":59,"character":17},"arguments":[{"__symbolic":"reference","module":"ngx-window-token","name":"WINDOW","line":59,"character":24}]}],null,null],"parameters":[{"__symbolic":"reference","name":"any"},{"__symbolic":"reference","name":"NgxPictureConfig"},null,{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":60,"character":24},{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":61,"character":31}]}],"ngOnInit":[{"__symbolic":"method"}],"ngAfterViewInit":[{"__symbolic":"method"}],"showLazyPicture":[{"__symbolic":"method"}]}}},"origins":{"cloudinarySrcInterpolator":"./lib/cloudinary-config","CLOUDINARY_CONFIG":"./lib/cloudinary-config","DEFAULT_BREAKPOINTS":"./lib/default-breakpoints","graphCmsSrcInterpolator":"./lib/graph-cms-config","GRAPH_CMS_CONFIG":"./lib/graph-cms-config","imagekitSrcInterpolator":"./lib/imagekit-config","IMAGEKIT_CONFIG":"./lib/imagekit-config","NgxPictureConfig":"./lib/ngx-picture-config","NGX_PICTURE_CONFIG":"./lib/ngx-picture-config.token","NgxPictureModule":"./lib/ngx-picture.module","ImageFormat":"./lib/picture/picture.component","PictureComponent":"./lib/picture/picture.component"},"importAs":"ngx-picture"}

package.json

 {
   "name": "ngx-picture",
-  "version": "2.0.8",
+  "version": "2.0.9",
   "repository": {
@@ -52,6 +52,6 @@ "type": "git",
   "__processed_by_ivy_ngcc__": {
-    "fesm5": "9.0.0",
-    "main": "9.0.0",
-    "module": "9.0.0",
-    "typings": "9.0.0"
+    "fesm5": "9.0.4",
+    "main": "9.0.4",
+    "module": "9.0.4",
+    "typings": "9.0.4"
   },
@@ -58,0 +58,0 @@ "scripts": {

README.md

@@ -198,3 +198,3 @@ # ngx-picture
 ```html
-<picture>
+<picture class="ngx-picture__picture">
   <source
@@ -250,6 +250,26 @@ srcset="assets/images/banner-300.webp"
   />
-  <img src="assets/images/banner.jpg" alt="test" loading="lazy" />
+  <img
+    class="ngx-picture__picture__img"
+    src="assets/images/banner.jpg"
+    alt="test"
+    loading="lazy"
+  />
 </picture>
 ```
 
+## Styling
+
+The **picture** element in the component has the class **ngx-picture\_\_picture** and the img element has the class **ngx-picture**picture**img**.
+
+```scss
+.your-picture-class {
+  .ngx-picture__picture {
+    width: 100%;
+    .ngx-picture__picture__img {
+      width: 100%;
+    }
+  }
+}
+```
+
 ## More
@@ -256,0 +276,0 @@

No alert changes

Improved metrics

Total package byte prevSize

285828

increased by9.55%

Lines of code

1828

increased by1.78%

Number of lines in readme file

295

increased by7.27%

Worsened metrics

Number of package files

49

decreased by-5.77%

No dependency changes