{
  "version": 3,
  "sources": ["src/app/features/lazy-image/components/lazy-picture/lazy-picture.component.ts", "src/app/features/lazy-image/components/lazy-picture/lazy-picture.component.html"],
  "sourcesContent": ["import { DOCUMENT, NgClass } from '@angular/common';\nimport {\n    ChangeDetectionStrategy,\n    ChangeDetectorRef,\n    Component,\n    Inject,\n    Input,\n    OnChanges,\n    OnInit,\n    SimpleChanges,\n} from '@angular/core';\nimport { ContentfulService } from '@core/services/contentful.service';\nimport { EnvironmentService } from '@core/services/environment.service';\nimport { fixAssetUrl } from '@features/contentful/helpers/assetHelpers';\nimport { LazysizesService } from '@features/lazy-image/services/lazysizes.service';\nimport { Asset } from '@generated/graphql';\n\nexport enum Stops {\n    FALLBACK = 'FALLBACK',\n    BASE = '0px',\n    SM = '640px',\n    MD = '768px',\n    LG = '1024px',\n    XL = '1280px',\n    XXL = '1536px',\n}\n\nexport enum StopsMediaQuery {\n    BASE = '(max-width: 639.9px)',\n    SM = '(min-width: 640px) and (max-width: 767.9px)',\n    MD = '(min-width: 768px) and (max-width: 1023.9px)',\n    LG = '(min-width: 1024px) and (max-width: 1279.9px)',\n    XL = '(min-width: 1280px) and (max-width: 1535.9px)',\n    XXL = '(min-width: 1536px) ',\n}\n\nexport const StopsMediaQueryMapping = {\n    [Stops.FALLBACK]: StopsMediaQuery.BASE,\n    [Stops.BASE]: StopsMediaQuery.BASE,\n    [Stops.SM]: StopsMediaQuery.SM,\n    [Stops.MD]: StopsMediaQuery.MD,\n    [Stops.LG]: StopsMediaQuery.LG,\n    [Stops.XL]: StopsMediaQuery.XL,\n    [Stops.XXL]: StopsMediaQuery.XXL,\n};\n\nexport type CropFocus =\n    | 'center'\n    | 'top'\n    | 'right'\n    | 'left'\n    | 'bottom'\n    | 'top_right'\n    | 'top_left'\n    | 'bottom_right'\n    | 'bottom_left';\nexport type ImageFit = 'pad' | 'fill' | 'scale' | 'crop' | 'thumb';\n\nexport interface ImageConfiguration {\n    image: Asset;\n    ratioWidth: number;\n    ratioHeight: number;\n    widthLqip?: number;\n    width: number;\n    width2x: number;\n    width3x?: number;\n    quality?: number;\n    fit?: ImageFit;\n    focus?: CropFocus;\n}\nexport type Configurations = {\n    [key in Stops]?: ImageConfiguration;\n};\n\nexport interface Source {\n    srcSet: string;\n    defaultSrc: string;\n    mediaQuery: string;\n    stop: Stops;\n}\n\n@Component({\n    selector: 'app-lazy-picture',\n    templateUrl: './lazy-picture.component.html',\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    standalone: true,\n    imports: [NgClass],\n})\nexport class LazyPictureComponent implements OnChanges, OnInit {\n    @Input() configurations: Configurations;\n    @Input() alt: string = '';\n    @Input() additionalClasses: string[] | string = [];\n    @Input() lazy: boolean = true;\n    @Input() preload: boolean = false;\n\n    sources: Source[] = [];\n    sourcesMap: { [key in Stops]?: Source } = {};\n    fallback: Source;\n    stops = Stops;\n    trackBy(index: number, item: Source) {\n        return item.mediaQuery;\n    }\n\n    cssClasses: string[] = [];\n\n    constructor(\n        private contentfulService: ContentfulService,\n        private cd: ChangeDetectorRef,\n        private lazysizesService: LazysizesService,\n        private environmentService: EnvironmentService,\n        @Inject(DOCUMENT) private doc: Document\n    ) {}\n\n    generateSource(stop: Stops, configuration: ImageConfiguration): Source {\n        let [srcSet, defaultSrc] = ['', ''];\n        if (configuration.image) {\n            [srcSet, defaultSrc] = this.generateSrcSet(configuration);\n        }\n        return {\n            stop: stop,\n            srcSet: srcSet,\n            defaultSrc: defaultSrc,\n            mediaQuery: StopsMediaQueryMapping[stop],\n        };\n    }\n\n    generateSrcSet(configuration: ImageConfiguration): [string, string] {\n        let imageBaseUrl = fixAssetUrl(configuration.image.url);\n        if (imageBaseUrl.endsWith('.svg')) {\n            return [imageBaseUrl, imageBaseUrl];\n        }\n        const options = [];\n\n        if (configuration.quality) {\n            options.push(`q=${configuration.quality}`);\n        } else {\n            options.push(`q=80`);\n        }\n        if (configuration.fit) {\n            options.push(`fit=${configuration.fit}`);\n        } else {\n            options.push('fit=fill');\n        }\n        if (configuration.focus) {\n            options.push(`f=${configuration.focus}`);\n        } else {\n            options.push('f=center');\n        }\n        const urlWithOptions = `${imageBaseUrl}?${options.join('&')}`;\n        const width1x = this.generateWidth(\n            configuration.width,\n            configuration.ratioWidth,\n            configuration.ratioHeight\n        );\n        const width2x = this.generateWidth(\n            configuration.width2x,\n            configuration.ratioWidth,\n            configuration.ratioHeight\n        );\n        const width3x = this.generateWidth(\n            configuration.width3x || configuration.width2x,\n            configuration.ratioWidth,\n            configuration.ratioHeight\n        );\n        let defaultSrc = `${urlWithOptions}&${width1x}`;\n        if (configuration.widthLqip) {\n            const widthLqip = this.generateWidth(\n                configuration.widthLqip,\n                configuration.ratioWidth,\n                configuration.ratioHeight\n            );\n            defaultSrc = `${urlWithOptions}&${widthLqip}`;\n        }\n        return [\n            `${urlWithOptions}&${width1x} 1x, ${urlWithOptions}&${width2x} 2x, ${urlWithOptions}&${width3x} 3x`,\n            defaultSrc,\n        ];\n    }\n\n    generateWidth(width: number, ratioWidth: number, ratioHeight: number) {\n        if (ratioHeight && ratioWidth) {\n            const ratio = ratioHeight / ratioWidth;\n            return `w=${width}&h=${Math.round(width * ratio)}`;\n        } else {\n            return `w=${width}`;\n        }\n    }\n\n    ngOnChanges(changes: SimpleChanges): void {\n        if (changes.configurations && changes.configurations.currentValue) {\n            const configurationStops = Object.keys(this.configurations);\n            const fakeFallback = configurationStops.includes(Stops.FALLBACK)\n                ? {}\n                : {\n                      [Stops.FALLBACK]: {\n                          image: null,\n                          ratioWidth: 0,\n                          ratioHeight: 0,\n                          width: 0,\n                          width2x: 0,\n                      },\n                  };\n            const { FALLBACK, ...configurations } = {\n                ...fakeFallback,\n                ...this.configurations,\n            };\n            this.fallback = this.generateSource(Stops.FALLBACK, FALLBACK);\n            this.sources = Object.entries(configurations)\n                .filter(([stop, configuration]) => !!configuration.image)\n                .map(([stop, configuration]) =>\n                    this.generateSource(stop as Stops, configuration)\n                );\n            this.sources.sort(\n                (a, b) => +b.stop.slice(0, -2) - +a.stop.slice(0, -2)\n            );\n            this.sourcesMap = Object.assign(\n                {},\n                ...this.sources.map(source => ({ [source.stop]: source }))\n            );\n            if (this.preload) {\n                this.generatePreloadLinks();\n            }\n            this.cd.detectChanges();\n        }\n        if (changes.additionalClasses || changes.lazy) {\n            this.cssClasses = (this.lazy ? ['lazyload'] : []).concat(\n                this.additionalClasses\n            );\n            this.cd.detectChanges();\n        }\n    }\n\n    generatePreloadLinks() {\n        for (const value in Stops) {\n            const source = this.sourcesMap[Stops[value]];\n            if (source) {\n                this.createPreloadLink(\n                    source.defaultSrc,\n                    source.srcSet,\n                    Stops[value],\n                    StopsMediaQuery[value]\n                );\n            }\n        }\n    }\n\n    createPreloadLink(\n        url: string,\n        srcSet: string,\n        key: string,\n        mediaQuery: string\n    ) {\n        // only create preload links on the server, since it will be too late on the client side anyway.\n        if (\n            !this.doc.getElementById(key) &&\n            this.environmentService.isServer()\n        ) {\n            const link: HTMLLinkElement = this.doc.createElement('link');\n            link.setAttribute('rel', 'preload');\n            link.setAttribute('href', url);\n            link.setAttribute('id', key);\n            link.setAttribute('media', mediaQuery);\n            link.setAttribute('as', 'image');\n            link.setAttribute('imagesrcset', srcSet);\n            if (!this.lazy) {\n                link.setAttribute('fetchpriority', 'high');\n            }\n            // preload lcp image as early as possible\n            this.doc.getElementById('viewport-definition').after(link);\n        }\n    }\n\n    ngOnInit(): void {\n        this.cssClasses = (this.lazy ? ['lazyload'] : []).concat(\n            this.additionalClasses\n        );\n        this.cd.detectChanges();\n    }\n}\n", "@if (sources.length) {\n    <div class=\"inline\">\n        <picture>\n            @for (source of sources; track trackBy($index, source)) {\n                <source\n                    [attr.srcset]=\"lazy ? null : source.srcSet || ''\"\n                    [attr.data-srcset]=\"lazy ? source.srcSet || '' : null\"\n                    [media]=\"source.mediaQuery\" />\n            }\n\n            <img\n                class=\"w-full bg-lightergrey\"\n                [attr.src]=\"lazy ? null : fallback?.defaultSrc\"\n                [attr.data-src]=\"lazy ? fallback?.defaultSrc : null\"\n                [attr.fetchPriority]=\"preload ? 'high' : 'low'\"\n                [alt]=\"\n                    alt ||\n                    configurations[stops.FALLBACK]?.image.description ||\n                    configurations[stops.FALLBACK]?.image.title\n                \"\n                [ngClass]=\"cssClasses\" />\n        </picture>\n    </div>\n}\n"],
  "mappings": "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",
  "names": ["\u0275\u0275element", "\u0275\u0275property", "source_r1", "mediaQuery", "\u0275\u0275elementStart", "\u0275\u0275repeaterCreate", "LazyPictureComponent_Conditional_0_For_3_Template", "\u0275\u0275componentInstance", "trackBy", "\u0275\u0275elementEnd", "\u0275\u0275advance", "\u0275\u0275repeater", "ctx_r1", "sources", "alt", "configurations", "stops", "FALLBACK", "image", "description", "title", "cssClasses", "Stops", "StopsMediaQuery", "StopsMediaQueryMapping", "BASE", "SM", "MD", "LG", "XL", "XXL", "LazyPictureComponent", "index", "item", "constructor", "contentfulService", "cd", "lazysizesService", "environmentService", "doc", "additionalClasses", "lazy", "preload", "sourcesMap", "generateSource", "stop", "configuration", "srcSet", "defaultSrc", "generateSrcSet", "imageBaseUrl", "fixAssetUrl", "url", "endsWith", "options", "quality", "push", "fit", "focus", "urlWithOptions", "join", "width1x", "generateWidth", "width", "ratioWidth", "ratioHeight", "width2x", "width3x", "widthLqip", "ratio", "Math", "round", "ngOnChanges", "changes", "currentValue", "fakeFallback", "Object", "keys", "includes", "_a", "__spreadValues", "fallback", "entries", "filter", "map", "sort", "a", "b", "slice", "assign", "source", "generatePreloadLinks", "detectChanges", "concat", "value", "createPreloadLink", "key", "getElementById", "isServer", "link", "createElement", "setAttribute", "after", "ngOnInit", "\u0275\u0275directiveInject", "ContentfulService", "ChangeDetectorRef", "LazysizesService", "EnvironmentService", "DOCUMENT", "selectors", "inputs", "standalone", "features", "\u0275\u0275NgOnChangesFeature", "\u0275\u0275StandaloneFeature", "decls", "vars", "consts", "template", "rf", "ctx", "\u0275\u0275template", "LazyPictureComponent_Conditional_0_Template", "\u0275\u0275conditional", "length", "NgClass", "encapsulation", "changeDetection"]
}