@ethlete/cdk 4.22.3 → 4.23.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,11 @@
|
|
|
1
1
|
# @ethlete/cdk
|
|
2
2
|
|
|
3
|
+
## 4.23.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- [`248297e`](https://github.com/ethlete-io/ethdk/commit/248297e93c364b51b339cec5337a2b2aa92211d6) Thanks [@TomTomB](https://github.com/TomTomB)! - Add imgLoaded and imgError events to et-picture
|
|
8
|
+
|
|
3
9
|
## 4.22.3
|
|
4
10
|
|
|
5
11
|
### Patch Changes
|
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
import { NgClass } from '@angular/common';
|
|
2
|
-
import { ChangeDetectionStrategy, Component, ViewEncapsulation, booleanAttribute, computed, inject, input, numberAttribute, } from '@angular/core';
|
|
2
|
+
import { ChangeDetectionStrategy, Component, ViewEncapsulation, booleanAttribute, computed, inject, input, numberAttribute, viewChild, } from '@angular/core';
|
|
3
|
+
import { outputFromObservable, toObservable } from '@angular/core/rxjs-interop';
|
|
4
|
+
import { fromEvent, map, of, switchMap } from 'rxjs';
|
|
3
5
|
import { IMAGE_CONFIG_TOKEN, normalizePictureSizes, normalizePictureSource } from './picture.utils';
|
|
4
6
|
import * as i0 from "@angular/core";
|
|
5
7
|
export class PictureComponent {
|
|
@@ -19,6 +21,10 @@ export class PictureComponent {
|
|
|
19
21
|
this.sizes = input(null, {
|
|
20
22
|
transform: (v) => normalizePictureSizes(v),
|
|
21
23
|
});
|
|
24
|
+
this.img = viewChild('img');
|
|
25
|
+
this.img$ = toObservable(this.img).pipe(map((ref) => ref?.nativeElement ?? null));
|
|
26
|
+
this.imgLoaded = outputFromObservable(this.img$.pipe(switchMap((img) => (img ? fromEvent(img, 'load').pipe(map(() => true)) : of(false)))));
|
|
27
|
+
this.imgError = outputFromObservable(this.img$.pipe(switchMap((img) => (img ? fromEvent(img, 'error').pipe(map(() => true)) : of(false)))));
|
|
22
28
|
this.sourcesWithConfig = computed(() => {
|
|
23
29
|
const sources = this.sources();
|
|
24
30
|
return sources.map((source) => this._combineWithConfig(normalizePictureSource(source)));
|
|
@@ -39,12 +45,12 @@ export class PictureComponent {
|
|
|
39
45
|
};
|
|
40
46
|
}
|
|
41
47
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: PictureComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
42
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.7", type: PictureComponent, isStandalone: true, selector: "et-picture", inputs: { sources: { classPropertyName: "sources", publicName: "sources", isSignal: true, isRequired: false, transformFunction: null }, hasPriority: { classPropertyName: "hasPriority", publicName: "hasPriority", isSignal: true, isRequired: false, transformFunction: null }, imgClass: { classPropertyName: "imgClass", publicName: "imgClass", isSignal: true, isRequired: false, transformFunction: null }, figureClass: { classPropertyName: "figureClass", publicName: "figureClass", isSignal: true, isRequired: false, transformFunction: null }, figcaptionClass: { classPropertyName: "figcaptionClass", publicName: "figcaptionClass", isSignal: true, isRequired: false, transformFunction: null }, pictureClass: { classPropertyName: "pictureClass", publicName: "pictureClass", isSignal: true, isRequired: false, transformFunction: null }, defaultSrc: { classPropertyName: "defaultSrc", publicName: "defaultSrc", isSignal: true, isRequired: false, transformFunction: null }, alt: { classPropertyName: "alt", publicName: "alt", isSignal: true, isRequired: false, transformFunction: null }, figcaption: { classPropertyName: "figcaption", publicName: "figcaption", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, sizes: { classPropertyName: "sizes", publicName: "sizes", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "et-picture" }, ngImport: i0, template: "<figure [ngClass]=\"figureClass()\" class=\"et-picture-figure\">\n <picture [ngClass]=\"pictureClass()\" class=\"et-picture-picture\">\n @for (source of sourcesWithConfig(); track source.srcset) {\n <source [type]=\"source.type\" [attr.srcset]=\"source.srcset\" [attr.sizes]=\"sizes()\" />\n }\n\n @if (defaultSourceWithConfig(); as source) {\n <img\n [attr.loading]=\"hasPriority() ? 'eager' : 'lazy'\"\n [attr.fetchpriority]=\"hasPriority() ? 'high' : 'auto'\"\n [ngClass]=\"imgClass()\"\n [attr.srcset]=\"source.srcset\"\n [attr.type]=\"source.type\"\n [attr.alt]=\"alt()\"\n [attr.width]=\"width()\"\n [attr.height]=\"height()\"\n [attr.sizes]=\"sizes()\"\n class=\"et-picture-img\"\n />\n }\n </picture>\n\n @if (figcaption()) {\n <figcaption [ngClass]=\"figcaptionClass()\" class=\"et-picture-figcaption\">\n {{ figcaption() }}\n </figcaption>\n }\n</figure>\n", dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
48
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.7", type: PictureComponent, isStandalone: true, selector: "et-picture", inputs: { sources: { classPropertyName: "sources", publicName: "sources", isSignal: true, isRequired: false, transformFunction: null }, hasPriority: { classPropertyName: "hasPriority", publicName: "hasPriority", isSignal: true, isRequired: false, transformFunction: null }, imgClass: { classPropertyName: "imgClass", publicName: "imgClass", isSignal: true, isRequired: false, transformFunction: null }, figureClass: { classPropertyName: "figureClass", publicName: "figureClass", isSignal: true, isRequired: false, transformFunction: null }, figcaptionClass: { classPropertyName: "figcaptionClass", publicName: "figcaptionClass", isSignal: true, isRequired: false, transformFunction: null }, pictureClass: { classPropertyName: "pictureClass", publicName: "pictureClass", isSignal: true, isRequired: false, transformFunction: null }, defaultSrc: { classPropertyName: "defaultSrc", publicName: "defaultSrc", isSignal: true, isRequired: false, transformFunction: null }, alt: { classPropertyName: "alt", publicName: "alt", isSignal: true, isRequired: false, transformFunction: null }, figcaption: { classPropertyName: "figcaption", publicName: "figcaption", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, sizes: { classPropertyName: "sizes", publicName: "sizes", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { imgLoaded: "imgLoaded", imgError: "imgError" }, host: { classAttribute: "et-picture" }, viewQueries: [{ propertyName: "img", first: true, predicate: ["img"], descendants: true, isSignal: true }], ngImport: i0, template: "<figure [ngClass]=\"figureClass()\" class=\"et-picture-figure\">\n <picture [ngClass]=\"pictureClass()\" class=\"et-picture-picture\">\n @for (source of sourcesWithConfig(); track source.srcset) {\n <source [type]=\"source.type\" [attr.srcset]=\"source.srcset\" [attr.sizes]=\"sizes()\" />\n }\n\n @if (defaultSourceWithConfig(); as source) {\n <img\n #img\n [attr.loading]=\"hasPriority() ? 'eager' : 'lazy'\"\n [attr.fetchpriority]=\"hasPriority() ? 'high' : 'auto'\"\n [ngClass]=\"imgClass()\"\n [attr.srcset]=\"source.srcset\"\n [attr.type]=\"source.type\"\n [attr.alt]=\"alt()\"\n [attr.width]=\"width()\"\n [attr.height]=\"height()\"\n [attr.sizes]=\"sizes()\"\n class=\"et-picture-img\"\n />\n }\n </picture>\n\n @if (figcaption()) {\n <figcaption [ngClass]=\"figcaptionClass()\" class=\"et-picture-figcaption\">\n {{ figcaption() }}\n </figcaption>\n }\n</figure>\n", dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
43
49
|
}
|
|
44
50
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: PictureComponent, decorators: [{
|
|
45
51
|
type: Component,
|
|
46
52
|
args: [{ selector: 'et-picture', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [NgClass], host: {
|
|
47
53
|
class: 'et-picture',
|
|
48
|
-
}, template: "<figure [ngClass]=\"figureClass()\" class=\"et-picture-figure\">\n <picture [ngClass]=\"pictureClass()\" class=\"et-picture-picture\">\n @for (source of sourcesWithConfig(); track source.srcset) {\n <source [type]=\"source.type\" [attr.srcset]=\"source.srcset\" [attr.sizes]=\"sizes()\" />\n }\n\n @if (defaultSourceWithConfig(); as source) {\n <img\n [attr.loading]=\"hasPriority() ? 'eager' : 'lazy'\"\n [attr.fetchpriority]=\"hasPriority() ? 'high' : 'auto'\"\n [ngClass]=\"imgClass()\"\n [attr.srcset]=\"source.srcset\"\n [attr.type]=\"source.type\"\n [attr.alt]=\"alt()\"\n [attr.width]=\"width()\"\n [attr.height]=\"height()\"\n [attr.sizes]=\"sizes()\"\n class=\"et-picture-img\"\n />\n }\n </picture>\n\n @if (figcaption()) {\n <figcaption [ngClass]=\"figcaptionClass()\" class=\"et-picture-figcaption\">\n {{ figcaption() }}\n </figcaption>\n }\n</figure>\n" }]
|
|
54
|
+
}, template: "<figure [ngClass]=\"figureClass()\" class=\"et-picture-figure\">\n <picture [ngClass]=\"pictureClass()\" class=\"et-picture-picture\">\n @for (source of sourcesWithConfig(); track source.srcset) {\n <source [type]=\"source.type\" [attr.srcset]=\"source.srcset\" [attr.sizes]=\"sizes()\" />\n }\n\n @if (defaultSourceWithConfig(); as source) {\n <img\n #img\n [attr.loading]=\"hasPriority() ? 'eager' : 'lazy'\"\n [attr.fetchpriority]=\"hasPriority() ? 'high' : 'auto'\"\n [ngClass]=\"imgClass()\"\n [attr.srcset]=\"source.srcset\"\n [attr.type]=\"source.type\"\n [attr.alt]=\"alt()\"\n [attr.width]=\"width()\"\n [attr.height]=\"height()\"\n [attr.sizes]=\"sizes()\"\n class=\"et-picture-img\"\n />\n }\n </picture>\n\n @if (figcaption()) {\n <figcaption [ngClass]=\"figcaptionClass()\" class=\"et-picture-figcaption\">\n {{ figcaption() }}\n </figcaption>\n }\n</figure>\n" }]
|
|
49
55
|
}] });
|
|
50
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
56
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicGljdHVyZS5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi8uLi9saWJzL2Nkay9zcmMvbGliL2NvbXBvbmVudHMvcGljdHVyZS9waWN0dXJlLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uLy4uL2xpYnMvY2RrL3NyYy9saWIvY29tcG9uZW50cy9waWN0dXJlL3BpY3R1cmUuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLE9BQU8sRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQzFDLE9BQU8sRUFDTCx1QkFBdUIsRUFDdkIsU0FBUyxFQUVULGlCQUFpQixFQUNqQixnQkFBZ0IsRUFDaEIsUUFBUSxFQUNSLE1BQU0sRUFDTixLQUFLLEVBQ0wsZUFBZSxFQUNmLFNBQVMsR0FDVixNQUFNLGVBQWUsQ0FBQztBQUN2QixPQUFPLEVBQUUsb0JBQW9CLEVBQUUsWUFBWSxFQUFFLE1BQU0sNEJBQTRCLENBQUM7QUFFaEYsT0FBTyxFQUFFLFNBQVMsRUFBRSxHQUFHLEVBQUUsRUFBRSxFQUFFLFNBQVMsRUFBRSxNQUFNLE1BQU0sQ0FBQztBQUVyRCxPQUFPLEVBQUUsa0JBQWtCLEVBQUUscUJBQXFCLEVBQUUsc0JBQXNCLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQzs7QUFhcEcsTUFBTSxPQUFPLGdCQUFnQjtJQVg3QjtRQVlFLFlBQU8sR0FBRyxNQUFNLENBQUMsa0JBQWtCLEVBQUUsRUFBRSxRQUFRLEVBQUUsSUFBSSxFQUFFLENBQUMsQ0FBQztRQUV6RCxZQUFPLEdBQUcsS0FBSyxDQUFnQyxFQUFFLENBQUMsQ0FBQztRQUNuRCxnQkFBVyxHQUFHLEtBQUssQ0FBQyxLQUFLLEVBQUUsRUFBRSxTQUFTLEVBQUUsZ0JBQWdCLEVBQUUsQ0FBQyxDQUFDO1FBQzVELGFBQVEsR0FBRyxLQUFLLENBQWMsSUFBSSxDQUFDLENBQUM7UUFDcEMsZ0JBQVcsR0FBRyxL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QUcsQ0FBQyxJQUFJLENBQUMsT0FBTyxDQUFDLE9BQU8sQ0FBQyxRQUFRLENBQUMsR0FBRyxDQUFDLElBQUksQ0FBQyxHQUFHLENBQUMsTUFBTSxDQUFDLFVBQVUsQ0FBQyxHQUFHLENBQUMsQ0FBQztRQUU3RixPQUFPO1lBQ0wsR0FBRyxHQUFHO1lBQ04sTUFBTSxFQUFFLEdBQUcsSUFBSSxDQUFDLE9BQU8sQ0FBQyxPQUFPLEdBQUcsaUJBQWlCLENBQUMsQ0FBQyxDQUFDLEdBQUcsQ0FBQyxDQUFDLENBQUMsRUFBRSxHQUFHLEdBQUcsQ0FBQyxNQUFNLEVBQUU7U0FDOUUsQ0FBQztJQUNKLENBQUM7OEdBbERVLGdCQUFnQjtrR0FBaEIsZ0JBQWdCLGswREM5QjdCLGsrQkE2QkEsNENESlksT0FBTzs7MkZBS04sZ0JBQWdCO2tCQVg1QixTQUFTOytCQUNFLFlBQVksaUJBRVAsaUJBQWlCLENBQUMsSUFBSSxtQkFDcEIsdUJBQXVCLENBQUMsTUFBTSxjQUNuQyxJQUFJLFdBQ1AsQ0FBQyxPQUFPLENBQUMsUUFDWjt3QkFDSixLQUFLLEVBQUUsWUFBWTtxQkFDcEIiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBOZ0NsYXNzIH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJztcbmltcG9ydCB7XG4gIENoYW5nZURldGVjdGlvblN0cmF0ZWd5LFxuICBDb21wb25lbnQsXG4gIEVsZW1lbnRSZWYsXG4gIFZpZXdFbmNhcHN1bGF0aW9uLFxuICBib29sZWFuQXR0cmlidXRlLFxuICBjb21wdXRlZCxcbiAgaW5qZWN0LFxuICBpbnB1dCxcbiAgbnVtYmVyQXR0cmlidXRlLFxuICB2aWV3Q2hpbGQsXG59IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgb3V0cHV0RnJvbU9ic2VydmFibGUsIHRvT2JzZXJ2YWJsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUvcnhqcy1pbnRlcm9wJztcbmltcG9ydCB7IE5nQ2xhc3NUeXBlIH0gZnJvbSAnQGV0aGxldGUvY29yZSc7XG5pbXBvcnQgeyBmcm9tRXZlbnQsIG1hcCwgb2YsIHN3aXRjaE1hcCB9IGZyb20gJ3J4anMnO1xuaW1wb3J0IHsgUGljdHVyZVNvdXJjZSB9IGZyb20gJy4vcGljdHVyZS5jb21wb25lbnQudHlwZXMnO1xuaW1wb3J0IHsgSU1BR0VfQ09ORklHX1RPS0VOLCBub3JtYWxpemVQaWN0dXJlU2l6ZXMsIG5vcm1hbGl6ZVBpY3R1cmVTb3VyY2UgfSBmcm9tICcuL3BpY3R1cmUudXRpbHMnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdldC1waWN0dXJlJyxcbiAgdGVtcGxhdGVVcmw6ICcuL3BpY3R1cmUuY29tcG9uZW50Lmh0bWwnLFxuICBlbmNhcHN1bGF0aW9uOiBWaWV3RW5jYXBzdWxhdGlvbi5Ob25lLFxuICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaCxcbiAgc3RhbmRhbG9uZTogdHJ1ZSxcbiAgaW1wb3J0czogW05nQ2xhc3NdLFxuICBob3N0OiB7XG4gICAgY2xhc3M6ICdldC1waWN0dXJlJyxcbiAgfSxcbn0pXG5leHBvcnQgY2xhc3MgUGljdHVyZUNvbXBvbmVudCB7XG4gIF9jb25maWcgPSBpbmplY3QoSU1BR0VfQ09ORklHX1RPS0VOLCB7IG9wdGlvbmFsOiB0cnVlIH0pO1xuXG4gIHNvdXJjZXMgPSBpbnB1dDxBcnJheTxQaWN0dXJlU291cmNlIHwgc3RyaW5nPj4oW10pO1xuICBoYXNQcmlvcml0eSA9IGlucHV0KGZhbHNlLCB7IHRyYW5zZm9ybTogYm9vbGVhbkF0dHJpYnV0ZSB9KTtcbiAgaW1nQ2xhc3MgPSBpbnB1dDxOZ0NsYXNzVHlwZT4obnVsbCk7XG4gIGZpZ3VyZUNsYXNzID0gaW5wdXQ8TmdDbGFzc1R5cGU+KG51bGwpO1xuICBmaWdjYXB0aW9uQ2xhc3MgPSBpbnB1dDxOZ0NsYXNzVHlwZT4obnVsbCk7XG4gIHBpY3R1cmVDbGFzcyA9IGlucHV0PE5nQ2xhc3NUeXBlPihudWxsKTtcbiAgZGVmYXVsdFNyYyA9IGlucHV0PFBpY3R1cmVTb3VyY2UgfCBzdHJpbmcgfCBudWxsPihudWxsKTtcbiAgYWx0ID0gaW5wdXQ8c3RyaW5nIHwgbnVsbD4obnVsbCk7XG4gIGZpZ2NhcHRpb24gPSBpbnB1dDxzdHJpbmcgfCBudWxsPihudWxsKTtcbiAgd2lkdGggPSBpbnB1dChudWxsLCB7IHRyYW5zZm9ybTogbnVtYmVyQXR0cmlidXRlIH0pO1xuICBoZWlnaHQgPSBpbnB1dChudWxsLCB7IHRyYW5zZm9ybTogbnVtYmVyQXR0cmlidXRlIH0pO1xuICBzaXplcyA9IGlucHV0PHN0cmluZyB8IG51bGwsIHN0cmluZ1tdIHwgc3RyaW5nIHwgbnVsbD4obnVsbCwge1xuICAgIHRyYW5zZm9ybTogKHYpID0+IG5vcm1hbGl6ZVBpY3R1cmVTaXplcyh2KSxcbiAgfSk7XG5cbiAgaW1nID0gdmlld0NoaWxkPEVsZW1lbnRSZWY8SFRNTEltYWdlRWxlbWVudD4+KCdpbWcnKTtcbiAgaW1nJCA9IHRvT2JzZXJ2YWJsZSh0aGlzLmltZykucGlwZShtYXAoKHJlZikgPT4gcmVmPy5uYXRpdmVFbGVtZW50ID8/IG51bGwpKTtcblxuICBpbWdMb2FkZWQgPSBvdXRwdXRGcm9tT2JzZXJ2YWJsZShcbiAgICB0aGlzLmltZyQucGlwZShzd2l0Y2hNYXAoKGltZykgPT4gKGltZyA/IGZyb21FdmVudChpbWcsICdsb2FkJykucGlwZShtYXAoKCkgPT4gdHJ1ZSkpIDogb2YoZmFsc2UpKSkpLFxuICApO1xuICBpbWdFcnJvciA9IG91dHB1dEZyb21PYnNlcnZhYmxlKFxuICAgIHRoaXMuaW1nJC5waXBlKHN3aXRjaE1hcCgoaW1nKSA9PiAoaW1nID8gZnJvbUV2ZW50KGltZywgJ2Vycm9yJykucGlwZShtYXAoKCkgPT4gdHJ1ZSkpIDogb2YoZmFsc2UpKSkpLFxuICApO1xuXG4gIHNvdXJjZXNXaXRoQ29uZmlnID0gY29tcHV0ZWQoKCkgPT4ge1xuICAgIGNvbnN0IHNvdXJjZXMgPSB0aGlzLnNvdXJjZXMoKTtcblxuICAgIHJldHVybiBzb3VyY2VzLm1hcCgoc291cmNlKSA9PiB0aGlzLl9jb21iaW5lV2l0aENvbmZpZyhub3JtYWxpemVQaWN0dXJlU291cmNlKHNvdXJjZSkpKTtcbiAgfSk7XG5cbiAgZGVmYXVsdFNvdXJjZVdpdGhDb25maWcgPSBjb21wdXRlZCgoKSA9PiB7XG4gICAgY29uc3QgZGVmYXVsdFNyYyA9IHRoaXMuZGVmYXVsdFNyYygpO1xuICAgIHJldHVybiBkZWZhdWx0U3JjID8gdGhpcy5fY29tYmluZVdpdGhDb25maWcobm9ybWFsaXplUGljdHVyZVNvdXJjZShkZWZhdWx0U3JjKSkgOiBudWxsO1xuICB9KTtcblxuICBfY29tYmluZVdpdGhDb25maWcoc3JjOiBQaWN0dXJlU291cmNlKSB7XG4gICAgaWYgKCF0aGlzLl9jb25maWc/LmJhc2VVcmwgfHwgc3JjLnNyY3NldC5zdGFydHNXaXRoKCdodHRwJykpIHtcbiAgICAgIHJldHVybiBzcmM7XG4gICAgfVxuXG4gICAgY29uc3Qgc2hvdWxkQXBwZW5kU2xhc2ggPSAhdGhpcy5fY29uZmlnLmJhc2VVcmwuZW5kc1dpdGgoJy8nKSAmJiAhc3JjLnNyY3NldC5zdGFydHNXaXRoKCcvJyk7XG5cbiAgICByZXR1cm4ge1xuICAgICAgLi4uc3JjLFxuICAgICAgc3Jjc2V0OiBgJHt0aGlzLl9jb25maWcuYmFzZVVybH0ke3Nob3VsZEFwcGVuZFNsYXNoID8gJy8nIDogJyd9JHtzcmMuc3Jjc2V0fWAsXG4gICAgfTtcbiAgfVxufVxuIiwiPGZpZ3VyZSBbbmdDbGFzc109XCJmaWd1cmVDbGFzcygpXCIgY2xhc3M9XCJldC1waWN0dXJlLWZpZ3VyZVwiPlxuICA8cGljdHVyZSBbbmdDbGFzc109XCJwaWN0dXJlQ2xhc3MoKVwiIGNsYXNzPVwiZXQtcGljdHVyZS1waWN0dXJlXCI+XG4gICAgQGZvciAoc291cmNlIG9mIHNvdXJjZXNXaXRoQ29uZmlnKCk7IHRyYWNrIHNvdXJjZS5zcmNzZXQpIHtcbiAgICAgIDxzb3VyY2UgW3R5cGVdPVwic291cmNlLnR5cGVcIiBbYXR0ci5zcmNzZXRdPVwic291cmNlLnNyY3NldFwiIFthdHRyLnNpemVzXT1cInNpemVzKClcIiAvPlxuICAgIH1cblxuICAgIEBpZiAoZGVmYXVsdFNvdXJjZVdpdGhDb25maWcoKTsgYXMgc291cmNlKSB7XG4gICAgICA8aW1nXG4gICAgICAgICNpbWdcbiAgICAgICAgW2F0dHIubG9hZGluZ109XCJoYXNQcmlvcml0eSgpID8gJ2VhZ2VyJyA6ICdsYXp5J1wiXG4gICAgICAgIFthdHRyLmZldGNocHJpb3JpdHldPVwiaGFzUHJpb3JpdHkoKSA/ICdoaWdoJyA6ICdhdXRvJ1wiXG4gICAgICAgIFtuZ0NsYXNzXT1cImltZ0NsYXNzKClcIlxuICAgICAgICBbYXR0ci5zcmNzZXRdPVwic291cmNlLnNyY3NldFwiXG4gICAgICAgIFthdHRyLnR5cGVdPVwic291cmNlLnR5cGVcIlxuICAgICAgICBbYXR0ci5hbHRdPVwiYWx0KClcIlxuICAgICAgICBbYXR0ci53aWR0aF09XCJ3aWR0aCgpXCJcbiAgICAgICAgW2F0dHIuaGVpZ2h0XT1cImhlaWdodCgpXCJcbiAgICAgICAgW2F0dHIuc2l6ZXNdPVwic2l6ZXMoKVwiXG4gICAgICAgIGNsYXNzPVwiZXQtcGljdHVyZS1pbWdcIlxuICAgICAgLz5cbiAgICB9XG4gIDwvcGljdHVyZT5cblxuICBAaWYgKGZpZ2NhcHRpb24oKSkge1xuICAgIDxmaWdjYXB0aW9uIFtuZ0NsYXNzXT1cImZpZ2NhcHRpb25DbGFzcygpXCIgY2xhc3M9XCJldC1waWN0dXJlLWZpZ2NhcHRpb25cIj5cbiAgICAgIHt7IGZpZ2NhcHRpb24oKSB9fVxuICAgIDwvZmlnY2FwdGlvbj5cbiAgfVxuPC9maWd1cmU+XG4iXX0=
|
package/fesm2022/ethlete-cdk.mjs
CHANGED
|
@@ -14343,6 +14343,10 @@ class PictureComponent {
|
|
|
14343
14343
|
this.sizes = input(null, {
|
|
14344
14344
|
transform: (v) => normalizePictureSizes(v),
|
|
14345
14345
|
});
|
|
14346
|
+
this.img = viewChild('img');
|
|
14347
|
+
this.img$ = toObservable(this.img).pipe(map((ref) => ref?.nativeElement ?? null));
|
|
14348
|
+
this.imgLoaded = outputFromObservable(this.img$.pipe(switchMap((img) => (img ? fromEvent(img, 'load').pipe(map(() => true)) : of(false)))));
|
|
14349
|
+
this.imgError = outputFromObservable(this.img$.pipe(switchMap((img) => (img ? fromEvent(img, 'error').pipe(map(() => true)) : of(false)))));
|
|
14346
14350
|
this.sourcesWithConfig = computed(() => {
|
|
14347
14351
|
const sources = this.sources();
|
|
14348
14352
|
return sources.map((source) => this._combineWithConfig(normalizePictureSource(source)));
|
|
@@ -14363,13 +14367,13 @@ class PictureComponent {
|
|
|
14363
14367
|
};
|
|
14364
14368
|
}
|
|
14365
14369
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: PictureComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
14366
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.7", type: PictureComponent, isStandalone: true, selector: "et-picture", inputs: { sources: { classPropertyName: "sources", publicName: "sources", isSignal: true, isRequired: false, transformFunction: null }, hasPriority: { classPropertyName: "hasPriority", publicName: "hasPriority", isSignal: true, isRequired: false, transformFunction: null }, imgClass: { classPropertyName: "imgClass", publicName: "imgClass", isSignal: true, isRequired: false, transformFunction: null }, figureClass: { classPropertyName: "figureClass", publicName: "figureClass", isSignal: true, isRequired: false, transformFunction: null }, figcaptionClass: { classPropertyName: "figcaptionClass", publicName: "figcaptionClass", isSignal: true, isRequired: false, transformFunction: null }, pictureClass: { classPropertyName: "pictureClass", publicName: "pictureClass", isSignal: true, isRequired: false, transformFunction: null }, defaultSrc: { classPropertyName: "defaultSrc", publicName: "defaultSrc", isSignal: true, isRequired: false, transformFunction: null }, alt: { classPropertyName: "alt", publicName: "alt", isSignal: true, isRequired: false, transformFunction: null }, figcaption: { classPropertyName: "figcaption", publicName: "figcaption", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, sizes: { classPropertyName: "sizes", publicName: "sizes", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "et-picture" }, ngImport: i0, template: "<figure [ngClass]=\"figureClass()\" class=\"et-picture-figure\">\n <picture [ngClass]=\"pictureClass()\" class=\"et-picture-picture\">\n @for (source of sourcesWithConfig(); track source.srcset) {\n <source [type]=\"source.type\" [attr.srcset]=\"source.srcset\" [attr.sizes]=\"sizes()\" />\n }\n\n @if (defaultSourceWithConfig(); as source) {\n <img\n [attr.loading]=\"hasPriority() ? 'eager' : 'lazy'\"\n [attr.fetchpriority]=\"hasPriority() ? 'high' : 'auto'\"\n [ngClass]=\"imgClass()\"\n [attr.srcset]=\"source.srcset\"\n [attr.type]=\"source.type\"\n [attr.alt]=\"alt()\"\n [attr.width]=\"width()\"\n [attr.height]=\"height()\"\n [attr.sizes]=\"sizes()\"\n class=\"et-picture-img\"\n />\n }\n </picture>\n\n @if (figcaption()) {\n <figcaption [ngClass]=\"figcaptionClass()\" class=\"et-picture-figcaption\">\n {{ figcaption() }}\n </figcaption>\n }\n</figure>\n", dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
14370
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.7", type: PictureComponent, isStandalone: true, selector: "et-picture", inputs: { sources: { classPropertyName: "sources", publicName: "sources", isSignal: true, isRequired: false, transformFunction: null }, hasPriority: { classPropertyName: "hasPriority", publicName: "hasPriority", isSignal: true, isRequired: false, transformFunction: null }, imgClass: { classPropertyName: "imgClass", publicName: "imgClass", isSignal: true, isRequired: false, transformFunction: null }, figureClass: { classPropertyName: "figureClass", publicName: "figureClass", isSignal: true, isRequired: false, transformFunction: null }, figcaptionClass: { classPropertyName: "figcaptionClass", publicName: "figcaptionClass", isSignal: true, isRequired: false, transformFunction: null }, pictureClass: { classPropertyName: "pictureClass", publicName: "pictureClass", isSignal: true, isRequired: false, transformFunction: null }, defaultSrc: { classPropertyName: "defaultSrc", publicName: "defaultSrc", isSignal: true, isRequired: false, transformFunction: null }, alt: { classPropertyName: "alt", publicName: "alt", isSignal: true, isRequired: false, transformFunction: null }, figcaption: { classPropertyName: "figcaption", publicName: "figcaption", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, sizes: { classPropertyName: "sizes", publicName: "sizes", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { imgLoaded: "imgLoaded", imgError: "imgError" }, host: { classAttribute: "et-picture" }, viewQueries: [{ propertyName: "img", first: true, predicate: ["img"], descendants: true, isSignal: true }], ngImport: i0, template: "<figure [ngClass]=\"figureClass()\" class=\"et-picture-figure\">\n <picture [ngClass]=\"pictureClass()\" class=\"et-picture-picture\">\n @for (source of sourcesWithConfig(); track source.srcset) {\n <source [type]=\"source.type\" [attr.srcset]=\"source.srcset\" [attr.sizes]=\"sizes()\" />\n }\n\n @if (defaultSourceWithConfig(); as source) {\n <img\n #img\n [attr.loading]=\"hasPriority() ? 'eager' : 'lazy'\"\n [attr.fetchpriority]=\"hasPriority() ? 'high' : 'auto'\"\n [ngClass]=\"imgClass()\"\n [attr.srcset]=\"source.srcset\"\n [attr.type]=\"source.type\"\n [attr.alt]=\"alt()\"\n [attr.width]=\"width()\"\n [attr.height]=\"height()\"\n [attr.sizes]=\"sizes()\"\n class=\"et-picture-img\"\n />\n }\n </picture>\n\n @if (figcaption()) {\n <figcaption [ngClass]=\"figcaptionClass()\" class=\"et-picture-figcaption\">\n {{ figcaption() }}\n </figcaption>\n }\n</figure>\n", dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
14367
14371
|
}
|
|
14368
14372
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: PictureComponent, decorators: [{
|
|
14369
14373
|
type: Component,
|
|
14370
14374
|
args: [{ selector: 'et-picture', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [NgClass], host: {
|
|
14371
14375
|
class: 'et-picture',
|
|
14372
|
-
}, template: "<figure [ngClass]=\"figureClass()\" class=\"et-picture-figure\">\n <picture [ngClass]=\"pictureClass()\" class=\"et-picture-picture\">\n @for (source of sourcesWithConfig(); track source.srcset) {\n <source [type]=\"source.type\" [attr.srcset]=\"source.srcset\" [attr.sizes]=\"sizes()\" />\n }\n\n @if (defaultSourceWithConfig(); as source) {\n <img\n [attr.loading]=\"hasPriority() ? 'eager' : 'lazy'\"\n [attr.fetchpriority]=\"hasPriority() ? 'high' : 'auto'\"\n [ngClass]=\"imgClass()\"\n [attr.srcset]=\"source.srcset\"\n [attr.type]=\"source.type\"\n [attr.alt]=\"alt()\"\n [attr.width]=\"width()\"\n [attr.height]=\"height()\"\n [attr.sizes]=\"sizes()\"\n class=\"et-picture-img\"\n />\n }\n </picture>\n\n @if (figcaption()) {\n <figcaption [ngClass]=\"figcaptionClass()\" class=\"et-picture-figcaption\">\n {{ figcaption() }}\n </figcaption>\n }\n</figure>\n" }]
|
|
14376
|
+
}, template: "<figure [ngClass]=\"figureClass()\" class=\"et-picture-figure\">\n <picture [ngClass]=\"pictureClass()\" class=\"et-picture-picture\">\n @for (source of sourcesWithConfig(); track source.srcset) {\n <source [type]=\"source.type\" [attr.srcset]=\"source.srcset\" [attr.sizes]=\"sizes()\" />\n }\n\n @if (defaultSourceWithConfig(); as source) {\n <img\n #img\n [attr.loading]=\"hasPriority() ? 'eager' : 'lazy'\"\n [attr.fetchpriority]=\"hasPriority() ? 'high' : 'auto'\"\n [ngClass]=\"imgClass()\"\n [attr.srcset]=\"source.srcset\"\n [attr.type]=\"source.type\"\n [attr.alt]=\"alt()\"\n [attr.width]=\"width()\"\n [attr.height]=\"height()\"\n [attr.sizes]=\"sizes()\"\n class=\"et-picture-img\"\n />\n }\n </picture>\n\n @if (figcaption()) {\n <figcaption [ngClass]=\"figcaptionClass()\" class=\"et-picture-figcaption\">\n {{ figcaption() }}\n </figcaption>\n }\n</figure>\n" }]
|
|
14373
14377
|
}] });
|
|
14374
14378
|
|
|
14375
14379
|
const PROGRESS_SPINNER_DEFAULT_OPTIONS = new InjectionToken('PROGRESS_SPINNER_DEFAULT_OPTIONS', {
|