@daffodil/design 0.81.0 → 0.82.0

package/fesm2022/daffodil-design-media-gallery.mjs

@@ -1,11 +1,9 @@
+import { NgTemplateOutlet, CommonModule } from '@angular/common';
 import * as i0 from '@angular/core';
-import { Injectable, TemplateRef, ViewContainerRef, Component, ChangeDetectionStrategy, Inject, ViewChild, Directive, HostBinding, HostListener, Input, NgModule } from '@angular/core';
-import * as i2 from '@daffodil/design';
+import { isDevMode, Directive, Inject, Input, EventEmitter, contentChildren, computed, signal, ElementRef, Component, ChangeDetectionStrategy, HostBinding, Output, ViewChildren, NgModule } from '@angular/core';
+import * as i1 from '@daffodil/design';
 import { DaffSelectableDirective, DaffArticleEncapsulatedDirective, DaffSkeletonableDirective } from '@daffodil/design';
 import { createSingleInjectionToken } from '@daffodil/core';
-import { BehaviorSubject, Subject } from 'rxjs';
-import { takeUntil } from 'rxjs/operators';
-import { CommonModule } from '@angular/common';
 
 const { token: DAFF_MEDIA_GALLERY_TOKEN, 
 /**
@@ -13,279 +11,184 @@ const { token: DAFF_MEDIA_GALLERY_TOKEN,
  */
 provider: provideDaffMediaGalleryToken, } = createSingleInjectionToken('DAFF_MEDIA_GALLERY_TOKEN');
 
-const isGallery = (element) => !('gallery' in element);
-class DaffMediaGalleryRegistry {
-    constructor() {
-        this.galleries = {};
-    }
+let uniqueThumbnailId = 0;
+/**
+ * A structural directive marking thumbnails for the `DaffMediaGalleryComponent`.
+ *
+ * ```html
+ * <ng-template daffThumbnail></ng-template>
+ * ```
+ */
+class DaffThumbnailDirective {
     /**
-     * @description
-     * Adds a media element to the internal registry.
+     * The id of the thumbnail.
      */
-    add(gallery, thumbnail) {
-        if (this.galleries[gallery.name]) {
-            let newGallery = this.galleries[gallery.name].getValue();
-            if (thumbnail) {
-                newGallery = {
-                    ...newGallery,
-                    thumbnails: [
-                        ...newGallery.thumbnails.filter(t => t !== thumbnail),
-                        thumbnail,
-                    ],
-                };
-            }
-            this.galleries[gallery.name].next(newGallery);
-        }
-        else {
-            this.galleries[gallery.name] = new BehaviorSubject({
-                gallery,
-                thumbnails: thumbnail ? [thumbnail] : [],
-            });
-        }
-        if (this.galleries[gallery.name].getValue().thumbnails.length === 1) {
-            thumbnail.select();
-        }
+    get id() {
+        return this.gallery.id + '-thumbnail-' + uniqueThumbnailId;
     }
     /**
-     * @description
-     * Removes a thumbnail or gallery from the internal registry.
+     * The id of the thumbnail panel.
      */
-    remove(element) {
-        if (isGallery(element)) {
-            this.removeGallery(element);
-        }
-        else {
-            this.removeThumbnail(element);
-        }
-    }
-    removeThumbnail(thumbnail) {
-        if (!this.galleries[thumbnail.gallery.name]) {
-            return;
-        }
-        const gallery = this.galleries[thumbnail.gallery.name].getValue();
-        const index = gallery.thumbnails.indexOf(thumbnail);
-        if (index === -1) {
-            return;
-        }
-        this.galleries[thumbnail.gallery.name].next({
-            ...gallery,
-            thumbnails: [
-                ...gallery.thumbnails.slice(0, index),
-                ...gallery.thumbnails.slice(index + 1),
-            ],
-        });
-    }
-    removeGallery(gallery) {
-        delete this.galleries[gallery.name];
+    get panelId() {
+        return this.id + '-el';
     }
     /**
-     * @description
-     * Selects a media element for a given gallery.
+     * @docs-private
      */
-    select(thumbnail) {
-        if (!this.galleries[thumbnail.gallery.name]) {
-            return;
-        }
-        const gallery = this.galleries[thumbnail.gallery.name].getValue();
-        const index = gallery.thumbnails.indexOf(thumbnail);
-        if (thumbnail.selected || index === -1) {
-            return;
-        }
-        this.galleries[thumbnail.gallery.name].next({
-            ...gallery,
-            thumbnails: [
-                ...gallery.thumbnails.filter(m => m !== thumbnail).map(m => m.deselect()),
-                thumbnail.select(),
-            ],
-        });
-    }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: DaffMediaGalleryRegistry, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    /** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: DaffMediaGalleryRegistry, providedIn: 'root' }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: DaffMediaGalleryRegistry, decorators: [{
-            type: Injectable,
-            args: [{ providedIn: 'root' }]
-        }] });
-
-/**
- * Dynamically renders the selected `DaffThumbnailDirective` in a `daff-media-gallery` any time the selected thumbnail
- * changes.
- */
-class DaffMediaRendererComponent {
-    constructor(componentFactoryResolver, registry, gallery) {
-        this.componentFactoryResolver = componentFactoryResolver;
-        this.registry = registry;
+    constructor(gallery, templateRef) {
         this.gallery = gallery;
+        this.templateRef = templateRef;
         /**
-         * Private tracker for indicating when the component is destroyed.
+         * The file path to a thumbnail, presumably an image.
          */
-        this._destroy$ = new Subject();
-    }
-    ngOnInit() {
-        this.registry.galleries[this.gallery.name]
-            .pipe(takeUntil(this._destroy$))
-            .subscribe((gallery) => {
-            /**
-             * Clear out the slot for the dynamically rendered thumbnail
-             */
-            this.slot.clear();
-            const _selectedThumbnail = gallery.thumbnails.filter(media => media.selected).shift();
-            /**
-             * If there's no selected media, render nothing.
-             */
-            if (!_selectedThumbnail) {
-                return;
-            }
-            const _selectedThumbnailComponent = _selectedThumbnail.component;
-            /**
-             * Create the component to insert.
-             */
-            const component = this.componentFactoryResolver.resolveComponentFactory(_selectedThumbnailComponent.constructor);
-            const componentRef = this.slot.createComponent(component);
-            /**
-             * Fill the component with it's values from the original component
-             */
-            component.inputs.forEach(input => {
-                componentRef.instance[input.propName] = _selectedThumbnailComponent[input.propName];
-            });
-            /**
-             * Trigger a change detection on the component tree, outside the cycle to address
-             * the fact that the component was created outside a typical CD loop.
-             */
-            componentRef.changeDetectorRef.detectChanges();
-        });
-    }
-    /**
-     * Used to unsubscribe from the dynamic component.
-     */
-    ngOnDestroy() {
-        this._destroy$.next(true);
-        this._destroy$.unsubscribe();
-    }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: DaffMediaRendererComponent, deps: [{ token: i0.ComponentFactoryResolver }, { token: DaffMediaGalleryRegistry }, { token: DAFF_MEDIA_GALLERY_TOKEN }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.7", type: DaffMediaRendererComponent, isStandalone: true, selector: "daff-media-renderer", viewQueries: [{ propertyName: "slot", first: true, predicate: TemplateRef, descendants: true, read: ViewContainerRef, static: true }], ngImport: i0, template: '<ng-template></ng-template>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: DaffMediaRendererComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'daff-media-renderer',
-                    template: '<ng-template></ng-template>',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    standalone: true,
-                }]
-        }], ctorParameters: () => [{ type: i0.ComponentFactoryResolver }, { type: DaffMediaGalleryRegistry }, { type: undefined, decorators: [{
-                    type: Inject,
-                    args: [DAFF_MEDIA_GALLERY_TOKEN]
-                }] }], propDecorators: { slot: [{
-                type: ViewChild,
-                args: [TemplateRef, { static: true, read: ViewContainerRef }]
-            }] } });
-
-const { 
-/**
- * A multi provider injection token that marks a component as renderable for the `DaffMediaRendererComponent`.
- */
-token: daffThumbnailCompatToken, 
-/**
- * Provider function for {@link daffThumbnailCompatToken}.
- */
-provider: provideDaffThumbnailCompatToken, } = createSingleInjectionToken('thumbnailCompatToken');
-
-/**
- * A directive marking thumbnails for the `DaffMediaRendererComponent`. Needs to be wrapped in a `daff-media-gallery` component
- * and needs to be placed on a component that is provided as a `daffThumbnailCompatToken`.
- */
-class DaffThumbnailDirective {
-    constructor(component, registry, gallery, selectedDirective) {
-        this.component = component;
-        this.registry = registry;
-        this.gallery = gallery;
-        this.selectedDirective = selectedDirective;
+        this.thumbnailSrc = undefined;
         /**
-         * Adds a class for styling a thumbnail
+         * The button label for the thumbnail.
          */
-        this.class = true;
-    }
-    get selected() {
-        return this.selectedDirective.selected;
-    }
-    select() {
-        this.selectedDirective.select();
-        return this;
-    }
-    deselect() {
-        this.selectedDirective.deselect();
-        return this;
+        this.label = undefined;
+        this.isVideo = false;
+        uniqueThumbnailId++;
     }
     /**
-     * Adds a click event to trigger selection of the media element.
-     *
-     * @param event: MouseEvent
+     * @docs-private
      */
-    onClick($event) {
-        this.registry.select(this);
-    }
     ngOnInit() {
-        this.registry.add(this.gallery, this);
-    }
-    ngOnDestroy() {
-        this.registry.remove(this);
+        if (!this.label && isDevMode()) {
+            console.warn('The thumbnail ' + this.id + ' is missing a label.');
+        }
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: DaffThumbnailDirective, deps: [{ token: daffThumbnailCompatToken }, { token: DaffMediaGalleryRegistry }, { token: DAFF_MEDIA_GALLERY_TOKEN }, { token: i2.DaffSelectableDirective }], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.7", type: DaffThumbnailDirective, isStandalone: true, selector: "[daffThumbnail]", host: { listeners: { "click": "onClick($event)" }, properties: { "class.daff-thumbnail": "this.class" } }, hostDirectives: [{ directive: i2.DaffSelectableDirective, inputs: ["selected", "selected"], outputs: ["becameSelected", "becameSelected"] }], ngImport: i0 }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: DaffThumbnailDirective, deps: [{ token: DAFF_MEDIA_GALLERY_TOKEN }, { token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.1.5", type: DaffThumbnailDirective, isStandalone: true, selector: "[daffThumbnail]", inputs: { thumbnailSrc: "thumbnailSrc", label: "label", isVideo: "isVideo" }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: DaffThumbnailDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: DaffThumbnailDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[daffThumbnail]',
-                    standalone: true,
-                    hostDirectives: [{
-                            directive: DaffSelectableDirective,
-                            inputs: ['selected'],
-                            outputs: ['becameSelected'],
-                        }],
                 }]
-        }], ctorParameters: () => [{ type: i0.Type, decorators: [{
-                    type: Inject,
-                    args: [daffThumbnailCompatToken]
-                }] }, { type: DaffMediaGalleryRegistry }, { type: undefined, decorators: [{
+        }], ctorParameters: () => [{ type: undefined, decorators: [{
                     type: Inject,
                     args: [DAFF_MEDIA_GALLERY_TOKEN]
-                }] }, { type: i2.DaffSelectableDirective }], propDecorators: { class: [{
-                type: HostBinding,
-                args: ['class.daff-thumbnail']
-            }], onClick: [{
-                type: HostListener,
-                args: ['click', ['$event']]
+                }] }, { type: i0.TemplateRef }], propDecorators: { thumbnailSrc: [{
+                type: Input
+            }], label: [{
+                type: Input
+            }], isVideo: [{
+                type: Input
             }] } });
 
 let uniqueGalleryId = 0;
