primeng 20.1.2 → 20.2.0

package/fesm2022/primeng-focustrap.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"primeng-focustrap.mjs","sources":["../../src/focustrap/focustrap.ts","../../src/focustrap/primeng-focustrap.ts"],"sourcesContent":["import { DOCUMENT, isPlatformBrowser } from '@angular/common';\nimport { booleanAttribute, Directive, inject, Input, NgModule, PLATFORM_ID, SimpleChanges } from '@angular/core';\nimport { createElement, focus, getFirstFocusableElement, getLastFocusableElement } from '@primeuix/utils';\nimport { BaseComponent } from 'primeng/basecomponent';\n\n/**\n * Focus Trap keeps focus within a certain DOM element while tabbing.\n * @group Components\n */\n@Directive({\n    selector: '[pFocusTrap]',\n    standalone: true\n})\nexport class FocusTrap extends BaseComponent {\n    /**\n     * When set as true, focus wouldn't be managed.\n     * @group Props\n     */\n    @Input({ transform: booleanAttribute }) pFocusTrapDisabled: boolean = false;\n\n    platformId = inject(PLATFORM_ID);\n\n    document: Document = inject(DOCUMENT);\n\n    firstHiddenFocusableElement!: HTMLElement;\n\n    lastHiddenFocusableElement!: HTMLElement;\n\n    ngOnInit() {\n        super.ngOnInit();\n        if (isPlatformBrowser(this.platformId) && !this.pFocusTrapDisabled) {\n            !this.firstHiddenFocusableElement && !this.lastHiddenFocusableElement && this.createHiddenFocusableElements();\n        }\n    }\n\n    ngOnChanges(changes: SimpleChanges) {\n        super.ngOnChanges(changes);\n        if (changes.pFocusTrapDisabled && isPlatformBrowser(this.platformId)) {\n            if (changes.pFocusTrapDisabled.currentValue) {\n                this.removeHiddenFocusableElements();\n            } else {\n                this.createHiddenFocusableElements();\n            }\n        }\n    }\n\n    removeHiddenFocusableElements() {\n        if (this.firstHiddenFocusableElement && this.firstHiddenFocusableElement.parentNode) {\n            this.firstHiddenFocusableElement.parentNode.removeChild(this.firstHiddenFocusableElement);\n        }\n\n        if (this.lastHiddenFocusableElement && this.lastHiddenFocusableElement.parentNode) {\n            this.lastHiddenFocusableElement.parentNode.removeChild(this.lastHiddenFocusableElement);\n        }\n    }\n    getComputedSelector(selector) {\n        return `:not(.p-hidden-focusable):not([data-p-hidden-focusable=\"true\"])${selector ?? ''}`;\n    }\n\n    createHiddenFocusableElements() {\n        const tabindex = '0';\n\n        const createFocusableElement = (onFocus) => {\n            return createElement('span', {\n                class: 'p-hidden-accessible p-hidden-focusable',\n                tabindex,\n                role: 'presentation',\n                'aria-hidden': true,\n                'data-p-hidden-accessible': true,\n                'data-p-hidden-focusable': true,\n                onFocus: onFocus?.bind(this)\n            });\n        };\n\n        this.firstHiddenFocusableElement = createFocusableElement(this.onFirstHiddenElementFocus);\n        this.lastHiddenFocusableElement = createFocusableElement(this.onLastHiddenElementFocus);\n\n        this.firstHiddenFocusableElement.setAttribute('data-pc-section', 'firstfocusableelement');\n        this.lastHiddenFocusableElement.setAttribute('data-pc-section', 'lastfocusableelement');\n\n        this.el.nativeElement.prepend(this.firstHiddenFocusableElement);\n        this.el.nativeElement.append(this.lastHiddenFocusableElement);\n    }\n\n    onFirstHiddenElementFocus(event) {\n        const { currentTarget, relatedTarget } = event;\n        const focusableElement =\n            relatedTarget === this.lastHiddenFocusableElement || !this.el.nativeElement?.contains(relatedTarget) ? getFirstFocusableElement(currentTarget.parentElement, ':not(.p-hidden-focusable)') : this.lastHiddenFocusableElement;\n\n        focus(focusableElement as any);\n    }\n\n    onLastHiddenElementFocus(event) {\n        const { currentTarget, relatedTarget } = event;\n        const focusableElement =\n            relatedTarget === this.firstHiddenFocusableElement || !this.el.nativeElement?.contains(relatedTarget) ? getLastFocusableElement(currentTarget.parentElement, ':not(.p-hidden-focusable)') : this.firstHiddenFocusableElement;\n\n        focus(focusableElement as any);\n    }\n}\n\n@NgModule({\n    imports: [FocusTrap],\n    exports: [FocusTrap]\n})\nexport class FocusTrapModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"primeng-focustrap.mjs","sources":["../../src/focustrap/focustrap.ts","../../src/focustrap/primeng-focustrap.ts"],"sourcesContent":["import { DOCUMENT, isPlatformBrowser } from '@angular/common';\nimport { booleanAttribute, Directive, inject, Input, NgModule, PLATFORM_ID, SimpleChanges } from '@angular/core';\nimport { createElement, focus, getFirstFocusableElement, getLastFocusableElement } from '@primeuix/utils';\nimport { BaseComponent } from 'primeng/basecomponent';\n\n/**\n * Focus Trap keeps focus within a certain DOM element while tabbing.\n * @group Components\n */\n@Directive({\n    selector: '[pFocusTrap]',\n    standalone: true\n})\nexport class FocusTrap extends BaseComponent {\n    /**\n     * When set as true, focus wouldn't be managed.\n     * @group Props\n     */\n    @Input({ transform: booleanAttribute }) pFocusTrapDisabled: boolean = false;\n\n    platformId = inject(PLATFORM_ID);\n\n    document: Document = inject(DOCUMENT);\n\n    firstHiddenFocusableElement!: HTMLElement;\n\n    lastHiddenFocusableElement!: HTMLElement;\n\n    ngOnInit() {\n        super.ngOnInit();\n        if (isPlatformBrowser(this.platformId) && !this.pFocusTrapDisabled) {\n            !this.firstHiddenFocusableElement && !this.lastHiddenFocusableElement && this.createHiddenFocusableElements();\n        }\n    }\n\n    ngOnChanges(changes: SimpleChanges) {\n        super.ngOnChanges(changes);\n        if (changes.pFocusTrapDisabled && isPlatformBrowser(this.platformId)) {\n            if (changes.pFocusTrapDisabled.currentValue) {\n                this.removeHiddenFocusableElements();\n            } else {\n                this.createHiddenFocusableElements();\n            }\n        }\n    }\n\n    removeHiddenFocusableElements() {\n        if (this.firstHiddenFocusableElement && this.firstHiddenFocusableElement.parentNode) {\n            this.firstHiddenFocusableElement.parentNode.removeChild(this.firstHiddenFocusableElement);\n        }\n\n        if (this.lastHiddenFocusableElement && this.lastHiddenFocusableElement.parentNode) {\n            this.lastHiddenFocusableElement.parentNode.removeChild(this.lastHiddenFocusableElement);\n        }\n    }\n    getComputedSelector(selector) {\n        return `:not(.p-hidden-focusable):not([data-p-hidden-focusable=\"true\"])${selector ?? ''}`;\n    }\n\n    createHiddenFocusableElements() {\n        const tabindex = '0';\n\n        const createFocusableElement = (onFocus) => {\n            return createElement('span', {\n                class: 'p-hidden-accessible p-hidden-focusable',\n                tabindex,\n                role: 'presentation',\n                'aria-hidden': true,\n                'data-p-hidden-accessible': true,\n                'data-p-hidden-focusable': true,\n                onFocus: onFocus?.bind(this)\n            }) as HTMLElement;\n        };\n\n        this.firstHiddenFocusableElement = createFocusableElement(this.onFirstHiddenElementFocus);\n        this.lastHiddenFocusableElement = createFocusableElement(this.onLastHiddenElementFocus);\n\n        this.firstHiddenFocusableElement.setAttribute('data-pc-section', 'firstfocusableelement');\n        this.lastHiddenFocusableElement.setAttribute('data-pc-section', 'lastfocusableelement');\n\n        this.el.nativeElement.prepend(this.firstHiddenFocusableElement);\n        this.el.nativeElement.append(this.lastHiddenFocusableElement);\n    }\n\n    onFirstHiddenElementFocus(event) {\n        const { currentTarget, relatedTarget } = event;\n        const focusableElement =\n            relatedTarget === this.lastHiddenFocusableElement || !this.el.nativeElement?.contains(relatedTarget) ? getFirstFocusableElement(currentTarget.parentElement, ':not(.p-hidden-focusable)') : this.lastHiddenFocusableElement;\n\n        focus(focusableElement as any);\n    }\n\n    onLastHiddenElementFocus(event) {\n        const { currentTarget, relatedTarget } = event;\n        const focusableElement =\n            relatedTarget === this.firstHiddenFocusableElement || !this.el.nativeElement?.contains(relatedTarget) ? getLastFocusableElement(currentTarget.parentElement, ':not(.p-hidden-focusable)') : this.firstHiddenFocusableElement;\n\n        focus(focusableElement as any);\n    }\n}\n\n@NgModule({\n    imports: [FocusTrap],\n    exports: [FocusTrap]\n})\nexport class FocusTrapModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}