+/**
+ * ```html
+ * <daff-media-gallery></daff-media-gallery>
+ * ```
+ */
 class DaffMediaGalleryComponent {
-    constructor(registry) {
-        this.registry = registry;
+    /**
+     * The id of the gallery.
+     */
+    get id() {
+        return this._id;
+    }
+    set id(val) {
+        if (!val) {
+            return;
+        }
+        this._id = val;
+    }
+    ;
+    /**
+     * @docs-private
+     */
+    constructor(skeletonDirective) {
+        this.skeletonDirective = skeletonDirective;
+        /**
+         * @docs-private
+         */
+        this.role = 'tablist';
         /**
+         * @docs-private
+         *
          * Adds a class for styling the media gallery
          */
         this.class = true;
         /**
-         * The name of the gallery
+         * An event indicating that the selected media gallery element has changed.
+         */
+        this.elementChange = new EventEmitter();
+        /**
+         * @docs-private
+         */
+        this._thumbnails = contentChildren(DaffThumbnailDirective);
+        /**
+         * @docs-private
          */
-        this.name = `${uniqueGalleryId}`;
+        this._selectedThumbnail = computed(() => {
+            const idx = this._selectedIndex();
+            if (!idx) {
+                return this._thumbnails().at(0);
+            }
+            return this._thumbnails().at(idx);
+        });
+        this._selectedIndex = signal(null);
         uniqueGalleryId++;
     }
-    ngOnInit() {
-        this.registry.add(this);
+    /**
+     * @docs-private
+     *
+     * Whether or not the component its currently displaying its skeleton state.
+     */
+    get skeleton() {
+        return this.skeletonDirective.skeleton;
+    }
+    focusSelected() {
+        this._thumbnailButtons.get(this._selectedIndex())?.nativeElement.focus();
     }
-    ngOnDestroy() {
-        this.registry.remove(this);
+    /**
+     * Select a specific entry in the media gallery by its index (starting at 0).
+     */
+    selectIndex(index) {
+        this._selectedIndex.set(index);
+        this.elementChange.emit(index);
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: DaffMediaGalleryComponent, deps: [{ token: DaffMediaGalleryRegistry }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.7", type: DaffMediaGalleryComponent, isStandalone: true, selector: "daff-media-gallery", inputs: { name: "name" }, host: { properties: { "class.daff-media-gallery": "this.class" } }, providers: [
+    /**
+     * Navigate to the next element in the list of thumbnails.
+     */
+    next(focus = true) {
+        this._selectedIndex.update((curr) => ((curr ?? 0) + 1 + this._thumbnails().length) % this._thumbnails().length);
+        this.elementChange.emit(this._selectedIndex());
+        this.focusSelected();
+    }
+    /**
+     * Navigate to the previous element in the list of thumbnails.
+     */
+    previous(focus = true) {
+        this._selectedIndex.update((curr) => ((curr ?? 0) - 1 + this._thumbnails().length) % this._thumbnails().length);
+        this.elementChange.emit(this._selectedIndex());
+        this.focusSelected();
+    }
+    /**
+     * Select the first element
+     */
+    selectFirst(focus = true) {
+        this._selectedIndex.set(0);
+        this.elementChange.emit(this._selectedIndex());
+        this.focusSelected();
+    }
+    /**
+     * Select the last element of the gallery.
+     */
+    selectLast(focus = true) {
+        this._selectedIndex.set(this._thumbnails().length - 1);
+        this.elementChange.emit(this._selectedIndex());
+        this.focusSelected();
+    }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: DaffMediaGalleryComponent, deps: [{ token: i1.DaffSkeletonableDirective }], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.1.5", type: DaffMediaGalleryComponent, isStandalone: true, selector: "daff-media-gallery", inputs: { id: "id" }, outputs: { elementChange: "elementChange" }, host: { properties: { "attr.role": "this.role", "attr.id": "this.id", "class.daff-media-gallery": "this.class" } }, providers: [
             // eslint-disable-next-line @typescript-eslint/no-use-before-define
             { provide: DAFF_MEDIA_GALLERY_TOKEN, useExisting: DaffMediaGalleryComponent },
-        ], hostDirectives: [{ directive: i2.DaffArticleEncapsulatedDirective }, { directive: i2.DaffSkeletonableDirective, inputs: ["skeleton", "skeleton"] }], ngImport: i0, template: "<div class=\"daff-media-gallery__thumbnails\">\n\t<ng-content select=\"[daffThumbnail]\"></ng-content>\n</div>\n<div class=\"daff-media-gallery__selected-thumbnail\">\n\t<daff-media-renderer></daff-media-renderer>\n</div>", styles: [":host(.daff-media-gallery){display:flex;flex-direction:column}@media (min-width: 1024px){:host(.daff-media-gallery){flex-direction:row}}:host(.daff-media-gallery) ::ng-deep .daff-thumbnail{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;display:inline-block;height:64px;width:64px;margin:0 2px;max-width:100%;overflow:hidden;user-select:none}@media (min-width: 480px){:host(.daff-media-gallery) ::ng-deep .daff-thumbnail{height:72px;width:72px}}@media (min-width: 1024px){:host(.daff-media-gallery) ::ng-deep .daff-thumbnail{display:block;margin:0 0 4px;height:80px;width:80px}}:host(.daff-media-gallery).daff-skeleton ::ng-deep .daff-thumbnail{display:flex;position:relative}:host(.daff-media-gallery).daff-skeleton ::ng-deep .daff-thumbnail:before{animation-name:loading;animation-duration:1s;animation-timing-function:linear;animation-iteration-count:infinite;animation-direction:alternate;content:\"\";height:72px;width:72px;position:absolute;top:0;left:0}@media (min-width: 1024px){:host(.daff-media-gallery).daff-skeleton ::ng-deep .daff-thumbnail{display:flex;position:relative}:host(.daff-media-gallery).daff-skeleton ::ng-deep .daff-thumbnail:before{animation-name:loading;animation-duration:1s;animation-timing-function:linear;animation-iteration-count:infinite;animation-direction:alternate;content:\"\";height:80px;width:80px;position:absolute;top:0;left:0}}:host(.daff-media-gallery).daff-skeleton ::ng-deep img{opacity:0}:host(.daff-media-gallery).daff-skeleton .daff-media-gallery__selected-thumbnail{display:flex;position:relative}:host(.daff-media-gallery).daff-skeleton .daff-media-gallery__selected-thumbnail:before{animation-name:loading;animation-duration:1s;animation-timing-function:linear;animation-iteration-count:infinite;animation-direction:alternate;content:\"\";height:100%;width:100%;position:absolute;top:0;left:0}.daff-media-gallery__thumbnails{margin:0 -2px;max-height:100%;order:2}@media (min-width: 1024px){.daff-media-gallery__thumbnails{margin:0 8px 0 0;order:1}}.daff-media-gallery__selected-thumbnail{display:block;flex-grow:1;order:1;position:relative}@media (min-width: 1024px){.daff-media-gallery__selected-thumbnail{order:2}}\n"], dependencies: [{ kind: "component", type: DaffMediaRendererComponent, selector: "daff-media-renderer" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], queries: [{ propertyName: "_thumbnails", predicate: DaffThumbnailDirective, isSignal: true }], viewQueries: [{ propertyName: "_thumbnailButtons", predicate: ["thumbnailButtons"], descendants: true, read: ElementRef }], hostDirectives: [{ directive: i1.DaffArticleEncapsulatedDirective }, { directive: i1.DaffSkeletonableDirective, inputs: ["skeleton", "skeleton"] }], ngImport: i0, template: "<ng-content></ng-content>\n\n<div class=\"daff-media-gallery__thumbnails\" #thumbnailsEl>\n\t@if(skeleton) {\n\t\t<div class=\"daff-thumbnail\"></div>\n\t\t<div class=\"daff-thumbnail\"></div>\n\t\t<div class=\"daff-thumbnail\"></div>\n\t}\n\t@else {\n\t\t@for (thumbnail of _thumbnails(); track thumbnail; let index = $index) {\n\t\t\t<button \n\t\t\t\t#thumbnailButtons\n\t\t\t\tclass=\"daff-thumbnail\" \n\t\t\t\trole=\"tab\"\n\t\t\t\tdaffSelected\n\t\t\t\t[selected]=\"thumbnail === _selectedThumbnail()\"\n\t\t\t\tattr.aria-label=\"{{ thumbnail.label ?? 'Gallery Element ' + (index + 1) }}\"\n\t\t\t\t[attr.aria-selected]=\"thumbnail === _selectedThumbnail() ? 'true' : 'false'\"\n\t\t\t\t[attr.aria-controls]=\"thumbnail.panelId\"\n\t\t\t\t[attr.tabindex]=\"thumbnail === _selectedThumbnail() ? 0 : -1\"\n\t\t\t\t(click)=\"selectIndex(index)\"\n\t\t\t\t[attr.id]=\"thumbnail.id\" \n\t\t\t\t(keydown.arrowright)=\"next()\"\n\t\t\t\t(keydown.arrowleft)=\"previous()\">\n\t\t\t\t@if (thumbnail.thumbnailSrc) {\n\t\t\t\t\t<img [src]=\"thumbnail.thumbnailSrc\" aria-hidden=\"true\"/>\n\t\t\t\t}\n\t\t\t\t@if (thumbnail.isVideo) {\n\t\t\t\t\t<div class=\"daff-media-gallery__video-button\">\n\t\t\t\t\t</div>\n\t\t\t\t}\n\t\t\t</button>\n\t\t}\n\t}\n</div>\n@let el = this._selectedThumbnail();\n<div \n\tclass=\"daff-media-gallery__selected-thumbnail\"\n\ttabindex=\"0\"\n\t#selectedThumbnail\n\trole=\"tabpanel\"\n\t[attr.id]=\"el?.panelId\">\n\t\t@if(el) {\n\t\t\t<ng-container *ngTemplateOutlet=\"el.templateRef\"></ng-container>\n\t\t}\n\t\t@else {\n\t\t\t<div class=\"daff-media-gallery__skeleton-placeholder\"></div>\n\t\t}\n</div>", styles: [":host(.daff-media-gallery){display:flex;flex-direction:column;gap:.5rem}@media (min-width: 1024px){:host(.daff-media-gallery){flex-direction:row}}:host(.daff-media-gallery) ::ng-deep .daff-thumbnail{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;display:flex;flex-direction:row;justify-content:center;align-items:center;height:4rem;width:4rem;max-width:100%;overflow:hidden;user-select:none;padding:0;position:relative;flex-shrink:0}@media (min-width: 480px){:host(.daff-media-gallery) ::ng-deep .daff-thumbnail{height:4.5rem;width:4.5rem}}@media (min-width: 1024px){:host(.daff-media-gallery) ::ng-deep .daff-thumbnail{flex-direction:column;height:5rem;width:5rem}}:host(.daff-media-gallery) ::ng-deep .daff-thumbnail img{display:block;width:100%}:host(.daff-media-gallery).daff-skeleton ::ng-deep .daff-thumbnail{display:flex;position:relative}:host(.daff-media-gallery).daff-skeleton ::ng-deep .daff-thumbnail:before{animation-name:loading;animation-duration:1s;animation-timing-function:linear;animation-iteration-count:infinite;animation-direction:alternate;content:\"\";height:4rem;width:4rem;position:absolute;top:0;left:0}@media (min-width: 480px){:host(.daff-media-gallery).daff-skeleton ::ng-deep .daff-thumbnail{display:flex;position:relative}:host(.daff-media-gallery).daff-skeleton ::ng-deep .daff-thumbnail:before{animation-name:loading;animation-duration:1s;animation-timing-function:linear;animation-iteration-count:infinite;animation-direction:alternate;content:\"\";height:4.5rem;width:4.5rem;position:absolute;top:0;left:0}}@media (min-width: 1024px){:host(.daff-media-gallery).daff-skeleton ::ng-deep .daff-thumbnail{display:flex;position:relative}:host(.daff-media-gallery).daff-skeleton ::ng-deep .daff-thumbnail:before{animation-name:loading;animation-duration:1s;animation-timing-function:linear;animation-iteration-count:infinite;animation-direction:alternate;content:\"\";height:5rem;width:5rem;position:absolute;top:0;left:0}}:host(.daff-media-gallery).daff-skeleton ::ng-deep img{opacity:0}:host(.daff-media-gallery).daff-skeleton .daff-media-gallery__selected-thumbnail{display:flex;position:relative;flex-grow:1}:host(.daff-media-gallery).daff-skeleton .daff-media-gallery__selected-thumbnail:before{animation-name:loading;animation-duration:1s;animation-timing-function:linear;animation-iteration-count:infinite;animation-direction:alternate;content:\"\";height:100%;width:100%;position:absolute;top:0;left:0}:host(.daff-media-gallery).daff-skeleton .daff-media-gallery__skeleton-placeholder{height:16rem}@media (min-width: 1024px){:host(.daff-media-gallery).daff-skeleton .daff-media-gallery__skeleton-placeholder{height:30rem}}.daff-media-gallery__thumbnails{display:flex;flex-direction:row;flex-shrink:0;gap:.25rem;order:2;max-width:100%;overflow-x:auto}@media (min-width: 1024px){.daff-media-gallery__thumbnails{max-height:29.5rem;flex-direction:column;overflow-y:auto;order:1}}.daff-media-gallery__selected-thumbnail{display:flex;align-items:center;justify-content:center;flex-grow:1;width:100%;order:1}@media (min-width: 1024px){.daff-media-gallery__selected-thumbnail{order:2;margin:0}}.daff-media-gallery__video-button{width:2rem;height:2rem;border-radius:100%;position:absolute}.daff-media-gallery__video-button:after{content:\"\";position:absolute;width:.75rem;height:.75rem;left:60%;top:50%;transform:translate(-60%,-50%) rotate(90deg);clip-path:polygon(50% 15%,0% 100%,100% 100%);transition:all .4s ease-in-out}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: DaffSelectableDirective, selector: "[daffSelected]", inputs: ["selected"], outputs: ["becameSelected"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: DaffMediaGalleryComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: DaffMediaGalleryComponent, decorators: [{
             type: Component,
             args: [{ selector: 'daff-media-gallery', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
                         // eslint-disable-next-line @typescript-eslint/no-use-before-define
@@ -297,36 +200,46 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImpor
                             inputs: ['skeleton'],
                         },
                     ], imports: [
-                        DaffMediaRendererComponent,
                         DaffThumbnailDirective,
-                    ], template: "<div class=\"daff-media-gallery__thumbnails\">\n\t<ng-content select=\"[daffThumbnail]\"></ng-content>\n</div>\n<div class=\"daff-media-gallery__selected-thumbnail\">\n\t<daff-media-renderer></daff-media-renderer>\n</div>", styles: [":host(.daff-media-gallery){display:flex;flex-direction:column}@media (min-width: 1024px){:host(.daff-media-gallery){flex-direction:row}}:host(.daff-media-gallery) ::ng-deep .daff-thumbnail{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;display:inline-block;height:64px;width:64px;margin:0 2px;max-width:100%;overflow:hidden;user-select:none}@media (min-width: 480px){:host(.daff-media-gallery) ::ng-deep .daff-thumbnail{height:72px;width:72px}}@media (min-width: 1024px){:host(.daff-media-gallery) ::ng-deep .daff-thumbnail{display:block;margin:0 0 4px;height:80px;width:80px}}:host(.daff-media-gallery).daff-skeleton ::ng-deep .daff-thumbnail{display:flex;position:relative}:host(.daff-media-gallery).daff-skeleton ::ng-deep .daff-thumbnail:before{animation-name:loading;animation-duration:1s;animation-timing-function:linear;animation-iteration-count:infinite;animation-direction:alternate;content:\"\";height:72px;width:72px;position:absolute;top:0;left:0}@media (min-width: 1024px){:host(.daff-media-gallery).daff-skeleton ::ng-deep .daff-thumbnail{display:flex;position:relative}:host(.daff-media-gallery).daff-skeleton ::ng-deep .daff-thumbnail:before{animation-name:loading;animation-duration:1s;animation-timing-function:linear;animation-iteration-count:infinite;animation-direction:alternate;content:\"\";height:80px;width:80px;position:absolute;top:0;left:0}}:host(.daff-media-gallery).daff-skeleton ::ng-deep img{opacity:0}:host(.daff-media-gallery).daff-skeleton .daff-media-gallery__selected-thumbnail{display:flex;position:relative}:host(.daff-media-gallery).daff-skeleton .daff-media-gallery__selected-thumbnail:before{animation-name:loading;animation-duration:1s;animation-timing-function:linear;animation-iteration-count:infinite;animation-direction:alternate;content:\"\";height:100%;width:100%;position:absolute;top:0;left:0}.daff-media-gallery__thumbnails{margin:0 -2px;max-height:100%;order:2}@media (min-width: 1024px){.daff-media-gallery__thumbnails{margin:0 8px 0 0;order:1}}.daff-media-gallery__selected-thumbnail{display:block;flex-grow:1;order:1;position:relative}@media (min-width: 1024px){.daff-media-gallery__selected-thumbnail{order:2}}\n"] }]
-        }], ctorParameters: () => [{ type: DaffMediaGalleryRegistry }], propDecorators: { class: [{
+                        NgTemplateOutlet,
+                        DaffSelectableDirective,
+                    ], template: "<ng-content></ng-content>\n\n<div class=\"daff-media-gallery__thumbnails\" #thumbnailsEl>\n\t@if(skeleton) {\n\t\t<div class=\"daff-thumbnail\"></div>\n\t\t<div class=\"daff-thumbnail\"></div>\n\t\t<div class=\"daff-thumbnail\"></div>\n\t}\n\t@else {\n\t\t@for (thumbnail of _thumbnails(); track thumbnail; let index = $index) {\n\t\t\t<button \n\t\t\t\t#thumbnailButtons\n\t\t\t\tclass=\"daff-thumbnail\" \n\t\t\t\trole=\"tab\"\n\t\t\t\tdaffSelected\n\t\t\t\t[selected]=\"thumbnail === _selectedThumbnail()\"\n\t\t\t\tattr.aria-label=\"{{ thumbnail.label ?? 'Gallery Element ' + (index + 1) }}\"\n\t\t\t\t[attr.aria-selected]=\"thumbnail === _selectedThumbnail() ? 'true' : 'false'\"\n\t\t\t\t[attr.aria-controls]=\"thumbnail.panelId\"\n\t\t\t\t[attr.tabindex]=\"thumbnail === _selectedThumbnail() ? 0 : -1\"\n\t\t\t\t(click)=\"selectIndex(index)\"\n\t\t\t\t[attr.id]=\"thumbnail.id\" \n\t\t\t\t(keydown.arrowright)=\"next()\"\n\t\t\t\t(keydown.arrowleft)=\"previous()\">\n\t\t\t\t@if (thumbnail.thumbnailSrc) {\n\t\t\t\t\t<img [src]=\"thumbnail.thumbnailSrc\" aria-hidden=\"true\"/>\n\t\t\t\t}\n\t\t\t\t@if (thumbnail.isVideo) {\n\t\t\t\t\t<div class=\"daff-media-gallery__video-button\">\n\t\t\t\t\t</div>\n\t\t\t\t}\n\t\t\t</button>\n\t\t}\n\t}\n</div>\n@let el = this._selectedThumbnail();\n<div \n\tclass=\"daff-media-gallery__selected-thumbnail\"\n\ttabindex=\"0\"\n\t#selectedThumbnail\n\trole=\"tabpanel\"\n\t[attr.id]=\"el?.panelId\">\n\t\t@if(el) {\n\t\t\t<ng-container *ngTemplateOutlet=\"el.templateRef\"></ng-container>\n\t\t}\n\t\t@else {\n\t\t\t<div class=\"daff-media-gallery__skeleton-placeholder\"></div>\n\t\t}\n</div>", styles: [":host(.daff-media-gallery){display:flex;flex-direction:column;gap:.5rem}@media (min-width: 1024px){:host(.daff-media-gallery){flex-direction:row}}:host(.daff-media-gallery) ::ng-deep .daff-thumbnail{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;display:flex;flex-direction:row;justify-content:center;align-items:center;height:4rem;width:4rem;max-width:100%;overflow:hidden;user-select:none;padding:0;position:relative;flex-shrink:0}@media (min-width: 480px){:host(.daff-media-gallery) ::ng-deep .daff-thumbnail{height:4.5rem;width:4.5rem}}@media (min-width: 1024px){:host(.daff-media-gallery) ::ng-deep .daff-thumbnail{flex-direction:column;height:5rem;width:5rem}}:host(.daff-media-gallery) ::ng-deep .daff-thumbnail img{display:block;width:100%}:host(.daff-media-gallery).daff-skeleton ::ng-deep .daff-thumbnail{display:flex;position:relative}:host(.daff-media-gallery).daff-skeleton ::ng-deep .daff-thumbnail:before{animation-name:loading;animation-duration:1s;animation-timing-function:linear;animation-iteration-count:infinite;animation-direction:alternate;content:\"\";height:4rem;width:4rem;position:absolute;top:0;left:0}@media (min-width: 480px){:host(.daff-media-gallery).daff-skeleton ::ng-deep .daff-thumbnail{display:flex;position:relative}:host(.daff-media-gallery).daff-skeleton ::ng-deep .daff-thumbnail:before{animation-name:loading;animation-duration:1s;animation-timing-function:linear;animation-iteration-count:infinite;animation-direction:alternate;content:\"\";height:4.5rem;width:4.5rem;position:absolute;top:0;left:0}}@media (min-width: 1024px){:host(.daff-media-gallery).daff-skeleton ::ng-deep .daff-thumbnail{display:flex;position:relative}:host(.daff-media-gallery).daff-skeleton ::ng-deep .daff-thumbnail:before{animation-name:loading;animation-duration:1s;animation-timing-function:linear;animation-iteration-count:infinite;animation-direction:alternate;content:\"\";height:5rem;width:5rem;position:absolute;top:0;left:0}}:host(.daff-media-gallery).daff-skeleton ::ng-deep img{opacity:0}:host(.daff-media-gallery).daff-skeleton .daff-media-gallery__selected-thumbnail{display:flex;position:relative;flex-grow:1}:host(.daff-media-gallery).daff-skeleton .daff-media-gallery__selected-thumbnail:before{animation-name:loading;animation-duration:1s;animation-timing-function:linear;animation-iteration-count:infinite;animation-direction:alternate;content:\"\";height:100%;width:100%;position:absolute;top:0;left:0}:host(.daff-media-gallery).daff-skeleton .daff-media-gallery__skeleton-placeholder{height:16rem}@media (min-width: 1024px){:host(.daff-media-gallery).daff-skeleton .daff-media-gallery__skeleton-placeholder{height:30rem}}.daff-media-gallery__thumbnails{display:flex;flex-direction:row;flex-shrink:0;gap:.25rem;order:2;max-width:100%;overflow-x:auto}@media (min-width: 1024px){.daff-media-gallery__thumbnails{max-height:29.5rem;flex-direction:column;overflow-y:auto;order:1}}.daff-media-gallery__selected-thumbnail{display:flex;align-items:center;justify-content:center;flex-grow:1;width:100%;order:1}@media (min-width: 1024px){.daff-media-gallery__selected-thumbnail{order:2;margin:0}}.daff-media-gallery__video-button{width:2rem;height:2rem;border-radius:100%;position:absolute}.daff-media-gallery__video-button:after{content:\"\";position:absolute;width:.75rem;height:.75rem;left:60%;top:50%;transform:translate(-60%,-50%) rotate(90deg);clip-path:polygon(50% 15%,0% 100%,100% 100%);transition:all .4s ease-in-out}\n"] }]
+        }], ctorParameters: () => [{ type: i1.DaffSkeletonableDirective }], propDecorators: { role: [{
                 type: HostBinding,
-                args: ['class.daff-media-gallery']
-            }], name: [{
+                args: ['attr.role']
+            }], id: [{
+                type: HostBinding,
+                args: ['attr.id']
+            }, {
                 type: Input
+            }], class: [{
+                type: HostBinding,
+                args: ['class.daff-media-gallery']
+            }], elementChange: [{
+                type: Output
+            }], _thumbnailButtons: [{
+                type: ViewChildren,
+                args: ['thumbnailButtons', { read: ElementRef }]
             }] } });
 
 /**
  * @deprecated in favor of {@link DAFF_MEDIA_GALLERY_COMPONENTS}. Deprecated in version 0.78.0. Will be removed in version 1.0.0.
  */
 class DaffMediaGalleryModule {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: DaffMediaGalleryModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.0.7", ngImport: i0, type: DaffMediaGalleryModule, imports: [CommonModule,
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: DaffMediaGalleryModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.1.5", ngImport: i0, type: DaffMediaGalleryModule, imports: [CommonModule,
             DaffMediaGalleryComponent,
-            DaffThumbnailDirective,
-            DaffMediaRendererComponent], exports: [DaffMediaGalleryComponent,
+            DaffThumbnailDirective], exports: [DaffMediaGalleryComponent,
             DaffThumbnailDirective] }); }
-    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: DaffMediaGalleryModule, imports: [CommonModule] }); }
+    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: DaffMediaGalleryModule, imports: [CommonModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: DaffMediaGalleryModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: DaffMediaGalleryModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [
                         CommonModule,
                         DaffMediaGalleryComponent,
                         DaffThumbnailDirective,
-                        DaffMediaRendererComponent,
                     ],
                     exports: [
                         DaffMediaGalleryComponent,
@@ -335,15 +248,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImpor
                 }]
         }] });
 
+/**
+ * @docs-private
+ */
 const DAFF_MEDIA_GALLERY_COMPONENTS = [
     DaffMediaGalleryComponent,
     DaffThumbnailDirective,
-    DaffMediaRendererComponent,
 ];
 
 /**
  * Generated bundle index. Do not edit.
  */
 
-export { DAFF_MEDIA_GALLERY_COMPONENTS, DaffMediaGalleryComponent, DaffMediaGalleryModule, DaffThumbnailDirective, daffThumbnailCompatToken };
+export { DAFF_MEDIA_GALLERY_COMPONENTS, DaffMediaGalleryComponent, DaffMediaGalleryModule, DaffThumbnailDirective };
 //# sourceMappingURL=daffodil-design-media-gallery.mjs.map

package/fesm2022/daffodil-design-media-gallery.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"daffodil-design-media-gallery.mjs","sources":["../../../libs/design/media-gallery/src/helpers/media-gallery-token.ts","../../../libs/design/media-gallery/src/registry/media-gallery.registry.ts","../../../libs/design/media-gallery/src/media-renderer/media-renderer.component.ts","../../../libs/design/media-gallery/src/thumbnail/thumbnail-compat.token.ts","../../../libs/design/media-gallery/src/thumbnail/thumbnail.directive.ts","../../../libs/design/media-gallery/src/media-gallery/media-gallery.component.ts","../../../libs/design/media-gallery/src/media-gallery/media-gallery.component.html","../../../libs/design/media-gallery/src/media-gallery.module.ts","../../../libs/design/media-gallery/src/media-gallery.ts","../../../libs/design/media-gallery/src/daffodil-design-media-gallery.ts"],"sourcesContent":["import { createSingleInjectionToken } from '@daffodil/core';\n\nimport { DaffMediaGalleryRegistration } from './media-gallery-registration.interface';\n\nexport const {\n  token: DAFF_MEDIA_GALLERY_TOKEN,\n  /**\n   * Provider function for {@link DAFF_MEDIA_GALLERY_TOKEN}.\n   */\n  provider: provideDaffMediaGalleryToken,\n} = createSingleInjectionToken<DaffMediaGalleryRegistration>('DAFF_MEDIA_GALLERY_TOKEN');\n","import { Injectable } from '@angular/core';\nimport { BehaviorSubject } from 'rxjs';\n\nimport { DaffMediaGalleryRegistration } from '../helpers/media-gallery-registration.interface';\nimport { DaffThumbnailRegistration } from '../thumbnail/thumbnail-registration.interface';\n\nexport interface DaffMediaGalleryDict {\n  [galleryName: string]: BehaviorSubject<DaffMediaGallery>;\n}\n\nexport interface DaffMediaGallery {\n  gallery: DaffMediaGalleryRegistration;\n  thumbnails: DaffThumbnailRegistration[];\n}\n\nexport const isGallery = (element: DaffThumbnailRegistration | DaffMediaGalleryRegistration): element is DaffMediaGalleryRegistration => !('gallery' in element);\n\n@Injectable({ providedIn: 'root' })\nexport class DaffMediaGalleryRegistry {\n  galleries: DaffMediaGalleryDict = {};\n\n  /**\n   * @description\n   * Adds a media element to the internal registry.\n   */\n  add(gallery: DaffMediaGalleryRegistration, thumbnail?: DaffThumbnailRegistration) {\n    if(this.galleries[gallery.name]) {\n      let newGallery = this.galleries[gallery.name].getValue();\n\n      if(thumbnail) {\n        newGallery = {\n          ...newGallery,\n          thumbnails: [\n            ...newGallery.thumbnails.filter(t => t !== thumbnail),\n            thumbnail,\n          ],\n        };\n      }\n\n      this.galleries[gallery.name].next(newGallery);\n    } else {\n      this.galleries[gallery.name] = new BehaviorSubject({\n        gallery,\n        thumbnails: thumbnail ? [thumbnail] : [],\n      });\n    }\n\n    if(this.galleries[gallery.name].getValue().thumbnails.length === 1) {\n      thumbnail.select();\n    }\n  }\n\n  /**\n   * @description\n   * Removes a thumbnail or gallery from the internal registry.\n   */\n  remove(element: DaffThumbnailRegistration | DaffMediaGalleryRegistration) {\n    if(isGallery(element)) {\n      this.removeGallery(element);\n    } else {\n      this.removeThumbnail(element);\n    }\n  }\n\n  private removeThumbnail(thumbnail: DaffThumbnailRegistration) {\n    if(!this.galleries[thumbnail.gallery.name]) {\n      return;\n    }\n    const gallery = this.galleries[thumbnail.gallery.name].getValue();\n    const index = gallery.thumbnails.indexOf(thumbnail);\n\n    if(index === -1) {\n      return;\n    }\n\n    this.galleries[thumbnail.gallery.name].next({\n      ...gallery,\n      thumbnails: [\n        ...gallery.thumbnails.slice(0, index),\n        ...gallery.thumbnails.slice(index + 1),\n      ],\n    });\n  }\n\n  private removeGallery(gallery: DaffMediaGalleryRegistration) {\n    delete this.galleries[gallery.name];\n  }\n\n  /**\n   * @description\n   * Selects a media element for a given gallery.\n   */\n  select(thumbnail: DaffThumbnailRegistration) {\n    if(!this.galleries[thumbnail.gallery.name]) {\n      return;\n    }\n\n    const gallery = this.galleries[thumbnail.gallery.name].getValue();\n    const index = gallery.thumbnails.indexOf(thumbnail);\n\n    if(thumbnail.selected || index === -1){\n      return;\n    }\n\n    this.galleries[thumbnail.gallery.name].next({\n      ...gallery,\n      thumbnails: [\n        ...gallery.thumbnails.filter(m => m !== thumbnail).map(m => m.deselect()),\n        thumbnail.select(),\n      ],\n    });\n  }\n}\n","import {\n  Component,\n  OnInit,\n  ComponentFactoryResolver,\n  Type,\n  ViewChild,\n  ViewContainerRef,\n  TemplateRef,\n  ChangeDetectionStrategy,\n  OnDestroy,\n  Inject,\n} from '@angular/core';\nimport { Subject } from 'rxjs';\nimport { takeUntil } from 'rxjs/operators';\n\nimport { DaffMediaGalleryRegistration } from '../helpers/media-gallery-registration.interface';\nimport { DAFF_MEDIA_GALLERY_TOKEN } from '../helpers/media-gallery-token';\nimport { DaffMediaGalleryRegistry } from '../registry/media-gallery.registry';\n\n/**\n * Dynamically renders the selected `DaffThumbnailDirective` in a `daff-media-gallery` any time the selected thumbnail\n * changes.\n */\n@Component({\n  selector: 'daff-media-renderer',\n  template: '<ng-template></ng-template>',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  standalone: true,\n})\nexport class DaffMediaRendererComponent implements OnInit, OnDestroy {\n\n  /**\n   * Private tracker for indicating when the component is destroyed.\n   */\n  private _destroy$ = new Subject();\n\n  constructor(\n    private componentFactoryResolver: ComponentFactoryResolver,\n    private registry: DaffMediaGalleryRegistry,\n    @Inject(DAFF_MEDIA_GALLERY_TOKEN) private gallery: DaffMediaGalleryRegistration,\n  ) {}\n\n  /**\n   * The slot that the \"component\" is rendered into.\n   */\n  @ViewChild(TemplateRef, { static: true, read: ViewContainerRef })\n  slot: ViewContainerRef;\n\n  ngOnInit() {\n    this.registry.galleries[this.gallery.name]\n      .pipe(takeUntil(this._destroy$))\n      .subscribe((gallery) => {\n\n        /**\n         * Clear out the slot for the dynamically rendered thumbnail\n         */\n        this.slot.clear();\n\n        const _selectedThumbnail = gallery.thumbnails.filter(media => media.selected).shift();\n\n        /**\n         * If there's no selected media, render nothing.\n         */\n        if(!_selectedThumbnail) {\n          return;\n        }\n\n        const _selectedThumbnailComponent = _selectedThumbnail.component;\n\n        /**\n         * Create the component to insert.\n         */\n        const component = this.componentFactoryResolver.resolveComponentFactory(\n        <Type<unknown>>_selectedThumbnailComponent.constructor,\n        );\n        const componentRef = this.slot.createComponent(component);\n\n        /**\n         * Fill the component with it's values from the original component\n         */\n        component.inputs.forEach(input => {\n          componentRef.instance[input.propName] = _selectedThumbnailComponent[input.propName];\n        });\n\n        /**\n         * Trigger a change detection on the component tree, outside the cycle to address\n         * the fact that the component was created outside a typical CD loop.\n         */\n        componentRef.changeDetectorRef.detectChanges();\n      });\n  }\n\n  /**\n   * Used to unsubscribe from the dynamic component.\n   */\n  ngOnDestroy() {\n    this._destroy$.next(true);\n    this._destroy$.unsubscribe();\n  }\n}\n\n","import { createSingleInjectionToken } from '@daffodil/core';\n\nexport const {\n  /**\n   * A multi provider injection token that marks a component as renderable for the `DaffMediaRendererComponent`.\n   */\n  token: daffThumbnailCompatToken,\n  /**\n   * Provider function for {@link daffThumbnailCompatToken}.\n   */\n  provider: provideDaffThumbnailCompatToken,\n} = createSingleInjectionToken<unknown>('thumbnailCompatToken');\n","import {\n  Directive,\n  Inject,\n  Type,\n  HostBinding,\n  HostListener,\n  OnInit,\n  OnDestroy,\n} from '@angular/core';\n\nimport { DaffSelectableDirective } from '@daffodil/design';\n\nimport { daffThumbnailCompatToken } from './thumbnail-compat.token';\nimport { DaffThumbnailRegistration } from './thumbnail-registration.interface';\nimport { DaffMediaGalleryRegistration } from '../helpers/media-gallery-registration.interface';\nimport { DAFF_MEDIA_GALLERY_TOKEN } from '../helpers/media-gallery-token';\nimport { DaffMediaGalleryRegistry } from '../registry/media-gallery.registry';\n\n/**\n * A directive marking thumbnails for the `DaffMediaRendererComponent`. Needs to be wrapped in a `daff-media-gallery` component\n * and needs to be placed on a component that is provided as a `daffThumbnailCompatToken`.\n */\n@Directive({\n  selector: '[daffThumbnail]',\n  standalone: true,\n  hostDirectives: [{\n    directive: DaffSelectableDirective,\n    inputs: ['selected'],\n    outputs: ['becameSelected'],\n  }],\n})\nexport class DaffThumbnailDirective implements OnInit, OnDestroy, DaffThumbnailRegistration {\n  constructor(\n    @Inject(daffThumbnailCompatToken) public component: Type<unknown>,\n    private registry: DaffMediaGalleryRegistry,\n    @Inject(DAFF_MEDIA_GALLERY_TOKEN) public gallery: DaffMediaGalleryRegistration,\n    private selectedDirective: DaffSelectableDirective,\n  ) {}\n\n  public get selected() {\n    return this.selectedDirective.selected;\n  }\n\n  public select() {\n    this.selectedDirective.select();\n    return this;\n  }\n\n  public deselect() {\n    this.selectedDirective.deselect();\n    return this;\n  }\n\n  /**\n   * Adds a class for styling a thumbnail\n   */\n  @HostBinding('class.daff-thumbnail') class = true;\n\n  /**\n   * Adds a click event to trigger selection of the media element.\n   *\n   * @param event: MouseEvent\n   */\n  @HostListener('click', ['$event']) onClick($event: MouseEvent) {\n    this.registry.select(this);\n  }\n\n  ngOnInit(): void {\n    this.registry.add(this.gallery, this);\n  }\n\n  ngOnDestroy(): void {\n    this.registry.remove(this);\n  }\n}\n","import {\n  Component,\n  HostBinding,\n  ChangeDetectionStrategy,\n  Input,\n  OnInit,\n  OnDestroy,\n} from '@angular/core';\n\nimport {\n  DaffArticleEncapsulatedDirective,\n  DaffSkeletonableDirective,\n} from '@daffodil/design';\n\nimport { DaffMediaGalleryRegistration } from '../helpers/media-gallery-registration.interface';\nimport { DAFF_MEDIA_GALLERY_TOKEN } from '../helpers/media-gallery-token';\nimport { DaffMediaRendererComponent } from '../media-renderer/media-renderer.component';\nimport { DaffMediaGalleryRegistry } from '../registry/media-gallery.registry';\nimport { DaffThumbnailDirective } from '../thumbnail/thumbnail.directive';\n\nlet uniqueGalleryId = 0;\n\n@Component({\n  selector: 'daff-media-gallery',\n  templateUrl: './media-gallery.component.html',\n  styleUrls: ['./media-gallery.component.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  providers: [\n    // eslint-disable-next-line @typescript-eslint/no-use-before-define\n    { provide: DAFF_MEDIA_GALLERY_TOKEN, useExisting: DaffMediaGalleryComponent },\n  ],\n  hostDirectives: [\n    { directive: DaffArticleEncapsulatedDirective },\n    {\n      directive: DaffSkeletonableDirective,\n      inputs: ['skeleton'],\n    },\n  ],\n  imports: [\n    DaffMediaRendererComponent,\n    DaffThumbnailDirective,\n  ],\n})\nexport class DaffMediaGalleryComponent implements DaffMediaGalleryRegistration, OnInit, OnDestroy {\n  /**\n   * Adds a class for styling the media gallery\n   */\n  @HostBinding('class.daff-media-gallery') class = true;\n\n  /**\n   * The name of the gallery\n   */\n  @Input() name = `${uniqueGalleryId}`;\n\n  constructor(private registry: DaffMediaGalleryRegistry) {\n    uniqueGalleryId++;\n  }\n\n  ngOnInit() {\n    this.registry.add(this);\n  }\n\n  ngOnDestroy() {\n    this.registry.remove(this);\n  }\n}\n","<div class=\"daff-media-gallery__thumbnails\">\n\t<ng-content select=\"[daffThumbnail]\"></ng-content>\n</div>\n<div class=\"daff-media-gallery__selected-thumbnail\">\n\t<daff-media-renderer></daff-media-renderer>\n</div>","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\n\nimport { DaffMediaGalleryComponent } from './media-gallery/media-gallery.component';\nimport { DaffMediaRendererComponent } from './media-renderer/media-renderer.component';\nimport { DaffThumbnailDirective } from './thumbnail/thumbnail.directive';\n\n/**\n * @deprecated in favor of {@link DAFF_MEDIA_GALLERY_COMPONENTS}. Deprecated in version 0.78.0. Will be removed in version 1.0.0.\n */\n@NgModule({\n  imports: [\n    CommonModule,\n    DaffMediaGalleryComponent,\n    DaffThumbnailDirective,\n    DaffMediaRendererComponent,\n  ],\n  exports: [\n    DaffMediaGalleryComponent,\n    DaffThumbnailDirective,\n  ],\n})\nexport class DaffMediaGalleryModule {}\n","import { DaffMediaGalleryComponent } from './media-gallery/media-gallery.component';\nimport { DaffMediaRendererComponent } from './media-renderer/media-renderer.component';\nimport { DaffThumbnailDirective } from './thumbnail/thumbnail.directive';\n\nexport const DAFF_MEDIA_GALLERY_COMPONENTS = <const> [\n  DaffMediaGalleryComponent,\n  DaffThumbnailDirective,\n  DaffMediaRendererComponent,\n];\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["i1.DaffMediaGalleryRegistry"],"mappings":"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"}
+{"version":3,"file":"daffodil-design-media-gallery.mjs","sources":["../../../libs/design/media-gallery/src/helpers/media-gallery-token.ts","../../../libs/design/media-gallery/src/thumbnail/thumbnail.directive.ts","../../../libs/design/media-gallery/src/media-gallery/media-gallery.component.ts","../../../libs/design/media-gallery/src/media-gallery/media-gallery.component.html","../../../libs/design/media-gallery/src/media-gallery.module.ts","../../../libs/design/media-gallery/src/media-gallery.ts","../../../libs/design/media-gallery/src/daffodil-design-media-gallery.ts"],"sourcesContent":["import { createSingleInjectionToken } from '@daffodil/core';\n\nimport { DaffMediaGalleryRegistration } from './media-gallery-registration.interface';\n\nexport const {\n  token: DAFF_MEDIA_GALLERY_TOKEN,\n  /**\n   * Provider function for {@link DAFF_MEDIA_GALLERY_TOKEN}.\n   */\n  provider: provideDaffMediaGalleryToken,\n} = createSingleInjectionToken<DaffMediaGalleryRegistration>('DAFF_MEDIA_GALLERY_TOKEN');\n","import {\n  Directive,\n  Inject,\n  Input,\n  TemplateRef,\n  OnInit,\n  isDevMode,\n} from '@angular/core';\n\nimport { DaffMediaGalleryRegistration } from '../helpers/media-gallery-registration.interface';\nimport { DAFF_MEDIA_GALLERY_TOKEN } from '../helpers/media-gallery-token';\n\nlet uniqueThumbnailId = 0;\n\n/**\n * A structural directive marking thumbnails for the `DaffMediaGalleryComponent`.\n *\n * ```html\n * <ng-template daffThumbnail></ng-template>\n * ```\n */\n@Directive({\n  selector: '[daffThumbnail]',\n})\nexport class DaffThumbnailDirective implements OnInit {\n\n  /**\n   * The id of the thumbnail.\n   */\n  get id(): string {\n    return this.gallery.id + '-thumbnail-' + uniqueThumbnailId;\n  }\n\n  /**\n   * The id of the thumbnail panel.\n   */\n  get panelId(): string {\n    return this.id + '-el';\n  }\n\n  /**\n   * The file path to a thumbnail, presumably an image.\n   */\n  @Input() thumbnailSrc = undefined;\n\n\n  /**\n   * The button label for the thumbnail.\n   */\n  @Input() label: string = undefined;\n\n  @Input() isVideo = false;\n\n  /**\n   * @docs-private\n   */\n  constructor(\n    @Inject(DAFF_MEDIA_GALLERY_TOKEN) public gallery: DaffMediaGalleryRegistration,\n    public templateRef: TemplateRef<unknown>,\n  ) {\n    uniqueThumbnailId++;\n  }\n\n  /**\n   * @docs-private\n   */\n  ngOnInit() {\n    if(!this.label && isDevMode()) {\n      console.warn('The thumbnail ' + this.id + ' is missing a label.');\n    }\n  }\n}\n","import { NgTemplateOutlet } from '@angular/common';\nimport {\n  Component,\n  HostBinding,\n  ChangeDetectionStrategy,\n  Input,\n  QueryList,\n  ViewChildren,\n  ElementRef,\n  Output,\n  EventEmitter,\n  contentChildren,\n  signal,\n  computed,\n  Signal,\n} from '@angular/core';\n\nimport {\n  DaffArticleEncapsulatedDirective,\n  DaffSelectableDirective,\n  DaffSkeletonableDirective,\n} from '@daffodil/design';\n\nimport { DaffMediaGalleryRegistration } from '../helpers/media-gallery-registration.interface';\nimport { DAFF_MEDIA_GALLERY_TOKEN } from '../helpers/media-gallery-token';\nimport { DaffThumbnailDirective } from '../thumbnail/thumbnail.directive';\n\nlet uniqueGalleryId = 0;\n\n/**\n * ```html\n * <daff-media-gallery></daff-media-gallery>\n * ```\n */\n@Component({\n  selector: 'daff-media-gallery',\n  templateUrl: './media-gallery.component.html',\n  styleUrls: ['./media-gallery.component.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  providers: [\n    // eslint-disable-next-line @typescript-eslint/no-use-before-define\n    { provide: DAFF_MEDIA_GALLERY_TOKEN, useExisting: DaffMediaGalleryComponent },\n  ],\n  hostDirectives: [\n    { directive: DaffArticleEncapsulatedDirective },\n    {\n      directive: DaffSkeletonableDirective,\n      inputs: ['skeleton'],\n    },\n  ],\n  imports: [\n    DaffThumbnailDirective,\n    NgTemplateOutlet,\n    DaffSelectableDirective,\n  ],\n})\nexport class DaffMediaGalleryComponent implements DaffMediaGalleryRegistration {\n\n  /**\n   * @docs-private\n   */\n  @HostBinding('attr.role') role = 'tablist';\n\n  /**\n   * The internal id of the gallery.\n   */\n  private _id: string;\n\n  /**\n   * The id of the gallery.\n   */\n  @HostBinding('attr.id')\n  @Input()\n  get id() {\n    return this._id;\n  }\n  set id(val: string | undefined | null) {\n    if(!val){\n      return;\n    }\n    this._id = val;\n  };\n\n  /**\n   * @docs-private\n   *\n   * Adds a class for styling the media gallery\n   */\n  @HostBinding('class.daff-media-gallery') private class = true;\n\n  /**\n   * An event indicating that the selected media gallery element has changed.\n   */\n  @Output() elementChange: EventEmitter<number> = new EventEmitter<number>();\n\n  /**\n   * @docs-private\n   */\n  _thumbnails = contentChildren(DaffThumbnailDirective);\n\n  /**\n   * @docs-private\n   */\n  @ViewChildren('thumbnailButtons', { read: ElementRef }) private _thumbnailButtons: QueryList<ElementRef<HTMLElement>>;\n\n  /**\n   * @docs-private\n   */\n  constructor(private skeletonDirective: DaffSkeletonableDirective) {\n    uniqueGalleryId++;\n  }\n\n  /**\n   * @docs-private\n   *\n   * Whether or not the component its currently displaying its skeleton state.\n   */\n  get skeleton() {\n    return this.skeletonDirective.skeleton;\n  }\n\n  /**\n   * @docs-private\n   */\n  _selectedThumbnail: Signal<DaffThumbnailDirective> = computed(() => {\n    const idx = this._selectedIndex();\n    if(!idx) {\n      return this._thumbnails().at(0);\n    }\n    return this._thumbnails().at(idx);\n  });\n\n  private _selectedIndex = signal<number | null>(null);\n\n\n  private focusSelected() {\n    this._thumbnailButtons.get(this._selectedIndex())?.nativeElement.focus();\n  }\n\n  /**\n   * Select a specific entry in the media gallery by its index (starting at 0).\n   */\n  selectIndex(index: number) {\n    this._selectedIndex.set(index);\n    this.elementChange.emit(index);\n  }\n\n  /**\n   * Navigate to the next element in the list of thumbnails.\n   */\n  next(focus: boolean = true) {\n    this._selectedIndex.update((curr) => ((curr ?? 0) + 1 + this._thumbnails().length) % this._thumbnails().length);\n    this.elementChange.emit(this._selectedIndex());\n    this.focusSelected();\n  }\n\n  /**\n   * Navigate to the previous element in the list of thumbnails.\n   */\n  previous(focus: boolean = true) {\n    this._selectedIndex.update((curr) => ((curr ?? 0) - 1 + this._thumbnails().length) % this._thumbnails().length);\n    this.elementChange.emit(this._selectedIndex());\n    this.focusSelected();\n  }\n\n  /**\n   * Select the first element\n   */\n  selectFirst(focus: boolean = true) {\n    this._selectedIndex.set(0);\n    this.elementChange.emit(this._selectedIndex());\n    this.focusSelected();\n  }\n\n  /**\n   * Select the last element of the gallery.\n   */\n  selectLast(focus: boolean = true) {\n    this._selectedIndex.set(this._thumbnails().length - 1);\n    this.elementChange.emit(this._selectedIndex());\n    this.focusSelected();\n  }\n}\n","<ng-content></ng-content>\n\n<div class=\"daff-media-gallery__thumbnails\" #thumbnailsEl>\n\t@if(skeleton) {\n\t\t<div class=\"daff-thumbnail\"></div>\n\t\t<div class=\"daff-thumbnail\"></div>\n\t\t<div class=\"daff-thumbnail\"></div>\n\t}\n\t@else {\n\t\t@for (thumbnail of _thumbnails(); track thumbnail; let index = $index) {\n\t\t\t<button \n\t\t\t\t#thumbnailButtons\n\t\t\t\tclass=\"daff-thumbnail\" \n\t\t\t\trole=\"tab\"\n\t\t\t\tdaffSelected\n\t\t\t\t[selected]=\"thumbnail === _selectedThumbnail()\"\n\t\t\t\tattr.aria-label=\"{{ thumbnail.label ?? 'Gallery Element ' + (index + 1) }}\"\n\t\t\t\t[attr.aria-selected]=\"thumbnail === _selectedThumbnail() ? 'true' : 'false'\"\n\t\t\t\t[attr.aria-controls]=\"thumbnail.panelId\"\n\t\t\t\t[attr.tabindex]=\"thumbnail === _selectedThumbnail() ? 0 : -1\"\n\t\t\t\t(click)=\"selectIndex(index)\"\n\t\t\t\t[attr.id]=\"thumbnail.id\" \n\t\t\t\t(keydown.arrowright)=\"next()\"\n\t\t\t\t(keydown.arrowleft)=\"previous()\">\n\t\t\t\t@if (thumbnail.thumbnailSrc) {\n\t\t\t\t\t<img [src]=\"thumbnail.thumbnailSrc\" aria-hidden=\"true\"/>\n\t\t\t\t}\n\t\t\t\t@if (thumbnail.isVideo) {\n\t\t\t\t\t<div class=\"daff-media-gallery__video-button\">\n\t\t\t\t\t</div>\n\t\t\t\t}\n\t\t\t</button>\n\t\t}\n\t}\n</div>\n@let el = this._selectedThumbnail();\n<div \n\tclass=\"daff-media-gallery__selected-thumbnail\"\n\ttabindex=\"0\"\n\t#selectedThumbnail\n\trole=\"tabpanel\"\n\t[attr.id]=\"el?.panelId\">\n\t\t@if(el) {\n\t\t\t<ng-container *ngTemplateOutlet=\"el.templateRef\"></ng-container>\n\t\t}\n\t\t@else {\n\t\t\t<div class=\"daff-media-gallery__skeleton-placeholder\"></div>\n\t\t}\n</div>","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\n\nimport { DaffMediaGalleryComponent } from './media-gallery/media-gallery.component';\nimport { DaffThumbnailDirective } from './thumbnail/thumbnail.directive';\n\n/**\n * @deprecated in favor of {@link DAFF_MEDIA_GALLERY_COMPONENTS}. Deprecated in version 0.78.0. Will be removed in version 1.0.0.\n */\n@NgModule({\n  imports: [\n    CommonModule,\n    DaffMediaGalleryComponent,\n    DaffThumbnailDirective,\n  ],\n  exports: [\n    DaffMediaGalleryComponent,\n    DaffThumbnailDirective,\n  ],\n})\nexport class DaffMediaGalleryModule {}\n","import { DaffMediaGalleryComponent } from './media-gallery/media-gallery.component';\nimport { DaffThumbnailDirective } from './thumbnail/thumbnail.directive';\n\n/**\n * @docs-private\n */\nexport const DAFF_MEDIA_GALLERY_COMPONENTS = <const> [\n  DaffMediaGalleryComponent,\n  DaffThumbnailDirective,\n];\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}