package/fesm2022/primeng-galleria.mjs

@@ -3,7 +3,7 @@ import * as i1 from '@angular/common';
 import { isPlatformBrowser, CommonModule } from '@angular/common';
 import * as i0 from '@angular/core';
 import { Injectable, EventEmitter, inject, PLATFORM_ID, numberAttribute, booleanAttribute, ContentChildren, ContentChild, ViewChild, Output, Input, Inject, ViewEncapsulation, ChangeDetectionStrategy, Component, HostListener, NgModule } from '@angular/core';
-import { addClass, focus, findSingle, removeClass, uuid, setAttribute, find, getAttribute } from '@primeuix/utils';
+import { addClass, findSingle, focus, removeClass, uuid, setAttribute, find, getAttribute } from '@primeuix/utils';
 import { PrimeTemplate, SharedModule } from 'primeng/api';
 import { BaseComponent } from 'primeng/basecomponent';
 import { blockBodyScroll, unblockBodyScroll } from 'primeng/dom';
@@ -94,10 +94,10 @@ class GalleriaStyle extends BaseStyle {
     name = 'galleria';
     theme = style;
     classes = classes;
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: GalleriaStyle, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: GalleriaStyle });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: GalleriaStyle, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: GalleriaStyle });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: GalleriaStyle, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: GalleriaStyle, decorators: [{
             type: Injectable
         }] });
 /**
@@ -495,7 +495,9 @@ class Galleria extends BaseComponent {
             case 'visible':
                 this.enableModality();
                 setTimeout(() => {
-                    focus(findSingle(this.container.nativeElement, '[data-pc-section="closebutton"]'));
+                    const focusTarget = findSingle(this.container?.nativeElement, '[data-pc-section="closebutton"]');
+                    if (focusTarget)
+                        focus(focusTarget);
                 }, 25);
                 break;
             case 'void':
@@ -533,8 +535,8 @@ class Galleria extends BaseComponent {
             this.disableModality();
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: Galleria, deps: [{ token: PLATFORM_ID }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "20.3.0", type: Galleria, isStandalone: false, selector: "p-galleria", inputs: { activeIndex: "activeIndex", fullScreen: ["fullScreen", "fullScreen", booleanAttribute], id: "id", value: "value", numVisible: ["numVisible", "numVisible", numberAttribute], responsiveOptions: "responsiveOptions", showItemNavigators: ["showItemNavigators", "showItemNavigators", booleanAttribute], showThumbnailNavigators: ["showThumbnailNavigators", "showThumbnailNavigators", booleanAttribute], showItemNavigatorsOnHover: ["showItemNavigatorsOnHover", "showItemNavigatorsOnHover", booleanAttribute], changeItemOnIndicatorHover: ["changeItemOnIndicatorHover", "changeItemOnIndicatorHover", booleanAttribute], circular: ["circular", "circular", booleanAttribute], autoPlay: ["autoPlay", "autoPlay", booleanAttribute], shouldStopAutoplayByClick: ["shouldStopAutoplayByClick", "shouldStopAutoplayByClick", booleanAttribute], transitionInterval: ["transitionInterval", "transitionInterval", numberAttribute], showThumbnails: ["showThumbnails", "showThumbnails", booleanAttribute], thumbnailsPosition: "thumbnailsPosition", verticalThumbnailViewPortHeight: "verticalThumbnailViewPortHeight", showIndicators: ["showIndicators", "showIndicators", booleanAttribute], showIndicatorsOnItem: ["showIndicatorsOnItem", "showIndicatorsOnItem", booleanAttribute], indicatorsPosition: "indicatorsPosition", baseZIndex: ["baseZIndex", "baseZIndex", numberAttribute], maskClass: "maskClass", containerClass: "containerClass", containerStyle: "containerStyle", showTransitionOptions: "showTransitionOptions", hideTransitionOptions: "hideTransitionOptions", visible: "visible" }, outputs: { activeIndexChange: "activeIndexChange", visibleChange: "visibleChange" }, providers: [GalleriaStyle], queries: [{ propertyName: "headerTemplate", first: true, predicate: ["header"] }, { propertyName: "footerTemplate", first: true, predicate: ["footer"] }, { propertyName: "indicatorTemplate", first: true, predicate: ["indicator"] }, { propertyName: "captionTemplate", first: true, predicate: ["caption"] }, { propertyName: "_closeIconTemplate", first: true, predicate: ["closeicon"] }, { propertyName: "_previousThumbnailIconTemplate", first: true, predicate: ["previousthumbnailicon"] }, { propertyName: "_nextThumbnailIconTemplate", first: true, predicate: ["nextthumbnailicon"] }, { propertyName: "_itemPreviousIconTemplate", first: true, predicate: ["itempreviousicon"] }, { propertyName: "_itemNextIconTemplate", first: true, predicate: ["itemnexticon"] }, { propertyName: "_itemTemplate", first: true, predicate: ["item"] }, { propertyName: "_thumbnailTemplate", first: true, predicate: ["thumbnail"] }, { propertyName: "templates", predicate: PrimeTemplate }], viewQueries: [{ propertyName: "mask", first: true, predicate: ["mask"], descendants: true }, { propertyName: "container", first: true, predicate: ["container"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: Galleria, deps: [{ token: PLATFORM_ID }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "20.3.2", type: Galleria, isStandalone: false, selector: "p-galleria", inputs: { activeIndex: "activeIndex", fullScreen: ["fullScreen", "fullScreen", booleanAttribute], id: "id", value: "value", numVisible: ["numVisible", "numVisible", numberAttribute], responsiveOptions: "responsiveOptions", showItemNavigators: ["showItemNavigators", "showItemNavigators", booleanAttribute], showThumbnailNavigators: ["showThumbnailNavigators", "showThumbnailNavigators", booleanAttribute], showItemNavigatorsOnHover: ["showItemNavigatorsOnHover", "showItemNavigatorsOnHover", booleanAttribute], changeItemOnIndicatorHover: ["changeItemOnIndicatorHover", "changeItemOnIndicatorHover", booleanAttribute], circular: ["circular", "circular", booleanAttribute], autoPlay: ["autoPlay", "autoPlay", booleanAttribute], shouldStopAutoplayByClick: ["shouldStopAutoplayByClick", "shouldStopAutoplayByClick", booleanAttribute], transitionInterval: ["transitionInterval", "transitionInterval", numberAttribute], showThumbnails: ["showThumbnails", "showThumbnails", booleanAttribute], thumbnailsPosition: "thumbnailsPosition", verticalThumbnailViewPortHeight: "verticalThumbnailViewPortHeight", showIndicators: ["showIndicators", "showIndicators", booleanAttribute], showIndicatorsOnItem: ["showIndicatorsOnItem", "showIndicatorsOnItem", booleanAttribute], indicatorsPosition: "indicatorsPosition", baseZIndex: ["baseZIndex", "baseZIndex", numberAttribute], maskClass: "maskClass", containerClass: "containerClass", containerStyle: "containerStyle", showTransitionOptions: "showTransitionOptions", hideTransitionOptions: "hideTransitionOptions", visible: "visible" }, outputs: { activeIndexChange: "activeIndexChange", visibleChange: "visibleChange" }, providers: [GalleriaStyle], queries: [{ propertyName: "headerTemplate", first: true, predicate: ["header"] }, { propertyName: "footerTemplate", first: true, predicate: ["footer"] }, { propertyName: "indicatorTemplate", first: true, predicate: ["indicator"] }, { propertyName: "captionTemplate", first: true, predicate: ["caption"] }, { propertyName: "_closeIconTemplate", first: true, predicate: ["closeicon"] }, { propertyName: "_previousThumbnailIconTemplate", first: true, predicate: ["previousthumbnailicon"] }, { propertyName: "_nextThumbnailIconTemplate", first: true, predicate: ["nextthumbnailicon"] }, { propertyName: "_itemPreviousIconTemplate", first: true, predicate: ["itempreviousicon"] }, { propertyName: "_itemNextIconTemplate", first: true, predicate: ["itemnexticon"] }, { propertyName: "_itemTemplate", first: true, predicate: ["item"] }, { propertyName: "_thumbnailTemplate", first: true, predicate: ["thumbnail"] }, { propertyName: "templates", predicate: PrimeTemplate }], viewQueries: [{ propertyName: "mask", first: true, predicate: ["mask"], descendants: true }, { propertyName: "container", first: true, predicate: ["container"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: `
         <div *ngIf="fullScreen; else windowed" #container>
             <div *ngIf="maskVisible" #mask [ngClass]="cx('mask')" [class]="maskClass" [attr.role]="fullScreen ? 'dialog' : 'region'" [attr.aria-modal]="fullScreen ? 'true' : undefined" (click)="onMaskHide($event)">
                 <p-galleriaContent
@@ -566,7 +568,7 @@ class Galleria extends BaseComponent {
             ])
         ], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: Galleria, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: Galleria, decorators: [{
             type: Component,
             args: [{
                     selector: 'p-galleria',
@@ -780,7 +782,7 @@ class GalleriaContent extends BaseComponent {
         }
     }
     shouldRenderFooter() {
-        return (this.galleria.footerFacet && this.galleria.templates.toArray().length > 0) || this.galleria.footerTemplate;
+        return (this.galleria.footerFacet && this.galleria.templates && this.galleria.templates.toArray().length > 0) || this.galleria.footerTemplate;
     }
     startSlideShow() {
         if (isPlatformBrowser(this.galleria.platformId)) {
@@ -818,8 +820,8 @@ class GalleriaContent extends BaseComponent {
     closeAriaLabel() {
         return this.config.translation.aria ? this.config.translation.aria.close : undefined;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: GalleriaContent, deps: [{ token: Galleria }, { token: i0.ChangeDetectorRef }, { token: i0.KeyValueDiffers }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "20.3.0", type: GalleriaContent, isStandalone: false, selector: "p-galleriaContent", inputs: { activeIndex: "activeIndex", value: "value", numVisible: ["numVisible", "numVisible", numberAttribute], fullScreen: ["fullScreen", "fullScreen", booleanAttribute] }, outputs: { maskHide: "maskHide", activeItemChange: "activeItemChange" }, host: { listeners: { "document:fullscreenchange": "handleFullscreenChange($event)" } }, providers: [GalleriaStyle], viewQueries: [{ propertyName: "closeButton", first: true, predicate: ["closeButton"], descendants: true }], usesInheritance: true, ngImport: i0, template: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: GalleriaContent, deps: [{ token: Galleria }, { token: i0.ChangeDetectorRef }, { token: i0.KeyValueDiffers }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "20.3.2", type: GalleriaContent, isStandalone: false, selector: "p-galleriaContent", inputs: { activeIndex: "activeIndex", value: "value", numVisible: ["numVisible", "numVisible", numberAttribute], fullScreen: ["fullScreen", "fullScreen", booleanAttribute] }, outputs: { maskHide: "maskHide", activeItemChange: "activeItemChange" }, host: { listeners: { "document:fullscreenchange": "handleFullscreenChange($event)" } }, providers: [GalleriaStyle], viewQueries: [{ propertyName: "closeButton", first: true, predicate: ["closeButton"], descendants: true }], usesInheritance: true, ngImport: i0, template: `
         <div [attr.id]="id" [attr.role]="'region'" *ngIf="value && value.length > 0" [class]="cn(cx('root'), galleria.containerClass)" [ngStyle]="!galleria.fullScreen ? galleria.containerStyle : {}" pFocusTrap [pFocusTrapDisabled]="!fullScreen">
             <button *ngIf="galleria.fullScreen" type="button" [class]="cx('closeButton')" (click)="maskHide.emit()" [attr.aria-label]="closeAriaLabel()" [attr.data-pc-section]="'closebutton'">
                 <svg data-p-icon="times" *ngIf="!galleria.closeIconTemplate && !galleria._closeIconTemplate" [class]="cx('closeIcon')" />
@@ -870,7 +872,7 @@ class GalleriaContent extends BaseComponent {
         </div>
     `, isInline: true, dependencies: [{ kind: "directive", type: i0.forwardRef(() => i1.NgIf), selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i0.forwardRef(() => i1.NgTemplateOutlet), selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i0.forwardRef(() => i1.NgStyle), selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i0.forwardRef(() => TimesIcon), selector: "[data-p-icon=\"times\"]" }, { kind: "directive", type: i0.forwardRef(() => FocusTrap), selector: "[pFocusTrap]", inputs: ["pFocusTrapDisabled"] }, { kind: "component", type: i0.forwardRef(() => GalleriaItemSlot), selector: "p-galleriaItemSlot", inputs: ["templates", "index", "item", "type"] }, { kind: "component", type: i0.forwardRef(() => GalleriaItem), selector: "p-galleriaItem", inputs: ["id", "circular", "value", "showItemNavigators", "showIndicators", "slideShowActive", "changeItemOnIndicatorHover", "autoPlay", "templates", "indicatorFacet", "captionFacet", "activeIndex"], outputs: ["startSlideShow", "stopSlideShow", "onActiveIndexChange"] }, { kind: "component", type: i0.forwardRef(() => GalleriaThumbnails), selector: "p-galleriaThumbnails", inputs: ["containerId", "value", "isVertical", "slideShowActive", "circular", "responsiveOptions", "contentHeight", "showThumbnailNavigators", "templates", "numVisible", "activeIndex"], outputs: ["onActiveIndexChange", "stopSlideShow"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: GalleriaContent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: GalleriaContent, decorators: [{
             type: Component,
             args: [{
                     selector: 'p-galleriaContent',
@@ -1053,14 +1055,14 @@ class GalleriaItemSlot {
             this.getContentTemplate();
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: GalleriaItemSlot, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "20.3.0", type: GalleriaItemSlot, isStandalone: false, selector: "p-galleriaItemSlot", inputs: { templates: "templates", index: ["index", "index", numberAttribute], item: "item", type: "type" }, ngImport: i0, template: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: GalleriaItemSlot, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "20.3.2", type: GalleriaItemSlot, isStandalone: false, selector: "p-galleriaItemSlot", inputs: { templates: "templates", index: ["index", "index", numberAttribute], item: "item", type: "type" }, ngImport: i0, template: `
         <ng-container *ngIf="shouldRender()">
             <ng-container *ngTemplateOutlet="contentTemplate; context: context"></ng-container>
         </ng-container>
     `, isInline: true, dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: GalleriaItemSlot, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: GalleriaItemSlot, decorators: [{
             type: Component,
             args: [{
                     selector: 'p-galleriaItemSlot',
@@ -1157,6 +1159,7 @@ class GalleriaItem extends BaseComponent {
         this.stopTheSlideShow();
         this.next();
         if (e && e.cancelable) {
+            e.stopPropagation();
             e.preventDefault();
         }
     }
@@ -1164,6 +1167,7 @@ class GalleriaItem extends BaseComponent {
         this.stopTheSlideShow();
         this.prev();
         if (e && e.cancelable) {
+            e.stopPropagation();
             e.preventDefault();
         }
     }
@@ -1206,13 +1210,13 @@ class GalleriaItem extends BaseComponent {
         return this.galleria.config.translation.aria ? this.galleria.config.translation.aria.slide : undefined;
     }
     ariaSlideNumber(value) {
-        return this.galleria.config.translation.aria ? this.galleria.config.translation.aria.slideNumber.replace(/{slideNumber}/g, value) : undefined;
+        return this.galleria.config.translation.aria ? this.galleria.config.translation.aria.slideNumber?.replace(/{slideNumber}/g, value) : undefined;
     }
     ariaPageLabel(value) {
-        return this.galleria.config.translation.aria ? this.galleria.config.translation.aria.pageLabel.replace(/{page}/g, value) : undefined;
+        return this.galleria.config.translation.aria ? this.galleria.config.translation.aria.pageLabel?.replace(/{page}/g, value) : undefined;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: GalleriaItem, deps: [{ token: Galleria }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "20.3.0", type: GalleriaItem, isStandalone: false, selector: "p-galleriaItem", inputs: { id: "id", circular: ["circular", "circular", booleanAttribute], value: "value", showItemNavigators: ["showItemNavigators", "showItemNavigators", booleanAttribute], showIndicators: ["showIndicators", "showIndicators", booleanAttribute], slideShowActive: ["slideShowActive", "slideShowActive", booleanAttribute], changeItemOnIndicatorHover: ["changeItemOnIndicatorHover", "changeItemOnIndicatorHover", booleanAttribute], autoPlay: ["autoPlay", "autoPlay", booleanAttribute], templates: "templates", indicatorFacet: "indicatorFacet", captionFacet: "captionFacet", activeIndex: "activeIndex" }, outputs: { startSlideShow: "startSlideShow", stopSlideShow: "stopSlideShow", onActiveIndexChange: "onActiveIndexChange" }, host: { properties: { "class": "cx('itemsContainer')" } }, providers: [GalleriaStyle], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: GalleriaItem, deps: [{ token: Galleria }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "20.3.2", type: GalleriaItem, isStandalone: false, selector: "p-galleriaItem", inputs: { id: "id", circular: ["circular", "circular", booleanAttribute], value: "value", showItemNavigators: ["showItemNavigators", "showItemNavigators", booleanAttribute], showIndicators: ["showIndicators", "showIndicators", booleanAttribute], slideShowActive: ["slideShowActive", "slideShowActive", booleanAttribute], changeItemOnIndicatorHover: ["changeItemOnIndicatorHover", "changeItemOnIndicatorHover", booleanAttribute], autoPlay: ["autoPlay", "autoPlay", booleanAttribute], templates: "templates", indicatorFacet: "indicatorFacet", captionFacet: "captionFacet", activeIndex: "activeIndex" }, outputs: { startSlideShow: "startSlideShow", stopSlideShow: "stopSlideShow", onActiveIndexChange: "onActiveIndexChange" }, host: { properties: { "class": "cx('itemsContainer')" } }, providers: [GalleriaStyle], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: `
         <div [class]="cx('items')">
             <button *ngIf="showItemNavigators" type="button" role="navigation" [class]="cx('prevButton')" (click)="navBackward($event)" (focus)="onButtonFocus('left')" (blur)="onButtonBlur('left')">
                 <svg data-p-icon="chevron-left" *ngIf="!galleria.itemPreviousIconTemplate && !galleria._itemPreviousIconTemplate" [class]="cx('prevIcon')" />
@@ -1247,7 +1251,7 @@ class GalleriaItem extends BaseComponent {
         </ul>
     `, isInline: true, dependencies: [{ kind: "directive", type: i0.forwardRef(() => i1.NgForOf), selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i0.forwardRef(() => i1.NgIf), selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i0.forwardRef(() => i1.NgTemplateOutlet), selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i0.forwardRef(() => ChevronRightIcon), selector: "[data-p-icon=\"chevron-right\"]" }, { kind: "component", type: i0.forwardRef(() => ChevronLeftIcon), selector: "[data-p-icon=\"chevron-left\"]" }, { kind: "component", type: i0.forwardRef(() => GalleriaItemSlot), selector: "p-galleriaItemSlot", inputs: ["templates", "index", "item", "type"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: GalleriaItem, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: GalleriaItem, decorators: [{
             type: Component,
             args: [{
                     selector: 'p-galleriaItem',
@@ -1435,7 +1439,7 @@ class GalleriaThumbnails extends BaseComponent {
             this.sortedResponsiveOptions.sort((data1, data2) => {
                 const value1 = data1.breakpoint;
                 const value2 = data2.breakpoint;
-                let result = null;
+                let result;
                 if (value1 == null && value2 != null)
                     result = -1;
                 else if (value1 != null && value2 == null)
@@ -1564,7 +1568,7 @@ class GalleriaThumbnails extends BaseComponent {
         }
     }
     onRightKey() {
-        const indicators = find(this.itemsContainer.nativeElement, '[data-pc-section="thumbnailitem"]');
+        const indicators = find(this.itemsContainer?.nativeElement, '[data-pc-section="thumbnailitem"]');
         const activeIndex = this.findFocusedIndicatorIndex();
         this.changedFocusedIndicator(activeIndex, activeIndex + 1 === indicators.length ? indicators.length - 1 : activeIndex + 1);
     }
@@ -1577,25 +1581,25 @@ class GalleriaThumbnails extends BaseComponent {
         this.changedFocusedIndicator(activeIndex, 0);
     }
     onEndKey() {
-        const indicators = find(this.itemsContainer.nativeElement, '[data-pc-section="thumbnailitem"]');
+        const indicators = find(this.itemsContainer?.nativeElement, '[data-pc-section="thumbnailitem"]');
         const activeIndex = this.findFocusedIndicatorIndex();
         this.changedFocusedIndicator(activeIndex, indicators.length - 1);
     }
     onTabKey() {
-        const indicators = [...find(this.itemsContainer.nativeElement, '[data-pc-section="thumbnailitem"]')];
+        const indicators = [...find(this.itemsContainer?.nativeElement, '[data-pc-section="thumbnailitem"]')];
         const highlightedIndex = indicators.findIndex((ind) => getAttribute(ind, 'data-p-active') === true);
-        const activeIndicator = findSingle(this.itemsContainer.nativeElement, '[tabindex="0"]');
-        const activeIndex = indicators.findIndex((ind) => ind === activeIndicator.parentElement);
+        const activeIndicator = findSingle(this.itemsContainer?.nativeElement, '[tabindex="0"]');
+        const activeIndex = indicators.findIndex((ind) => ind === activeIndicator?.parentElement);
         indicators[activeIndex].children[0].tabIndex = '-1';
         indicators[highlightedIndex].children[0].tabIndex = '0';
     }
     findFocusedIndicatorIndex() {
-        const indicators = [...find(this.itemsContainer.nativeElement, '[data-pc-section="thumbnailitem"]')];
-        const activeIndicator = findSingle(this.itemsContainer.nativeElement, '[data-pc-section="thumbnailitem"] > [tabindex="0"]');
-        return indicators.findIndex((ind) => ind === activeIndicator.parentElement);
+        const indicators = [...find(this.itemsContainer?.nativeElement, '[data-pc-section="thumbnailitem"]')];
+        const activeIndicator = findSingle(this.itemsContainer?.nativeElement, '[data-pc-section="thumbnailitem"] > [tabindex="0"]');
+        return indicators.findIndex((ind) => ind === activeIndicator?.parentElement);
     }
     changedFocusedIndicator(prevInd, nextInd) {
-        const indicators = find(this.itemsContainer.nativeElement, '[data-pc-section="thumbnailitem"]');
+        const indicators = find(this.itemsContainer?.nativeElement, '[data-pc-section="thumbnailitem"]');
         indicators[prevInd].children[0].tabIndex = '-1';
         indicators[nextInd].children[0].tabIndex = '0';
         indicators[nextInd].children[0].focus();
@@ -1717,10 +1721,10 @@ class GalleriaThumbnails extends BaseComponent {
         return this.galleria.config.translation.aria ? this.galleria.config.translation.aria.nextPageLabel : undefined;
     }
     ariaPageLabel(value) {
-        return this.galleria.config.translation.aria ? this.galleria.config.translation.aria.pageLabel.replace(/{page}/g, value) : undefined;
+        return this.galleria.config.translation.aria ? this.galleria.config.translation.aria.pageLabel?.replace(/{page}/g, value) : undefined;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: GalleriaThumbnails, deps: [{ token: Galleria }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "20.3.0", type: GalleriaThumbnails, isStandalone: false, selector: "p-galleriaThumbnails", inputs: { containerId: "containerId", value: "value", isVertical: ["isVertical", "isVertical", booleanAttribute], slideShowActive: ["slideShowActive", "slideShowActive", booleanAttribute], circular: ["circular", "circular", booleanAttribute], responsiveOptions: "responsiveOptions", contentHeight: "contentHeight", showThumbnailNavigators: "showThumbnailNavigators", templates: "templates", numVisible: "numVisible", activeIndex: "activeIndex" }, outputs: { onActiveIndexChange: "onActiveIndexChange", stopSlideShow: "stopSlideShow" }, providers: [GalleriaStyle], viewQueries: [{ propertyName: "itemsContainer", first: true, predicate: ["itemsContainer"], descendants: true }], usesInheritance: true, ngImport: i0, template: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: GalleriaThumbnails, deps: [{ token: Galleria }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "20.3.2", type: GalleriaThumbnails, isStandalone: false, selector: "p-galleriaThumbnails", inputs: { containerId: "containerId", value: "value", isVertical: ["isVertical", "isVertical", booleanAttribute], slideShowActive: ["slideShowActive", "slideShowActive", booleanAttribute], circular: ["circular", "circular", booleanAttribute], responsiveOptions: "responsiveOptions", contentHeight: "contentHeight", showThumbnailNavigators: "showThumbnailNavigators", templates: "templates", numVisible: "numVisible", activeIndex: "activeIndex" }, outputs: { onActiveIndexChange: "onActiveIndexChange", stopSlideShow: "stopSlideShow" }, providers: [GalleriaStyle], viewQueries: [{ propertyName: "itemsContainer", first: true, predicate: ["itemsContainer"], descendants: true }], usesInheritance: true, ngImport: i0, template: `
         <div [class]="cx('thumbnails')">
             <div [class]="cx('thumbnailContent')">
                 <button *ngIf="showThumbnailNavigators" type="button" [class]="cx('thumbnailPrevButton')" (click)="navBackward($event)" pRipple [attr.aria-label]="ariaPrevButtonLabel()">
@@ -1766,7 +1770,7 @@ class GalleriaThumbnails extends BaseComponent {
         </div>
     `, isInline: true, dependencies: [{ kind: "directive", type: i0.forwardRef(() => i1.NgForOf), selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i0.forwardRef(() => i1.NgIf), selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i0.forwardRef(() => i1.NgTemplateOutlet), selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i0.forwardRef(() => i1.NgStyle), selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i0.forwardRef(() => Ripple), selector: "[pRipple]" }, { kind: "component", type: i0.forwardRef(() => ChevronRightIcon), selector: "[data-p-icon=\"chevron-right\"]" }, { kind: "component", type: i0.forwardRef(() => ChevronUpIcon), selector: "[data-p-icon=\"chevron-up\"]" }, { kind: "component", type: i0.forwardRef(() => ChevronDownIcon), selector: "[data-p-icon=\"chevron-down\"]" }, { kind: "component", type: i0.forwardRef(() => ChevronLeftIcon), selector: "[data-p-icon=\"chevron-left\"]" }, { kind: "component", type: i0.forwardRef(() => GalleriaItemSlot), selector: "p-galleriaItemSlot", inputs: ["templates", "index", "item", "type"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: GalleriaThumbnails, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: GalleriaThumbnails, decorators: [{
             type: Component,
             args: [{
                     selector: 'p-galleriaThumbnails',
@@ -1853,11 +1857,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImpor
                 type: Input
             }] } });
 class GalleriaModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: GalleriaModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.0", ngImport: i0, type: GalleriaModule, declarations: [Galleria, GalleriaContent, GalleriaItemSlot, GalleriaItem, GalleriaThumbnails], imports: [CommonModule, SharedModule, Ripple, TimesIcon, ChevronRightIcon, ChevronUpIcon, ChevronDownIcon, ChevronLeftIcon, FocusTrap], exports: [CommonModule, Galleria, GalleriaContent, GalleriaItemSlot, GalleriaItem, GalleriaThumbnails, SharedModule] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: GalleriaModule, imports: [CommonModule, SharedModule, TimesIcon, ChevronRightIcon, ChevronUpIcon, ChevronDownIcon, ChevronLeftIcon, CommonModule, SharedModule] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: GalleriaModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.2", ngImport: i0, type: GalleriaModule, declarations: [Galleria, GalleriaContent, GalleriaItemSlot, GalleriaItem, GalleriaThumbnails], imports: [CommonModule, SharedModule, Ripple, TimesIcon, ChevronRightIcon, ChevronUpIcon, ChevronDownIcon, ChevronLeftIcon, FocusTrap], exports: [CommonModule, Galleria, GalleriaContent, GalleriaItemSlot, GalleriaItem, GalleriaThumbnails, SharedModule] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: GalleriaModule, imports: [CommonModule, SharedModule, TimesIcon, ChevronRightIcon, ChevronUpIcon, ChevronDownIcon, ChevronLeftIcon, CommonModule, SharedModule] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: GalleriaModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: GalleriaModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [CommonModule, SharedModule, Ripple, TimesIcon, ChevronRightIcon, ChevronUpIcon, ChevronDownIcon, ChevronLeftIcon, FocusTrap],