primeng 22.1.0 → 22.1.2

package/fesm2022/primeng-galleria.mjs

@@ -1,451 +1,495 @@
-export * from 'primeng/types/galleria';
-import * as i0 from '@angular/core';
-import { InjectionToken, input, inject, computed, ChangeDetectionStrategy, Component, Injectable, booleanAttribute, output, linkedSignal, effect, viewChild, model, HostListener, numberAttribute, signal, contentChild, ElementRef, ViewEncapsulation, NgModule } from '@angular/core';
-import { removeClass, setAttribute, find, getAttribute, findSingle, addClass, uuid, focus } from '@primeuix/utils';
-import { SharedModule } from 'primeng/api';
-import { BaseComponent, PARENT_INSTANCE } from 'primeng/basecomponent';
-import * as i1 from 'primeng/bind';
-import { Bind, BindModule } from 'primeng/bind';
-import { blockBodyScroll, unblockBodyScroll } from 'primeng/dom';
-import { FocusTrap } from 'primeng/focustrap';
-import * as i2 from 'primeng/motion';
-import { MotionModule } from 'primeng/motion';
-import { ZIndexUtils } from 'primeng/utils';
-import { NgTemplateOutlet, isPlatformBrowser } from '@angular/common';
-import { Times } from '@primeicons/angular/times';
-import { ChevronLeft } from '@primeicons/angular/chevron-left';
-import { ChevronRight } from '@primeicons/angular/chevron-right';
-import { style } from '@primeuix/styles/galleria';
-import { BaseStyle } from 'primeng/base';
-import { ChevronDown } from '@primeicons/angular/chevron-down';
-import { ChevronUp } from '@primeicons/angular/chevron-up';
-import { Ripple } from 'primeng/ripple';
-
-const GALLERIA_INSTANCE = new InjectionToken('GALLERIA_INSTANCE');
-
-class GalleriaItemSlot extends BaseComponent {
-    hostName = 'Galleria';
-    index = input(/* @ts-ignore */
-    ...(ngDevMode ? [undefined, { debugName: "index" }] : /* istanbul ignore next */ []));
-    item = input(/* @ts-ignore */
-    ...(ngDevMode ? [undefined, { debugName: "item" }] : /* istanbul ignore next */ []));
-    type = input(/* @ts-ignore */
-    ...(ngDevMode ? [undefined, { debugName: "type" }] : /* istanbul ignore next */ []));
-    galleria = inject(GALLERIA_INSTANCE);
-    $pcGalleria = inject(GALLERIA_INSTANCE, { optional: true, skipSelf: true }) ?? undefined;
-    contentTemplate = computed(() => {
-        const type = this.type();
-        switch (type) {
-            case 'item':
-                return this.galleria.itemTemplate();
-            case 'caption':
-                return this.galleria.captionTemplate();
-            case 'thumbnail':
-                return this.galleria.thumbnailTemplate();
-            case 'indicator':
-                return this.galleria.indicatorTemplate();
-            case 'footer':
-                return this.galleria.footerTemplate();
-            case 'header':
-                return this.galleria.headerTemplate();
-            default:
-                return this.galleria.itemTemplate();
-        }
-    }, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "contentTemplate" }] : /* istanbul ignore next */ []));
-    context = computed(() => {
-        const type = this.type();
-        if (type === 'indicator') {
-            return { $implicit: this.index() };
-        }
-        return { $implicit: this.item() };
-    }, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "context" }] : /* istanbul ignore next */ []));
-    shouldRender() {
-        return !!this.contentTemplate();
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: GalleriaItemSlot, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.2", type: GalleriaItemSlot, isStandalone: true, selector: "div[pGalleriaItemSlot]", inputs: { index: { classPropertyName: "index", publicName: "index", isSignal: true, isRequired: false, transformFunction: null }, item: { classPropertyName: "item", publicName: "item", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: `
+import * as i0 from "@angular/core";
+import { ChangeDetectionStrategy, Component, ElementRef, HostListener, Injectable, InjectionToken, NgModule, ViewEncapsulation, booleanAttribute, computed, contentChild, effect, inject, input, linkedSignal, model, numberAttribute, output, signal, viewChild } from "@angular/core";
+import { addClass, find, findSingle, focus, getAttribute, removeClass, setAttribute, uuid } from "@primeuix/utils";
+import { SharedModule } from "primeng/api";
+import { BaseComponent, PARENT_INSTANCE } from "primeng/basecomponent";
+import * as i1 from "primeng/bind";
+import { Bind, BindModule } from "primeng/bind";
+import { blockBodyScroll, unblockBodyScroll } from "primeng/dom";
+import { FocusTrap } from "primeng/focustrap";
+import * as i2 from "primeng/motion";
+import { MotionModule } from "primeng/motion";
+import { ZIndexUtils } from "primeng/utils";
+import { NgTemplateOutlet, isPlatformBrowser } from "@angular/common";
+import { Times } from "@primeicons/angular/times";
+import { ChevronLeft } from "@primeicons/angular/chevron-left";
+import { ChevronRight } from "@primeicons/angular/chevron-right";
+import { style } from "@primeuix/styles/galleria";
+import { BaseStyle } from "primeng/base";
+import { ChevronDown } from "@primeicons/angular/chevron-down";
+import { ChevronUp } from "@primeicons/angular/chevron-up";
+import { Ripple } from "primeng/ripple";
+export * from "primeng/types/galleria";
+const GALLERIA_INSTANCE = new InjectionToken("GALLERIA_INSTANCE");
+var GalleriaItemSlot = class GalleriaItemSlot extends BaseComponent {
+	hostName = "Galleria";
+	index = input(...ngDevMode ? [void 0, { debugName: "index" }] : /* istanbul ignore next */ []);
+	item = input(...ngDevMode ? [void 0, { debugName: "item" }] : /* istanbul ignore next */ []);
+	type = input(...ngDevMode ? [void 0, { debugName: "type" }] : /* istanbul ignore next */ []);
+	galleria = inject(GALLERIA_INSTANCE);
+	$pcGalleria = inject(GALLERIA_INSTANCE, {
+		optional: true,
+		skipSelf: true
+	}) ?? void 0;
+	contentTemplate = computed(() => {
+		switch (this.type()) {
+			case "item": return this.galleria.itemTemplate();
+			case "caption": return this.galleria.captionTemplate();
+			case "thumbnail": return this.galleria.thumbnailTemplate();
+			case "indicator": return this.galleria.indicatorTemplate();
+			case "footer": return this.galleria.footerTemplate();
+			case "header": return this.galleria.headerTemplate();
+			default: return this.galleria.itemTemplate();
+		}
+	}, ...ngDevMode ? [{ debugName: "contentTemplate" }] : /* istanbul ignore next */ []);
+	context = computed(() => {
+		if (this.type() === "indicator") return { $implicit: this.index() };
+		return { $implicit: this.item() };
+	}, ...ngDevMode ? [{ debugName: "context" }] : /* istanbul ignore next */ []);
+	shouldRender() {
+		return !!this.contentTemplate();
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.0",
+		ngImport: i0,
+		type: GalleriaItemSlot,
+		deps: null,
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.0",
+		type: GalleriaItemSlot,
+		isStandalone: true,
+		selector: "div[pGalleriaItemSlot]",
+		inputs: {
+			index: {
+				classPropertyName: "index",
+				publicName: "index",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			item: {
+				classPropertyName: "item",
+				publicName: "item",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			type: {
+				classPropertyName: "type",
+				publicName: "type",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		usesInheritance: true,
+		ngImport: i0,
+		template: `
         @if (shouldRender()) {
             <ng-container [ngTemplateOutlet]="contentTemplate()" [ngTemplateOutletContext]="context()"></ng-container>
         }
-    `, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: GalleriaItemSlot, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'div[pGalleriaItemSlot]',
-                    standalone: true,
-                    imports: [NgTemplateOutlet],
-                    template: `
+    `,
+		isInline: true,
+		dependencies: [{
+			kind: "directive",
+			type: NgTemplateOutlet,
+			selector: "[ngTemplateOutlet]",
+			inputs: [
+				"ngTemplateOutletContext",
+				"ngTemplateOutlet",
+				"ngTemplateOutletInjector"
+			]
+		}],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.0",
+	ngImport: i0,
+	type: GalleriaItemSlot,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "div[pGalleriaItemSlot]",
+			standalone: true,
+			imports: [NgTemplateOutlet],
+			template: `
         @if (shouldRender()) {
             <ng-container [ngTemplateOutlet]="contentTemplate()" [ngTemplateOutletContext]="context()"></ng-container>
         }
     `,
-                    changeDetection: ChangeDetectionStrategy.OnPush
-                }]
-        }], propDecorators: { index: [{ type: i0.Input, args: [{ isSignal: true, alias: "index", required: false }] }], item: [{ type: i0.Input, args: [{ isSignal: true, alias: "item", required: false }] }], type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }] } });
-
+			changeDetection: ChangeDetectionStrategy.OnPush
+		}]
+	}],
+	propDecorators: {
+		index: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "index",
+				required: false
+			}]
+		}],
+		item: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "item",
+				required: false
+			}]
+		}],
+		type: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "type",
+				required: false
+			}]
+		}]
+	}
+});
 const classes = {
-    mask: 'p-galleria-mask p-overlay-mask',
-    root: ({ instance }) => {
-        const thumbnailsPosClass = instance.galleria.showThumbnails() && instance.getPositionClass('p-galleria-thumbnails', instance.galleria.thumbnailsPosition());
-        const indicatorPosClass = instance.galleria.showIndicators() && instance.getPositionClass('p-galleria-indicators', instance.galleria.indicatorsPosition());
-        return [
-            'p-galleria p-component',
-            {
-                'p-galleria-fullscreen': instance.galleria.fullScreen(),
-                'p-galleria-inset-indicators': instance.galleria.showIndicatorsOnItem(),
-                'p-galleria-hover-navigators': instance.galleria.showItemNavigatorsOnHover() && !instance.galleria.fullScreen()
-            },
-            thumbnailsPosClass,
-            indicatorPosClass
-        ];
-    },
-    closeButton: 'p-galleria-close-button',
-    closeIcon: 'p-galleria-close-icon',
-    header: 'p-galleria-header',
-    content: 'p-galleria-content',
-    footer: 'p-galleria-footer',
-    itemsContainer: 'p-galleria-items-container',
-    items: 'p-galleria-items',
-    prevButton: ({ instance }) => [
-        'p-galleria-prev-button p-galleria-nav-button',
-        {
-            'p-disabled': instance.isNavBackwardDisabled()
-        }
-    ],
-    prevIcon: 'p-galleria-prev-icon',
-    item: 'p-galleria-item',
-    nextButton: ({ instance }) => [
-        'p-galleria-next-button p-galleria-nav-button',
-        {
-            'p-disabled': instance.isNavForwardDisabled()
-        }
-    ],
-    nextIcon: 'p-galleria-next-icon',
-    caption: 'p-galleria-caption',
-    indicatorList: 'p-galleria-indicator-list',
-    indicator: ({ instance, index }) => [
-        'p-galleria-indicator',
-        {
-            'p-galleria-indicator-active': instance.isIndicatorItemActive(index)
-        }
-    ],
-    indicatorButton: 'p-galleria-indicator-button',
-    thumbnails: 'p-galleria-thumbnails',
-    thumbnailContent: 'p-galleria-thumbnails-content',
-    thumbnailPrevButton: ({ instance }) => [
-        'p-galleria-thumbnail-prev-button p-galleria-thumbnail-nav-button',
-        {
-            'p-disabled': instance.isNavBackwardDisabled()
-        }
-    ],
-    thumbnailPrevIcon: 'p-galleria-thumbnail-prev-icon',
-    thumbnailsViewport: 'p-galleria-thumbnails-viewport',
-    thumbnailItems: 'p-galleria-thumbnail-items',
-    thumbnailItem: ({ instance, index, activeIndex }) => [
-        'p-galleria-thumbnail-item',
-        {
-            'p-galleria-thumbnail-item-current': activeIndex === index,
-            'p-galleria-thumbnail-item-active': instance.isItemActive(index),
-            'p-galleria-thumbnail-item-start': instance.firstItemAciveIndex() === index,
-            'p-galleria-thumbnail-item-end': instance.lastItemActiveIndex() === index
-        }
-    ],
-    thumbnail: 'p-galleria-thumbnail',
-    thumbnailNextButton: ({ instance }) => [
-        'p-galleria-thumbnail-next-button  p-galleria-thumbnail-nav-button',
-        {
-            'p-disabled': instance.isNavForwardDisabled()
-        }
-    ],
-    thumbnailNextIcon: 'p-galleria-thumbnail-next-icon'
+	mask: "p-galleria-mask p-overlay-mask",
+	root: ({ instance }) => {
+		const thumbnailsPosClass = instance.galleria.showThumbnails() && instance.getPositionClass("p-galleria-thumbnails", instance.galleria.thumbnailsPosition());
+		const indicatorPosClass = instance.galleria.showIndicators() && instance.getPositionClass("p-galleria-indicators", instance.galleria.indicatorsPosition());
+		return [
+			"p-galleria p-component",
+			{
+				"p-galleria-fullscreen": instance.galleria.fullScreen(),
+				"p-galleria-inset-indicators": instance.galleria.showIndicatorsOnItem(),
+				"p-galleria-hover-navigators": instance.galleria.showItemNavigatorsOnHover() && !instance.galleria.fullScreen()
+			},
+			thumbnailsPosClass,
+			indicatorPosClass
+		];
+	},
+	closeButton: "p-galleria-close-button",
+	closeIcon: "p-galleria-close-icon",
+	header: "p-galleria-header",
+	content: "p-galleria-content",
+	footer: "p-galleria-footer",
+	itemsContainer: "p-galleria-items-container",
+	items: "p-galleria-items",
+	prevButton: ({ instance }) => ["p-galleria-prev-button p-galleria-nav-button", { "p-disabled": instance.isNavBackwardDisabled() }],
+	prevIcon: "p-galleria-prev-icon",
+	item: "p-galleria-item",
+	nextButton: ({ instance }) => ["p-galleria-next-button p-galleria-nav-button", { "p-disabled": instance.isNavForwardDisabled() }],
+	nextIcon: "p-galleria-next-icon",
+	caption: "p-galleria-caption",
+	indicatorList: "p-galleria-indicator-list",
+	indicator: ({ instance, index }) => ["p-galleria-indicator", { "p-galleria-indicator-active": instance.isIndicatorItemActive(index) }],
+	indicatorButton: "p-galleria-indicator-button",
+	thumbnails: "p-galleria-thumbnails",
+	thumbnailContent: "p-galleria-thumbnails-content",
+	thumbnailPrevButton: ({ instance }) => ["p-galleria-thumbnail-prev-button p-galleria-thumbnail-nav-button", { "p-disabled": instance.isNavBackwardDisabled() }],
+	thumbnailPrevIcon: "p-galleria-thumbnail-prev-icon",
+	thumbnailsViewport: "p-galleria-thumbnails-viewport",
+	thumbnailItems: "p-galleria-thumbnail-items",
+	thumbnailItem: ({ instance, index, activeIndex }) => ["p-galleria-thumbnail-item", {
+		"p-galleria-thumbnail-item-current": activeIndex === index,
+		"p-galleria-thumbnail-item-active": instance.isItemActive(index),
+		"p-galleria-thumbnail-item-start": instance.firstItemAciveIndex() === index,
+		"p-galleria-thumbnail-item-end": instance.lastItemActiveIndex() === index
+	}],
+	thumbnail: "p-galleria-thumbnail",
+	thumbnailNextButton: ({ instance }) => ["p-galleria-thumbnail-next-button  p-galleria-thumbnail-nav-button", { "p-disabled": instance.isNavForwardDisabled() }],
+	thumbnailNextIcon: "p-galleria-thumbnail-next-icon"
+};
+var GalleriaStyle = class GalleriaStyle extends BaseStyle {
+	name = "galleria";
+	style = style;
+	classes = classes;
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.0",
+		ngImport: i0,
+		type: GalleriaStyle,
+		deps: null,
+		target: i0.ɵɵFactoryTarget.Injectable
+	});
+	static ɵprov = i0.ɵɵngDeclareInjectable({
+		minVersion: "12.0.0",
+		version: "22.2.0",
+		ngImport: i0,
+		type: GalleriaStyle
+	});
 };
-class GalleriaStyle extends BaseStyle {
-    name = 'galleria';
-    style = style;
-    classes = classes;
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: GalleriaStyle, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: GalleriaStyle });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: GalleriaStyle, decorators: [{
-            type: Injectable
-        }] });
-/**
- *
- * Galleria is an advanced content gallery component.
- *
- * [Live Demo](https://www.primeng.org/galleria/)
- *
- * @module galleriastyle
- *
- */
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.0",
+	ngImport: i0,
+	type: GalleriaStyle,
+	decorators: [{ type: Injectable }]
+});
 var GalleriaClasses;
-(function (GalleriaClasses) {
-    /**
-     * Class name of the mask element
-     */
-    GalleriaClasses["mask"] = "p-galleria-mask";
-    /**
-     * Class name of the root element
-     */
-    GalleriaClasses["root"] = "p-galleria";
-    /**
-     * Class name of the close button element
-     */
-    GalleriaClasses["closeButton"] = "p-galleria-close-button";
-    /**
-     * Class name of the close icon element
-     */
-    GalleriaClasses["closeIcon"] = "p-galleria-close-icon";
-    /**
-     * Class name of the header element
-     */
-    GalleriaClasses["header"] = "p-galleria-header";
-    /**
-     * Class name of the content element
-     */
-    GalleriaClasses["content"] = "p-galleria-content";
-    /**
-     * Class name of the footer element
-     */
-    GalleriaClasses["footer"] = "p-galleria-footer";
-    /**
-     * Class name of the items container element
-     */
-    GalleriaClasses["itemsContainer"] = "p-galleria-items-container";
-    /**
-     * Class name of the items element
-     */
-    GalleriaClasses["items"] = "p-galleria-items";
-    /**
-     * Class name of the previous item button element
-     */
-    GalleriaClasses["prevButton"] = "p-galleria-prev-button";
-    /**
-     * Class name of the previous item icon element
-     */
-    GalleriaClasses["prevIcon"] = "p-galleria-prev-icon";
-    /**
-     * Class name of the item element
-     */
-    GalleriaClasses["item"] = "p-galleria-item";
-    /**
-     * Class name of the next item button element
-     */
-    GalleriaClasses["nextButton"] = "p-galleria-next-button";
-    /**
-     * Class name of the next item icon element
-     */
-    GalleriaClasses["nextIcon"] = "p-galleria-next-icon";
-    /**
-     * Class name of the caption element
-     */
-    GalleriaClasses["caption"] = "p-galleria-caption";
-    /**
-     * Class name of the indicator list element
-     */
-    GalleriaClasses["indicatorList"] = "p-galleria-indicator-list";
-    /**
-     * Class name of the indicator element
-     */
-    GalleriaClasses["indicator"] = "p-galleria-indicator";
-    /**
-     * Class name of the indicator button element
-     */
-    GalleriaClasses["indicatorButton"] = "p-galleria-indicator-button";
-    /**
-     * Class name of the thumbnails element
-     */
-    GalleriaClasses["thumbnails"] = "p-galleria-thumbnails";
-    /**
-     * Class name of the thumbnail content element
-     */
-    GalleriaClasses["thumbnailContent"] = "p-galleria-thumbnails-content";
-    /**
-     * Class name of the previous thumbnail button element
-     */
-    GalleriaClasses["previousThumbnailButton"] = "p-galleria-thumbnail-prev-button";
-    /**
-     * Class name of the previous thumbnail icon element
-     */
-    GalleriaClasses["previousThumbnailIcon"] = "p-galleria-thumbnail-prev-icon";
-    /**
-     * Class name of the thumbnails viewport element
-     */
-    GalleriaClasses["thumbnailsViewport"] = "p-galleria-thumbnails-viewport";
-    /**
-     * Class name of the thumbnail items element
-     */
-    GalleriaClasses["thumbnailItems"] = "p-galleria-thumbnail-items";
-    /**
-     * Class name of the thumbnail item element
-     */
-    GalleriaClasses["thumbnailItem"] = "p-galleria-thumbnail-item";
-    /**
-     * Class name of the thumbnail element
-     */
-    GalleriaClasses["thumbnail"] = "p-galleria-thumbnail";
-    /**
-     * Class name of the next thumbnail button element
-     */
-    GalleriaClasses["nextThumbnailButton"] = "p-galleria-thumbnail-next-button";
-    /**
-     * Class name of the next thumbnail icon element
-     */
-    GalleriaClasses["nextThumbnailIcon"] = "p-galleria-thumbnail-next-icon";
+(function(GalleriaClasses) {
+	GalleriaClasses["mask"] = "p-galleria-mask";
+	GalleriaClasses["root"] = "p-galleria";
+	GalleriaClasses["closeButton"] = "p-galleria-close-button";
+	GalleriaClasses["closeIcon"] = "p-galleria-close-icon";
+	GalleriaClasses["header"] = "p-galleria-header";
+	GalleriaClasses["content"] = "p-galleria-content";
+	GalleriaClasses["footer"] = "p-galleria-footer";
+	GalleriaClasses["itemsContainer"] = "p-galleria-items-container";
+	GalleriaClasses["items"] = "p-galleria-items";
+	GalleriaClasses["prevButton"] = "p-galleria-prev-button";
+	GalleriaClasses["prevIcon"] = "p-galleria-prev-icon";
+	GalleriaClasses["item"] = "p-galleria-item";
+	GalleriaClasses["nextButton"] = "p-galleria-next-button";
+	GalleriaClasses["nextIcon"] = "p-galleria-next-icon";
+	GalleriaClasses["caption"] = "p-galleria-caption";
+	GalleriaClasses["indicatorList"] = "p-galleria-indicator-list";
+	GalleriaClasses["indicator"] = "p-galleria-indicator";
+	GalleriaClasses["indicatorButton"] = "p-galleria-indicator-button";
+	GalleriaClasses["thumbnails"] = "p-galleria-thumbnails";
+	GalleriaClasses["thumbnailContent"] = "p-galleria-thumbnails-content";
+	GalleriaClasses["previousThumbnailButton"] = "p-galleria-thumbnail-prev-button";
+	GalleriaClasses["previousThumbnailIcon"] = "p-galleria-thumbnail-prev-icon";
+	GalleriaClasses["thumbnailsViewport"] = "p-galleria-thumbnails-viewport";
+	GalleriaClasses["thumbnailItems"] = "p-galleria-thumbnail-items";
+	GalleriaClasses["thumbnailItem"] = "p-galleria-thumbnail-item";
+	GalleriaClasses["thumbnail"] = "p-galleria-thumbnail";
+	GalleriaClasses["nextThumbnailButton"] = "p-galleria-thumbnail-next-button";
+	GalleriaClasses["nextThumbnailIcon"] = "p-galleria-thumbnail-next-icon";
 })(GalleriaClasses || (GalleriaClasses = {}));
-
-class GalleriaItem extends BaseComponent {
-    hostName = 'Galleria';
-    galleria = inject(GALLERIA_INSTANCE);
-    bindDirectiveInstance = inject(Bind, { self: true });
-    onAfterViewChecked() {
-        this.bindDirectiveInstance.setAttrs(this.ptm('itemsContainer'));
-    }
-    id = input(/* @ts-ignore */
-    ...(ngDevMode ? [undefined, { debugName: "id" }] : /* istanbul ignore next */ []));
-    circular = input(false, { ...(ngDevMode ? { debugName: "circular" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
-    value = input(/* @ts-ignore */
-    ...(ngDevMode ? [undefined, { debugName: "value" }] : /* istanbul ignore next */ []));
-    showItemNavigators = input(false, { ...(ngDevMode ? { debugName: "showItemNavigators" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
-    showIndicators = input(true, { ...(ngDevMode ? { debugName: "showIndicators" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
-    slideShowActive = input(true, { ...(ngDevMode ? { debugName: "slideShowActive" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
-    changeItemOnIndicatorHover = input(true, { ...(ngDevMode ? { debugName: "changeItemOnIndicatorHover" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
-    autoPlay = input(false, { ...(ngDevMode ? { debugName: "autoPlay" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
-    startSlideShow = output();
-    stopSlideShow = output();
-    onActiveIndexChange = output();
-    _componentStyle = inject(GalleriaStyle);
-    _activeIndex = linkedSignal(() => this.activeIndexInput(), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "_activeIndex" }] : /* istanbul ignore next */ []));
-    activeItem = computed(() => {
-        const val = this.value();
-        return val && val[this._activeIndex()];
-    }, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "activeItem" }] : /* istanbul ignore next */ []));
-    activeItemId = computed(() => this.id() + '_item_' + this._activeIndex(), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "activeItemId" }] : /* istanbul ignore next */ []));
-    leftButtonFocused = false;
-    rightButtonFocused = false;
-    get aria() {
-        return this.galleria.config.translation.aria;
-    }
-    constructor() {
-        super();
-        // Handle autoPlay changes
-        effect(() => {
-            const auto = this.autoPlay();
-            if (auto) {
-                this.startSlideShow.emit();
-            }
-        });
-    }
-    activeIndexInput = input(0, { ...(ngDevMode ? { debugName: "activeIndexInput" } : /* istanbul ignore next */ {}), alias: 'activeIndex' });
-    getIndicatorPTOptions(index) {
-        return this.ptm('indicator', {
-            context: {
-                highlighted: this._activeIndex() === index
-            }
-        });
-    }
-    next() {
-        const val = this.value();
-        const currentIndex = this._activeIndex();
-        let nextItemIndex = currentIndex + 1;
-        let activeIndex = this.circular() && val.length - 1 === currentIndex ? 0 : nextItemIndex;
-        this.onActiveIndexChange.emit(activeIndex);
-    }
-    prev() {
-        const val = this.value();
-        const currentIndex = this._activeIndex();
-        let prevItemIndex = currentIndex !== 0 ? currentIndex - 1 : 0;
-        let activeIndex = this.circular() && currentIndex === 0 ? val.length - 1 : prevItemIndex;
-        this.onActiveIndexChange.emit(activeIndex);
-    }
-    onButtonFocus(pos) {
-        if (pos === 'left') {
-            this.leftButtonFocused = true;
-        }
-        else
-            this.rightButtonFocused = true;
-    }
-    onButtonBlur(pos) {
-        if (pos === 'left') {
-            this.leftButtonFocused = false;
-        }
-        else
-            this.rightButtonFocused = false;
-    }
-    stopTheSlideShow() {
-        if (this.slideShowActive()) {
-            this.stopSlideShow.emit();
-        }
-    }
-    navForward(e) {
-        this.stopTheSlideShow();
-        this.next();
-        if (e && e.cancelable) {
-            e.stopPropagation();
-            e.preventDefault();
-        }
-    }
-    navBackward(e) {
-        this.stopTheSlideShow();
-        this.prev();
-        if (e && e.cancelable) {
-            e.stopPropagation();
-            e.preventDefault();
-        }
-    }
-    onIndicatorClick(index) {
-        this.stopTheSlideShow();
-        this.onActiveIndexChange.emit(index);
-    }
-    onIndicatorMouseEnter(index) {
-        if (this.changeItemOnIndicatorHover()) {
-            this.stopTheSlideShow();
-            this.onActiveIndexChange.emit(index);
-        }
-    }
-    onIndicatorKeyDown(event, index) {
-        switch (event.code) {
-            case 'Enter':
-            case 'Space':
-                this.stopTheSlideShow();
-                this.onActiveIndexChange.emit(index);
-                event.preventDefault();
-                break;
-            case 'ArrowDown':
-            case 'ArrowUp':
-                event.preventDefault();
-                break;
-            default:
-                break;
-        }
-    }
-    isNavForwardDisabled() {
-        const val = this.value();
-        return !this.circular() && this._activeIndex() === val.length - 1;
-    }
-    isNavBackwardDisabled() {
-        return !this.circular() && this._activeIndex() === 0;
-    }
-    isIndicatorItemActive(index) {
-        return this._activeIndex() === index;
-    }
-    ariaSlideLabel() {
-        return this.aria?.slide;
-    }
-    ariaSlideNumber(value) {
-        return this.aria?.slideNumber?.replace(/{slideNumber}/g, value);
-    }
-    ariaPageLabel(value) {
-        return this.aria?.pageLabel?.replace(/{page}/g, value);
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: GalleriaItem, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.2", type: GalleriaItem, isStandalone: true, selector: "div[pGalleriaItem]", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, circular: { classPropertyName: "circular", publicName: "circular", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, showItemNavigators: { classPropertyName: "showItemNavigators", publicName: "showItemNavigators", isSignal: true, isRequired: false, transformFunction: null }, showIndicators: { classPropertyName: "showIndicators", publicName: "showIndicators", isSignal: true, isRequired: false, transformFunction: null }, slideShowActive: { classPropertyName: "slideShowActive", publicName: "slideShowActive", isSignal: true, isRequired: false, transformFunction: null }, changeItemOnIndicatorHover: { classPropertyName: "changeItemOnIndicatorHover", publicName: "changeItemOnIndicatorHover", isSignal: true, isRequired: false, transformFunction: null }, autoPlay: { classPropertyName: "autoPlay", publicName: "autoPlay", isSignal: true, isRequired: false, transformFunction: null }, activeIndexInput: { classPropertyName: "activeIndexInput", publicName: "activeIndex", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { startSlideShow: "startSlideShow", stopSlideShow: "stopSlideShow", onActiveIndexChange: "onActiveIndexChange" }, providers: [GalleriaStyle], usesInheritance: true, hostDirectives: [{ directive: i1.Bind }], ngImport: i0, template: `
+var GalleriaItem = class GalleriaItem extends BaseComponent {
+	hostName = "Galleria";
+	galleria = inject(GALLERIA_INSTANCE);
+	bindDirectiveInstance = inject(Bind, { self: true });
+	id = input(...ngDevMode ? [void 0, { debugName: "id" }] : /* istanbul ignore next */ []);
+	circular = input(false, {
+		...ngDevMode ? { debugName: "circular" } : /* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	value = input(...ngDevMode ? [void 0, { debugName: "value" }] : /* istanbul ignore next */ []);
+	showItemNavigators = input(false, {
+		...ngDevMode ? { debugName: "showItemNavigators" } : /* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	showIndicators = input(true, {
+		...ngDevMode ? { debugName: "showIndicators" } : /* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	slideShowActive = input(true, {
+		...ngDevMode ? { debugName: "slideShowActive" } : /* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	changeItemOnIndicatorHover = input(true, {
+		...ngDevMode ? { debugName: "changeItemOnIndicatorHover" } : /* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	autoPlay = input(false, {
+		...ngDevMode ? { debugName: "autoPlay" } : /* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	startSlideShow = output();
+	stopSlideShow = output();
+	onActiveIndexChange = output();
+	_componentStyle = inject(GalleriaStyle);
+	_activeIndex = linkedSignal(() => this.activeIndexInput(), ...ngDevMode ? [{ debugName: "_activeIndex" }] : /* istanbul ignore next */ []);
+	activeItem = computed(() => {
+		const val = this.value();
+		return val && val[this._activeIndex()];
+	}, ...ngDevMode ? [{ debugName: "activeItem" }] : /* istanbul ignore next */ []);
+	activeItemId = computed(() => this.id() + "_item_" + this._activeIndex(), ...ngDevMode ? [{ debugName: "activeItemId" }] : /* istanbul ignore next */ []);
+	leftButtonFocused = false;
+	rightButtonFocused = false;
+	get aria() {
+		return this.galleria.config.translation.aria;
+	}
+	constructor() {
+		super();
+		effect(() => {
+			if (this.autoPlay()) this.startSlideShow.emit();
+		});
+	}
+	activeIndexInput = input(0, {
+		...ngDevMode ? { debugName: "activeIndexInput" } : /* istanbul ignore next */ {},
+		alias: "activeIndex"
+	});
+	onAfterViewChecked() {
+		this.bindDirectiveInstance.setAttrs(this.ptm("itemsContainer"));
+	}
+	getIndicatorPTOptions(index) {
+		return this.ptm("indicator", { context: { highlighted: this._activeIndex() === index } });
+	}
+	next() {
+		const val = this.value();
+		const currentIndex = this._activeIndex();
+		let nextItemIndex = currentIndex + 1;
+		let activeIndex = this.circular() && val.length - 1 === currentIndex ? 0 : nextItemIndex;
+		this.onActiveIndexChange.emit(activeIndex);
+	}
+	prev() {
+		const val = this.value();
+		const currentIndex = this._activeIndex();
+		let prevItemIndex = currentIndex !== 0 ? currentIndex - 1 : 0;
+		let activeIndex = this.circular() && currentIndex === 0 ? val.length - 1 : prevItemIndex;
+		this.onActiveIndexChange.emit(activeIndex);
+	}
+	onButtonFocus(pos) {
+		if (pos === "left") this.leftButtonFocused = true;
+		else this.rightButtonFocused = true;
+	}
+	onButtonBlur(pos) {
+		if (pos === "left") this.leftButtonFocused = false;
+		else this.rightButtonFocused = false;
+	}
+	stopTheSlideShow() {
+		if (this.slideShowActive()) this.stopSlideShow.emit();
+	}
+	navForward(e) {
+		this.stopTheSlideShow();
+		this.next();
+		if (e && e.cancelable) {
+			e.stopPropagation();
+			e.preventDefault();
+		}
+	}
+	navBackward(e) {
+		this.stopTheSlideShow();
+		this.prev();
+		if (e && e.cancelable) {
+			e.stopPropagation();
+			e.preventDefault();
+		}
+	}
+	onIndicatorClick(index) {
+		this.stopTheSlideShow();
+		this.onActiveIndexChange.emit(index);
+	}
+	onIndicatorMouseEnter(index) {
+		if (this.changeItemOnIndicatorHover()) {
+			this.stopTheSlideShow();
+			this.onActiveIndexChange.emit(index);
+		}
+	}
+	onIndicatorKeyDown(event, index) {
+		switch (event.code) {
+			case "Enter":
+			case "Space":
+				this.stopTheSlideShow();
+				this.onActiveIndexChange.emit(index);
+				event.preventDefault();
+				break;
+			case "ArrowDown":
+			case "ArrowUp": event.preventDefault();
+		}
+	}
+	isNavForwardDisabled() {
+		const val = this.value();
+		return !this.circular() && this._activeIndex() === val.length - 1;
+	}
+	isNavBackwardDisabled() {
+		return !this.circular() && this._activeIndex() === 0;
+	}
+	isIndicatorItemActive(index) {
+		return this._activeIndex() === index;
+	}
+	ariaSlideLabel() {
+		return this.aria?.slide;
+	}
+	ariaSlideNumber(value) {
+		return this.aria?.slideNumber?.replace(/{slideNumber}/g, value);
+	}
+	ariaPageLabel(value) {
+		return this.aria?.pageLabel?.replace(/{page}/g, value);
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.0",
+		ngImport: i0,
+		type: GalleriaItem,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.0",
+		type: GalleriaItem,
+		isStandalone: true,
+		selector: "div[pGalleriaItem]",
+		inputs: {
+			id: {
+				classPropertyName: "id",
+				publicName: "id",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			circular: {
+				classPropertyName: "circular",
+				publicName: "circular",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			value: {
+				classPropertyName: "value",
+				publicName: "value",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			showItemNavigators: {
+				classPropertyName: "showItemNavigators",
+				publicName: "showItemNavigators",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			showIndicators: {
+				classPropertyName: "showIndicators",
+				publicName: "showIndicators",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			slideShowActive: {
+				classPropertyName: "slideShowActive",
+				publicName: "slideShowActive",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			changeItemOnIndicatorHover: {
+				classPropertyName: "changeItemOnIndicatorHover",
+				publicName: "changeItemOnIndicatorHover",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			autoPlay: {
+				classPropertyName: "autoPlay",
+				publicName: "autoPlay",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			activeIndexInput: {
+				classPropertyName: "activeIndexInput",
+				publicName: "activeIndex",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		outputs: {
+			startSlideShow: "startSlideShow",
+			stopSlideShow: "stopSlideShow",
+			onActiveIndexChange: "onActiveIndexChange"
+		},
+		providers: [GalleriaStyle],
+		usesInheritance: true,
+		hostDirectives: [{ directive: i1.Bind }],
+		ngImport: i0,
+		template: `
         <div [pBind]="ptm('items')" [class]="cx('items')">
             @if (showItemNavigators()) {
                 <button type="button" role="navigation" [pBind]="ptm('prevButton')" [class]="cx('prevButton')" (click)="navBackward($event)" (focus)="onButtonFocus('left')" (blur)="onButtonBlur('left')" data-pc-group-section="itemnavigator">
@@ -503,15 +547,71 @@ class GalleriaItem extends BaseComponent {
                 }
             </ul>
         }
-    `, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: BindModule }, { kind: "directive", type: i1.Bind, selector: "[pBind]", inputs: ["pBind"] }, { kind: "component", type: ChevronLeft, selector: "svg[data-p-icon=\"chevron-left\"]" }, { kind: "component", type: ChevronRight, selector: "svg[data-p-icon=\"chevron-right\"]" }, { kind: "component", type: GalleriaItemSlot, selector: "div[pGalleriaItemSlot]", inputs: ["index", "item", "type"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: GalleriaItem, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'div[pGalleriaItem]',
-                    standalone: true,
-                    imports: [NgTemplateOutlet, BindModule, ChevronLeft, ChevronRight, GalleriaItemSlot],
-                    template: `
+    `,
+		isInline: true,
+		dependencies: [
+			{
+				kind: "directive",
+				type: NgTemplateOutlet,
+				selector: "[ngTemplateOutlet]",
+				inputs: [
+					"ngTemplateOutletContext",
+					"ngTemplateOutlet",
+					"ngTemplateOutletInjector"
+				]
+			},
+			{
+				kind: "ngmodule",
+				type: BindModule
+			},
+			{
+				kind: "directive",
+				type: i1.Bind,
+				selector: "[pBind]",
+				inputs: ["pBind"]
+			},
+			{
+				kind: "component",
+				type: ChevronLeft,
+				selector: "svg[data-p-icon=\"chevron-left\"]"
+			},
+			{
+				kind: "component",
+				type: ChevronRight,
+				selector: "svg[data-p-icon=\"chevron-right\"]"
+			},
+			{
+				kind: "component",
+				type: GalleriaItemSlot,
+				selector: "div[pGalleriaItemSlot]",
+				inputs: [
+					"index",
+					"item",
+					"type"
+				]
+			}
+		],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.0",
+	ngImport: i0,
+	type: GalleriaItem,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "div[pGalleriaItem]",
+			standalone: true,
+			imports: [
+				NgTemplateOutlet,
+				BindModule,
+				ChevronLeft,
+				ChevronRight,
+				GalleriaItemSlot
+			],
+			template: `
         <div [pBind]="ptm('items')" [class]="cx('items')">
             @if (showItemNavigators()) {
                 <button type="button" role="navigation" [pBind]="ptm('prevButton')" [class]="cx('prevButton')" (click)="navBackward($event)" (focus)="onButtonFocus('left')" (blur)="onButtonBlur('left')" data-pc-group-section="itemnavigator">
@@ -570,454 +670,584 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImpor
             </ul>
         }
     `,
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    providers: [GalleriaStyle],
-                    hostDirectives: [Bind]
-                }]
-        }], ctorParameters: () => [], propDecorators: { id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], circular: [{ type: i0.Input, args: [{ isSignal: true, alias: "circular", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], showItemNavigators: [{ type: i0.Input, args: [{ isSignal: true, alias: "showItemNavigators", required: false }] }], showIndicators: [{ type: i0.Input, args: [{ isSignal: true, alias: "showIndicators", required: false }] }], slideShowActive: [{ type: i0.Input, args: [{ isSignal: true, alias: "slideShowActive", required: false }] }], changeItemOnIndicatorHover: [{ type: i0.Input, args: [{ isSignal: true, alias: "changeItemOnIndicatorHover", required: false }] }], autoPlay: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoPlay", required: false }] }], startSlideShow: [{ type: i0.Output, args: ["startSlideShow"] }], stopSlideShow: [{ type: i0.Output, args: ["stopSlideShow"] }], onActiveIndexChange: [{ type: i0.Output, args: ["onActiveIndexChange"] }], activeIndexInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "activeIndex", required: false }] }] } });
-
-class GalleriaThumbnails extends BaseComponent {
-    hostName = 'Galleria';
-    galleria = inject(GALLERIA_INSTANCE);
-    bindDirectiveInstance = inject(Bind, { self: true });
-    onAfterViewChecked() {
-        this.bindDirectiveInstance.setAttrs(this.ptm('thumbnails'));
-    }
-    containerId = input(/* @ts-ignore */
-    ...(ngDevMode ? [undefined, { debugName: "containerId" }] : /* istanbul ignore next */ []));
-    value = input(/* @ts-ignore */
-    ...(ngDevMode ? [undefined, { debugName: "value" }] : /* istanbul ignore next */ []));
-    isVertical = input(false, { ...(ngDevMode ? { debugName: "isVertical" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
-    slideShowActive = input(false, { ...(ngDevMode ? { debugName: "slideShowActive" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
-    circular = input(false, { ...(ngDevMode ? { debugName: "circular" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
-    responsiveOptions = input(/* @ts-ignore */
-    ...(ngDevMode ? [undefined, { debugName: "responsiveOptions" }] : /* istanbul ignore next */ []));
-    contentHeight = input('300px', /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "contentHeight" }] : /* istanbul ignore next */ []));
-    showThumbnailNavigators = input(true, { ...(ngDevMode ? { debugName: "showThumbnailNavigators" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
-    numVisibleInput = input(0, { ...(ngDevMode ? { debugName: "numVisibleInput" } : /* istanbul ignore next */ {}), alias: 'numVisible' });
-    activeIndexInput = input(0, { ...(ngDevMode ? { debugName: "activeIndexInput" } : /* istanbul ignore next */ {}), alias: 'activeIndex' });
-    onActiveIndexChange = output();
-    stopSlideShow = output();
-    itemsContainer = viewChild('itemsContainer', /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "itemsContainer" }] : /* istanbul ignore next */ []));
-    index;
-    startPos = null;
-    thumbnailsStyle = null;
-    sortedResponsiveOptions = null;
-    totalShiftedItems = 0;
-    page = 0;
-    documentResizeListener;
-    _numVisible = linkedSignal(() => this.numVisibleInput(), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "_numVisible" }] : /* istanbul ignore next */ []));
-    _oldNumVisible = 0;
-    d_numVisible = linkedSignal({ ...(ngDevMode ? { debugName: "d_numVisible" } : /* istanbul ignore next */ {}), source: () => this.numVisibleInput(),
-        computation: (source, previous) => {
-            if (previous) {
-                this._oldNumVisible = previous.value;
-            }
-            return source;
-        } });
-    _oldactiveIndex = 0;
-    _activeIndex = linkedSignal({ ...(ngDevMode ? { debugName: "_activeIndex" } : /* istanbul ignore next */ {}), source: () => this.activeIndexInput(),
-        computation: (source, previous) => {
-            if (previous) {
-                this._oldactiveIndex = previous.value;
-            }
-            return source;
-        } });
-    _componentStyle = inject(GalleriaStyle);
-    viewportHeight = computed(() => (this.isVertical() ? this.contentHeight() : ''), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "viewportHeight" }] : /* istanbul ignore next */ []));
-    get aria() {
-        return this.galleria.config.translation.aria;
-    }
-    isActiveItem(index) {
-        return this._activeIndex() === index;
-    }
-    getItemTabIndex(index) {
-        return this.isActiveItem(index) ? 0 : -1;
-    }
-    getAriaCurrent(index) {
-        return this.isActiveItem(index) ? 'page' : undefined;
-    }
-    getAriaControls(index) {
-        return this.containerId() + '_item_' + index;
-    }
-    onInit() {
-        if (isPlatformBrowser(this.platformId)) {
-            this.createStyle();
-            if (this.responsiveOptions()) {
-                this.bindDocumentListeners();
-            }
-        }
-    }
-    onAfterContentChecked() {
-        let totalShiftedItems = this.totalShiftedItems;
-        const d_numVisible = this.d_numVisible();
-        const activeIndex = this._activeIndex();
-        const itemsContainer = this.itemsContainer();
-        const val = this.value();
-        if ((this._oldNumVisible !== d_numVisible || this._oldactiveIndex !== activeIndex) && itemsContainer) {
-            if (activeIndex <= this.getMedianItemIndex()) {
-                totalShiftedItems = 0;
-            }
-            else if (val.length - d_numVisible + this.getMedianItemIndex() < activeIndex) {
-                totalShiftedItems = d_numVisible - val.length;
-            }
-            else if (val.length - d_numVisible < activeIndex && d_numVisible % 2 === 0) {
-                totalShiftedItems = activeIndex * -1 + this.getMedianItemIndex() + 1;
-            }
-            else {
-                totalShiftedItems = activeIndex * -1 + this.getMedianItemIndex();
-            }
-            if (totalShiftedItems !== this.totalShiftedItems) {
-                this.totalShiftedItems = totalShiftedItems;
-            }
-            if (itemsContainer && itemsContainer.nativeElement) {
-                itemsContainer.nativeElement.style.transform = this.isVertical() ? `translate3d(0, ${totalShiftedItems * (100 / d_numVisible)}%, 0)` : `translate3d(${totalShiftedItems * (100 / d_numVisible)}%, 0, 0)`;
-            }
-            if (this._oldactiveIndex !== activeIndex) {
-                this.document.body.setAttribute('data-p-items-hidden', 'false');
-                !this.$unstyled() && removeClass(itemsContainer.nativeElement, 'p-items-hidden');
-                itemsContainer.nativeElement.style.transition = 'transform 500ms ease 0s';
-            }
-            this._oldactiveIndex = activeIndex;
-            this._oldNumVisible = d_numVisible;
-        }
-    }
-    onAfterViewInit() {
-        if (isPlatformBrowser(this.platformId)) {
-            this.calculatePosition();
-        }
-    }
-    createStyle() {
-        if (!this.thumbnailsStyle) {
-            this.thumbnailsStyle = this.document.createElement('style');
-            setAttribute(this.thumbnailsStyle, 'nonce', this.galleria.config?.csp()?.nonce);
-            this.document.body.appendChild(this.thumbnailsStyle);
-        }
-        const d_numVisible = this.d_numVisible();
-        let innerHTML = `
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			providers: [GalleriaStyle],
+			hostDirectives: [Bind]
+		}]
+	}],
+	ctorParameters: () => [],
+	propDecorators: {
+		id: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "id",
+				required: false
+			}]
+		}],
+		circular: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "circular",
+				required: false
+			}]
+		}],
+		value: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "value",
+				required: false
+			}]
+		}],
+		showItemNavigators: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "showItemNavigators",
+				required: false
+			}]
+		}],
+		showIndicators: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "showIndicators",
+				required: false
+			}]
+		}],
+		slideShowActive: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "slideShowActive",
+				required: false
+			}]
+		}],
+		changeItemOnIndicatorHover: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "changeItemOnIndicatorHover",
+				required: false
+			}]
+		}],
+		autoPlay: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "autoPlay",
+				required: false
+			}]
+		}],
+		startSlideShow: [{
+			type: i0.Output,
+			args: ["startSlideShow"]
+		}],
+		stopSlideShow: [{
+			type: i0.Output,
+			args: ["stopSlideShow"]
+		}],
+		onActiveIndexChange: [{
+			type: i0.Output,
+			args: ["onActiveIndexChange"]
+		}],
+		activeIndexInput: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "activeIndex",
+				required: false
+			}]
+		}]
+	}
+});
+var GalleriaThumbnails = class GalleriaThumbnails extends BaseComponent {
+	hostName = "Galleria";
+	galleria = inject(GALLERIA_INSTANCE);
+	bindDirectiveInstance = inject(Bind, { self: true });
+	containerId = input(...ngDevMode ? [void 0, { debugName: "containerId" }] : /* istanbul ignore next */ []);
+	value = input(...ngDevMode ? [void 0, { debugName: "value" }] : /* istanbul ignore next */ []);
+	isVertical = input(false, {
+		...ngDevMode ? { debugName: "isVertical" } : /* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	slideShowActive = input(false, {
+		...ngDevMode ? { debugName: "slideShowActive" } : /* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	circular = input(false, {
+		...ngDevMode ? { debugName: "circular" } : /* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	responsiveOptions = input(...ngDevMode ? [void 0, { debugName: "responsiveOptions" }] : /* istanbul ignore next */ []);
+	contentHeight = input("300px", ...ngDevMode ? [{ debugName: "contentHeight" }] : /* istanbul ignore next */ []);
+	showThumbnailNavigators = input(true, {
+		...ngDevMode ? { debugName: "showThumbnailNavigators" } : /* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	numVisibleInput = input(0, {
+		...ngDevMode ? { debugName: "numVisibleInput" } : /* istanbul ignore next */ {},
+		alias: "numVisible"
+	});
+	activeIndexInput = input(0, {
+		...ngDevMode ? { debugName: "activeIndexInput" } : /* istanbul ignore next */ {},
+		alias: "activeIndex"
+	});
+	onActiveIndexChange = output();
+	stopSlideShow = output();
+	itemsContainer = viewChild("itemsContainer", ...ngDevMode ? [{ debugName: "itemsContainer" }] : /* istanbul ignore next */ []);
+	index;
+	startPos = null;
+	thumbnailsStyle = null;
+	sortedResponsiveOptions = null;
+	totalShiftedItems = 0;
+	page = 0;
+	documentResizeListener;
+	_numVisible = linkedSignal(() => this.numVisibleInput(), ...ngDevMode ? [{ debugName: "_numVisible" }] : /* istanbul ignore next */ []);
+	_oldNumVisible = 0;
+	d_numVisible = linkedSignal({
+		...ngDevMode ? { debugName: "d_numVisible" } : /* istanbul ignore next */ {},
+		source: () => this.numVisibleInput(),
+		computation: (source, previous) => {
+			if (previous) this._oldNumVisible = previous.value;
+			return source;
+		}
+	});
+	_oldactiveIndex = 0;
+	_activeIndex = linkedSignal({
+		...ngDevMode ? { debugName: "_activeIndex" } : /* istanbul ignore next */ {},
+		source: () => this.activeIndexInput(),
+		computation: (source, previous) => {
+			if (previous) this._oldactiveIndex = previous.value;
+			return source;
+		}
+	});
+	_componentStyle = inject(GalleriaStyle);
+	viewportHeight = computed(() => this.isVertical() ? this.contentHeight() : "", ...ngDevMode ? [{ debugName: "viewportHeight" }] : /* istanbul ignore next */ []);
+	get aria() {
+		return this.galleria.config.translation.aria;
+	}
+	onAfterViewChecked() {
+		this.bindDirectiveInstance.setAttrs(this.ptm("thumbnails"));
+	}
+	isActiveItem(index) {
+		return this._activeIndex() === index;
+	}
+	getItemTabIndex(index) {
+		return this.isActiveItem(index) ? 0 : -1;
+	}
+	getAriaCurrent(index) {
+		return this.isActiveItem(index) ? "page" : void 0;
+	}
+	getAriaControls(index) {
+		return this.containerId() + "_item_" + index;
+	}
+	onInit() {
+		if (isPlatformBrowser(this.platformId)) {
+			this.createStyle();
+			if (this.responsiveOptions()) this.bindDocumentListeners();
+		}
+	}
+	onAfterContentChecked() {
+		let totalShiftedItems = this.totalShiftedItems;
+		const d_numVisible = this.d_numVisible();
+		const activeIndex = this._activeIndex();
+		const itemsContainer = this.itemsContainer();
+		const val = this.value();
+		if ((this._oldNumVisible !== d_numVisible || this._oldactiveIndex !== activeIndex) && itemsContainer) {
+			if (activeIndex <= this.getMedianItemIndex()) totalShiftedItems = 0;
+			else if (val.length - d_numVisible + this.getMedianItemIndex() < activeIndex) totalShiftedItems = d_numVisible - val.length;
+			else if (val.length - d_numVisible < activeIndex && d_numVisible % 2 === 0) totalShiftedItems = activeIndex * -1 + this.getMedianItemIndex() + 1;
+			else totalShiftedItems = activeIndex * -1 + this.getMedianItemIndex();
+			if (totalShiftedItems !== this.totalShiftedItems) this.totalShiftedItems = totalShiftedItems;
+			if (itemsContainer && itemsContainer.nativeElement) itemsContainer.nativeElement.style.transform = this.isVertical() ? `translate3d(0, ${totalShiftedItems * (100 / d_numVisible)}%, 0)` : `translate3d(${totalShiftedItems * (100 / d_numVisible)}%, 0, 0)`;
+			if (this._oldactiveIndex !== activeIndex) {
+				this.document.body.setAttribute("data-p-items-hidden", "false");
+				if (!this.$unstyled()) removeClass(itemsContainer.nativeElement, "p-items-hidden");
+				itemsContainer.nativeElement.style.transition = "transform 500ms ease 0s";
+			}
+			this._oldactiveIndex = activeIndex;
+			this._oldNumVisible = d_numVisible;
+		}
+	}
+	onAfterViewInit() {
+		if (isPlatformBrowser(this.platformId)) this.calculatePosition();
+	}
+	createStyle() {
+		if (!this.thumbnailsStyle) {
+			this.thumbnailsStyle = this.document.createElement("style");
+			setAttribute(this.thumbnailsStyle, "nonce", this.galleria.config?.csp()?.nonce);
+			this.document.body.appendChild(this.thumbnailsStyle);
+		}
+		const d_numVisible = this.d_numVisible();
+		let innerHTML = `
             #${this.containerId()} .p-galleria-thumbnail-item {
                 flex: 1 0 ${100 / d_numVisible}%
             }
         `;
-        const responsiveOptions = this.responsiveOptions();
-        if (responsiveOptions && !this.$unstyled()) {
-            this.sortedResponsiveOptions = [...responsiveOptions];
-            this.sortedResponsiveOptions.sort((data1, data2) => {
-                const value1 = data1.breakpoint;
-                const value2 = data2.breakpoint;
-                let result;
-                if (value1 == null && value2 != null)
-                    result = -1;
-                else if (value1 != null && value2 == null)
-                    result = 1;
-                else if (value1 == null && value2 == null)
-                    result = 0;
-                else if (typeof value1 === 'string' && typeof value2 === 'string')
-                    result = value1.localeCompare(value2, undefined, { numeric: true });
-                else
-                    result = value1 < value2 ? -1 : value1 > value2 ? 1 : 0;
-                return -1 * result;
-            });
-            for (let i = 0; i < this.sortedResponsiveOptions.length; i++) {
-                let res = this.sortedResponsiveOptions[i];
-                innerHTML += `
+		const responsiveOptions = this.responsiveOptions();
+		if (responsiveOptions && !this.$unstyled()) {
+			this.sortedResponsiveOptions = [...responsiveOptions];
+			this.sortedResponsiveOptions.sort((data1, data2) => {
+				const value1 = data1.breakpoint;
+				const value2 = data2.breakpoint;
+				let result;
+				if (value1 == null && value2 != null) result = -1;
+				else if (value1 != null && value2 == null) result = 1;
+				else if (value1 == null && value2 == null) result = 0;
+				else if (typeof value1 === "string" && typeof value2 === "string") result = value1.localeCompare(value2, void 0, { numeric: true });
+				else result = value1 < value2 ? -1 : value1 > value2 ? 1 : 0;
+				return -1 * result;
+			});
+			for (let i = 0; i < this.sortedResponsiveOptions.length; i++) {
+				let res = this.sortedResponsiveOptions[i];
+				innerHTML += `
                     @media screen and (max-width: ${res.breakpoint}) {
                         #${this.containerId()} .p-galleria-thumbnail-item {
                             flex: 1 0 ${100 / res.numVisible}%
                         }
                     }
                 `;
-            }
-        }
-        this.thumbnailsStyle.innerHTML = innerHTML;
-        setAttribute(this.thumbnailsStyle, 'nonce', this.galleria.config?.csp()?.nonce);
-    }
-    calculatePosition() {
-        if (isPlatformBrowser(this.platformId)) {
-            const itemsContainer = this.itemsContainer();
-            if (itemsContainer && this.sortedResponsiveOptions) {
-                let windowWidth = window.innerWidth;
-                let matchedResponsiveData = {
-                    numVisible: this._numVisible()
-                };
-                for (let i = 0; i < this.sortedResponsiveOptions.length; i++) {
-                    let res = this.sortedResponsiveOptions[i];
-                    if (parseInt(res.breakpoint, 10) >= windowWidth) {
-                        matchedResponsiveData = res;
-                    }
-                }
-                if (this.d_numVisible() !== matchedResponsiveData.numVisible) {
-                    this.d_numVisible.set(matchedResponsiveData.numVisible);
-                }
-            }
-        }
-    }
-    getTabIndex(index) {
-        return this.isItemActive(index) ? 0 : null;
-    }
-    navForward(e) {
-        this.stopTheSlideShow();
-        const activeIndex = this._activeIndex();
-        const val = this.value();
-        let nextItemIndex = activeIndex + 1;
-        if (nextItemIndex + this.totalShiftedItems > this.getMedianItemIndex() && (-1 * this.totalShiftedItems < this.getTotalPageNumber() - 1 || this.circular())) {
-            this.step(-1);
-        }
-        let newActiveIndex = this.circular() && val.length - 1 === activeIndex ? 0 : nextItemIndex;
-        this.onActiveIndexChange.emit(newActiveIndex);
-        if (e.cancelable) {
-            e.preventDefault();
-        }
-    }
-    navBackward(e) {
-        this.stopTheSlideShow();
-        const activeIndex = this._activeIndex();
-        const val = this.value();
-        let prevItemIndex = activeIndex !== 0 ? activeIndex - 1 : 0;
-        let diff = prevItemIndex + this.totalShiftedItems;
-        if (this.d_numVisible() - diff - 1 > this.getMedianItemIndex() && (-1 * this.totalShiftedItems !== 0 || this.circular())) {
-            this.step(1);
-        }
-        let newActiveIndex = this.circular() && activeIndex === 0 ? val.length - 1 : prevItemIndex;
-        this.onActiveIndexChange.emit(newActiveIndex);
-        if (e.cancelable) {
-            e.preventDefault();
-        }
-    }
-    onItemClick(index) {
-        this.stopTheSlideShow();
-        const activeIndex = this._activeIndex();
-        let selectedItemIndex = index;
-        if (selectedItemIndex !== activeIndex) {
-            const diff = selectedItemIndex + this.totalShiftedItems;
-            let dir = 0;
-            if (selectedItemIndex < activeIndex) {
-                dir = this.d_numVisible() - diff - 1 - this.getMedianItemIndex();
-                if (dir > 0 && -1 * this.totalShiftedItems !== 0) {
-                    this.step(dir);
-                }
-            }
-            else {
-                dir = this.getMedianItemIndex() - diff;
-                if (dir < 0 && -1 * this.totalShiftedItems < this.getTotalPageNumber() - 1) {
-                    this.step(dir);
-                }
-            }
-            this._activeIndex.set(selectedItemIndex);
-            this.onActiveIndexChange.emit(selectedItemIndex);
-        }
-    }
-    onThumbnailKeydown(event, index) {
-        if (event.code === 'Enter' || event.code === 'Space') {
-            this.onItemClick(index);
-            event.preventDefault();
-        }
-        switch (event.code) {
-            case 'ArrowRight':
-                this.onRightKey();
-                break;
-            case 'ArrowLeft':
-                this.onLeftKey();
-                break;
-            case 'Home':
-                this.onHomeKey();
-                event.preventDefault();
-                break;
-            case 'End':
-                this.onEndKey();
-                event.preventDefault();
-                break;
-            case 'ArrowUp':
-            case 'ArrowDown':
-                event.preventDefault();
-                break;
-            case 'Tab':
-                this.onTabKey();
-                break;
-            default:
-                break;
-        }
-    }
-    onRightKey() {
-        const itemsContainer = this.itemsContainer();
-        const indicators = find(itemsContainer?.nativeElement, '[data-pc-section="thumbnailitem"]');
-        const activeIndex = this.findFocusedIndicatorIndex();
-        this.changedFocusedIndicator(activeIndex, activeIndex + 1 === indicators.length ? indicators.length - 1 : activeIndex + 1);
-    }
-    onLeftKey() {
-        const activeIndex = this.findFocusedIndicatorIndex();
-        this.changedFocusedIndicator(activeIndex, activeIndex - 1 <= 0 ? 0 : activeIndex - 1);
-    }
-    onHomeKey() {
-        const activeIndex = this.findFocusedIndicatorIndex();
-        this.changedFocusedIndicator(activeIndex, 0);
-    }
-    onEndKey() {
-        const itemsContainer = this.itemsContainer();
-        const indicators = find(itemsContainer?.nativeElement, '[data-pc-section="thumbnailitem"]');
-        const activeIndex = this.findFocusedIndicatorIndex();
-        this.changedFocusedIndicator(activeIndex, indicators.length - 1);
-    }
-    onTabKey() {
-        const itemsContainer = this.itemsContainer();
-        const indicators = [...find(itemsContainer?.nativeElement, '[data-pc-section="thumbnailitem"]')];
-        const highlightedIndex = indicators.findIndex((ind) => getAttribute(ind, 'data-p-active') === true);
-        const activeIndicator = findSingle(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 itemsContainer = this.itemsContainer();
-        const indicators = [...find(itemsContainer?.nativeElement, '[data-pc-section="thumbnailitem"]')];
-        const activeIndicator = findSingle(itemsContainer?.nativeElement, '[data-pc-section="thumbnailitem"] > [tabindex="0"]');
-        return indicators.findIndex((ind) => ind === activeIndicator?.parentElement);
-    }
-    changedFocusedIndicator(prevInd, nextInd) {
-        const itemsContainer = this.itemsContainer();
-        const indicators = find(itemsContainer?.nativeElement, '[data-pc-section="thumbnailitem"]');
-        indicators[prevInd].children[0].tabIndex = '-1';
-        indicators[nextInd].children[0].tabIndex = '0';
-        indicators[nextInd].children[0].focus();
-    }
-    step(dir) {
-        const d_numVisible = this.d_numVisible();
-        const val = this.value();
-        const activeIndex = this._activeIndex();
-        let totalShiftedItems = this.totalShiftedItems + dir;
-        if (dir < 0 && -1 * totalShiftedItems + d_numVisible > val.length - 1) {
-            totalShiftedItems = d_numVisible - val.length;
-        }
-        else if (dir > 0 && totalShiftedItems > 0) {
-            totalShiftedItems = 0;
-        }
-        if (this.circular()) {
-            if (dir < 0 && val.length - 1 === activeIndex) {
-                totalShiftedItems = 0;
-            }
-            else if (dir > 0 && activeIndex === 0) {
-                totalShiftedItems = d_numVisible - val.length;
-            }
-        }
-        const itemsContainer = this.itemsContainer();
-        if (itemsContainer) {
-            this.document.body.setAttribute('data-p-items-hidden', 'false');
-            !this.$unstyled() && removeClass(itemsContainer.nativeElement, 'p-items-hidden');
-            itemsContainer.nativeElement.style.transform = this.isVertical() ? `translate3d(0, ${totalShiftedItems * (100 / d_numVisible)}%, 0)` : `translate3d(${totalShiftedItems * (100 / d_numVisible)}%, 0, 0)`;
-            itemsContainer.nativeElement.style.transition = 'transform 500ms ease 0s';
-        }
-        this.totalShiftedItems = totalShiftedItems;
-    }
-    stopTheSlideShow() {
-        if (this.slideShowActive()) {
-            this.stopSlideShow.emit();
-        }
-    }
-    changePageOnTouch(e, diff) {
-        if (diff < 0) {
-            // left
-            this.navForward(e);
-        }
-        else {
-            // right
-            this.navBackward(e);
-        }
-    }
-    getTotalPageNumber() {
-        const val = this.value();
-        const d_numVisible = this.d_numVisible();
-        return val.length > d_numVisible ? val.length - d_numVisible + 1 : 0;
-    }
-    getMedianItemIndex() {
-        const d_numVisible = this.d_numVisible();
-        let index = Math.floor(d_numVisible / 2);
-        return d_numVisible % 2 ? index : index - 1;
-    }
-    onTransitionEnd() {
-        const itemsContainer = this.itemsContainer();
-        if (itemsContainer && itemsContainer.nativeElement) {
-            this.document.body.setAttribute('data-p-items-hidden', 'true');
-            !this.$unstyled() && addClass(itemsContainer.nativeElement, 'p-items-hidden');
-            itemsContainer.nativeElement.style.transition = '';
-        }
-    }
-    onTouchEnd(e) {
-        let touchobj = e.changedTouches[0];
-        if (this.isVertical()) {
-            this.changePageOnTouch(e, touchobj.pageY - this.startPos.y);
-        }
-        else {
-            this.changePageOnTouch(e, touchobj.pageX - this.startPos.x);
-        }
-    }
-    onTouchMove(e) {
-        if (e.cancelable) {
-            e.preventDefault();
-        }
-    }
-    onTouchStart(e) {
-        let touchobj = e.changedTouches[0];
-        this.startPos = {
-            x: touchobj.pageX,
-            y: touchobj.pageY
-        };
-    }
-    isNavBackwardDisabled() {
-        const val = this.value();
-        const d_numVisible = this.d_numVisible();
-        return (!this.circular() && this._activeIndex() === 0) || val.length <= d_numVisible;
-    }
-    isNavForwardDisabled() {
-        const val = this.value();
-        const d_numVisible = this.d_numVisible();
-        return (!this.circular() && this._activeIndex() === val.length - 1) || val.length <= d_numVisible;
-    }
-    firstItemAciveIndex() {
-        return this.totalShiftedItems * -1;
-    }
-    lastItemActiveIndex() {
-        return this.firstItemAciveIndex() + this.d_numVisible() - 1;
-    }
-    isItemActive(index) {
-        return this.firstItemAciveIndex() <= index && this.lastItemActiveIndex() >= index;
-    }
-    bindDocumentListeners() {
-        if (isPlatformBrowser(this.platformId)) {
-            const window = this.document.defaultView || 'window';
-            this.documentResizeListener = this.renderer.listen(window, 'resize', () => {
-                this.calculatePosition();
-            });
-        }
-    }
-    unbindDocumentListeners() {
-        if (this.documentResizeListener) {
-            this.documentResizeListener();
-            this.documentResizeListener = null;
-        }
-    }
-    onDestroy() {
-        if (this.responsiveOptions()) {
-            this.unbindDocumentListeners();
-        }
-        if (this.thumbnailsStyle) {
-            this.thumbnailsStyle.parentNode?.removeChild(this.thumbnailsStyle);
-        }
-    }
-    ariaPrevButtonLabel() {
-        return this.aria?.prevPageLabel;
-    }
-    ariaNextButtonLabel() {
-        return this.aria?.nextPageLabel;
-    }
-    ariaPageLabel(value) {
-        return this.aria?.pageLabel?.replace(/{page}/g, value);
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: GalleriaThumbnails, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.2", type: GalleriaThumbnails, isStandalone: true, selector: "div[pGalleriaThumbnails]", inputs: { containerId: { classPropertyName: "containerId", publicName: "containerId", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, isVertical: { classPropertyName: "isVertical", publicName: "isVertical", isSignal: true, isRequired: false, transformFunction: null }, slideShowActive: { classPropertyName: "slideShowActive", publicName: "slideShowActive", isSignal: true, isRequired: false, transformFunction: null }, circular: { classPropertyName: "circular", publicName: "circular", isSignal: true, isRequired: false, transformFunction: null }, responsiveOptions: { classPropertyName: "responsiveOptions", publicName: "responsiveOptions", isSignal: true, isRequired: false, transformFunction: null }, contentHeight: { classPropertyName: "contentHeight", publicName: "contentHeight", isSignal: true, isRequired: false, transformFunction: null }, showThumbnailNavigators: { classPropertyName: "showThumbnailNavigators", publicName: "showThumbnailNavigators", isSignal: true, isRequired: false, transformFunction: null }, numVisibleInput: { classPropertyName: "numVisibleInput", publicName: "numVisible", isSignal: true, isRequired: false, transformFunction: null }, activeIndexInput: { classPropertyName: "activeIndexInput", publicName: "activeIndex", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onActiveIndexChange: "onActiveIndexChange", stopSlideShow: "stopSlideShow" }, host: { properties: { "class": "cx(\"thumbnails\")" } }, providers: [GalleriaStyle], viewQueries: [{ propertyName: "itemsContainer", first: true, predicate: ["itemsContainer"], descendants: true, isSignal: true }], usesInheritance: true, hostDirectives: [{ directive: i1.Bind }], ngImport: i0, template: `
+			}
+		}
+		this.thumbnailsStyle.innerHTML = innerHTML;
+		setAttribute(this.thumbnailsStyle, "nonce", this.galleria.config?.csp()?.nonce);
+	}
+	calculatePosition() {
+		if (isPlatformBrowser(this.platformId)) {
+			if (this.itemsContainer() && this.sortedResponsiveOptions) {
+				let windowWidth = window.innerWidth;
+				let matchedResponsiveData = { numVisible: this._numVisible() };
+				for (let i = 0; i < this.sortedResponsiveOptions.length; i++) {
+					let res = this.sortedResponsiveOptions[i];
+					if (parseInt(res.breakpoint, 10) >= windowWidth) matchedResponsiveData = res;
+				}
+				if (this.d_numVisible() !== matchedResponsiveData.numVisible) this.d_numVisible.set(matchedResponsiveData.numVisible);
+			}
+		}
+	}
+	getTabIndex(index) {
+		return this.isItemActive(index) ? 0 : null;
+	}
+	navForward(e) {
+		this.stopTheSlideShow();
+		const activeIndex = this._activeIndex();
+		const val = this.value();
+		let nextItemIndex = activeIndex + 1;
+		if (nextItemIndex + this.totalShiftedItems > this.getMedianItemIndex() && (-1 * this.totalShiftedItems < this.getTotalPageNumber() - 1 || this.circular())) this.step(-1);
+		let newActiveIndex = this.circular() && val.length - 1 === activeIndex ? 0 : nextItemIndex;
+		this.onActiveIndexChange.emit(newActiveIndex);
+		if (e.cancelable) e.preventDefault();
+	}
+	navBackward(e) {
+		this.stopTheSlideShow();
+		const activeIndex = this._activeIndex();
+		const val = this.value();
+		let prevItemIndex = activeIndex !== 0 ? activeIndex - 1 : 0;
+		let diff = prevItemIndex + this.totalShiftedItems;
+		if (this.d_numVisible() - diff - 1 > this.getMedianItemIndex() && (-1 * this.totalShiftedItems !== 0 || this.circular())) this.step(1);
+		let newActiveIndex = this.circular() && activeIndex === 0 ? val.length - 1 : prevItemIndex;
+		this.onActiveIndexChange.emit(newActiveIndex);
+		if (e.cancelable) e.preventDefault();
+	}
+	onItemClick(index) {
+		this.stopTheSlideShow();
+		const activeIndex = this._activeIndex();
+		let selectedItemIndex = index;
+		if (selectedItemIndex !== activeIndex) {
+			const diff = selectedItemIndex + this.totalShiftedItems;
+			let dir = 0;
+			if (selectedItemIndex < activeIndex) {
+				dir = this.d_numVisible() - diff - 1 - this.getMedianItemIndex();
+				if (dir > 0 && -1 * this.totalShiftedItems !== 0) this.step(dir);
+			} else {
+				dir = this.getMedianItemIndex() - diff;
+				if (dir < 0 && -1 * this.totalShiftedItems < this.getTotalPageNumber() - 1) this.step(dir);
+			}
+			this._activeIndex.set(selectedItemIndex);
+			this.onActiveIndexChange.emit(selectedItemIndex);
+		}
+	}
+	onThumbnailKeydown(event, index) {
+		if (event.code === "Enter" || event.code === "Space") {
+			this.onItemClick(index);
+			event.preventDefault();
+		}
+		switch (event.code) {
+			case "ArrowRight":
+				this.onRightKey();
+				break;
+			case "ArrowLeft":
+				this.onLeftKey();
+				break;
+			case "Home":
+				this.onHomeKey();
+				event.preventDefault();
+				break;
+			case "End":
+				this.onEndKey();
+				event.preventDefault();
+				break;
+			case "ArrowUp":
+			case "ArrowDown":
+				event.preventDefault();
+				break;
+			case "Tab": this.onTabKey();
+		}
+	}
+	onRightKey() {
+		const itemsContainer = this.itemsContainer();
+		const indicators = find(itemsContainer?.nativeElement, "[data-pc-section=\"thumbnailitem\"]");
+		const activeIndex = this.findFocusedIndicatorIndex();
+		this.changedFocusedIndicator(activeIndex, activeIndex + 1 === indicators.length ? indicators.length - 1 : activeIndex + 1);
+	}
+	onLeftKey() {
+		const activeIndex = this.findFocusedIndicatorIndex();
+		this.changedFocusedIndicator(activeIndex, activeIndex - 1 <= 0 ? 0 : activeIndex - 1);
+	}
+	onHomeKey() {
+		const activeIndex = this.findFocusedIndicatorIndex();
+		this.changedFocusedIndicator(activeIndex, 0);
+	}
+	onEndKey() {
+		const itemsContainer = this.itemsContainer();
+		const indicators = find(itemsContainer?.nativeElement, "[data-pc-section=\"thumbnailitem\"]");
+		const activeIndex = this.findFocusedIndicatorIndex();
+		this.changedFocusedIndicator(activeIndex, indicators.length - 1);
+	}
+	onTabKey() {
+		const itemsContainer = this.itemsContainer();
+		const indicators = [...find(itemsContainer?.nativeElement, "[data-pc-section=\"thumbnailitem\"]")];
+		const highlightedIndex = indicators.findIndex((ind) => getAttribute(ind, "data-p-active") === true);
+		const activeIndicator = findSingle(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 itemsContainer = this.itemsContainer();
+		const indicators = [...find(itemsContainer?.nativeElement, "[data-pc-section=\"thumbnailitem\"]")];
+		const activeIndicator = findSingle(itemsContainer?.nativeElement, "[data-pc-section=\"thumbnailitem\"] > [tabindex=\"0\"]");
+		return indicators.findIndex((ind) => ind === activeIndicator?.parentElement);
+	}
+	changedFocusedIndicator(prevInd, nextInd) {
+		const itemsContainer = this.itemsContainer();
+		const indicators = find(itemsContainer?.nativeElement, "[data-pc-section=\"thumbnailitem\"]");
+		indicators[prevInd].children[0].tabIndex = "-1";
+		indicators[nextInd].children[0].tabIndex = "0";
+		indicators[nextInd].children[0].focus();
+	}
+	step(dir) {
+		const d_numVisible = this.d_numVisible();
+		const val = this.value();
+		const activeIndex = this._activeIndex();
+		let totalShiftedItems = this.totalShiftedItems + dir;
+		if (dir < 0 && -1 * totalShiftedItems + d_numVisible > val.length - 1) totalShiftedItems = d_numVisible - val.length;
+		else if (dir > 0 && totalShiftedItems > 0) totalShiftedItems = 0;
+		if (this.circular()) {
+			if (dir < 0 && val.length - 1 === activeIndex) totalShiftedItems = 0;
+			else if (dir > 0 && activeIndex === 0) totalShiftedItems = d_numVisible - val.length;
+		}
+		const itemsContainer = this.itemsContainer();
+		if (itemsContainer) {
+			this.document.body.setAttribute("data-p-items-hidden", "false");
+			if (!this.$unstyled()) removeClass(itemsContainer.nativeElement, "p-items-hidden");
+			itemsContainer.nativeElement.style.transform = this.isVertical() ? `translate3d(0, ${totalShiftedItems * (100 / d_numVisible)}%, 0)` : `translate3d(${totalShiftedItems * (100 / d_numVisible)}%, 0, 0)`;
+			itemsContainer.nativeElement.style.transition = "transform 500ms ease 0s";
+		}
+		this.totalShiftedItems = totalShiftedItems;
+	}
+	stopTheSlideShow() {
+		if (this.slideShowActive()) this.stopSlideShow.emit();
+	}
+	changePageOnTouch(e, diff) {
+		if (diff < 0) this.navForward(e);
+		else this.navBackward(e);
+	}
+	getTotalPageNumber() {
+		const val = this.value();
+		const d_numVisible = this.d_numVisible();
+		return val.length > d_numVisible ? val.length - d_numVisible + 1 : 0;
+	}
+	getMedianItemIndex() {
+		const d_numVisible = this.d_numVisible();
+		let index = Math.floor(d_numVisible / 2);
+		return d_numVisible % 2 ? index : index - 1;
+	}
+	onTransitionEnd() {
+		const itemsContainer = this.itemsContainer();
+		if (itemsContainer && itemsContainer.nativeElement) {
+			this.document.body.setAttribute("data-p-items-hidden", "true");
+			if (!this.$unstyled()) addClass(itemsContainer.nativeElement, "p-items-hidden");
+			itemsContainer.nativeElement.style.transition = "";
+		}
+	}
+	onTouchEnd(e) {
+		let touchobj = e.changedTouches[0];
+		if (this.isVertical()) this.changePageOnTouch(e, touchobj.pageY - this.startPos.y);
+		else this.changePageOnTouch(e, touchobj.pageX - this.startPos.x);
+	}
+	onTouchMove(e) {
+		if (e.cancelable) e.preventDefault();
+	}
+	onTouchStart(e) {
+		let touchobj = e.changedTouches[0];
+		this.startPos = {
+			x: touchobj.pageX,
+			y: touchobj.pageY
+		};
+	}
+	isNavBackwardDisabled() {
+		const val = this.value();
+		const d_numVisible = this.d_numVisible();
+		return !this.circular() && this._activeIndex() === 0 || val.length <= d_numVisible;
+	}
+	isNavForwardDisabled() {
+		const val = this.value();
+		const d_numVisible = this.d_numVisible();
+		return !this.circular() && this._activeIndex() === val.length - 1 || val.length <= d_numVisible;
+	}
+	firstItemAciveIndex() {
+		return this.totalShiftedItems * -1;
+	}
+	lastItemActiveIndex() {
+		return this.firstItemAciveIndex() + this.d_numVisible() - 1;
+	}
+	isItemActive(index) {
+		return this.firstItemAciveIndex() <= index && this.lastItemActiveIndex() >= index;
+	}
+	bindDocumentListeners() {
+		if (isPlatformBrowser(this.platformId)) {
+			const window = this.document.defaultView || "window";
+			this.documentResizeListener = this.renderer.listen(window, "resize", () => {
+				this.calculatePosition();
+			});
+		}
+	}
+	unbindDocumentListeners() {
+		if (this.documentResizeListener) {
+			this.documentResizeListener();
+			this.documentResizeListener = null;
+		}
+	}
+	onDestroy() {
+		if (this.responsiveOptions()) this.unbindDocumentListeners();
+		if (this.thumbnailsStyle) this.thumbnailsStyle.parentNode?.removeChild(this.thumbnailsStyle);
+	}
+	ariaPrevButtonLabel() {
+		return this.aria?.prevPageLabel;
+	}
+	ariaNextButtonLabel() {
+		return this.aria?.nextPageLabel;
+	}
+	ariaPageLabel(value) {
+		return this.aria?.pageLabel?.replace(/{page}/g, value);
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.0",
+		ngImport: i0,
+		type: GalleriaThumbnails,
+		deps: null,
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.0",
+		type: GalleriaThumbnails,
+		isStandalone: true,
+		selector: "div[pGalleriaThumbnails]",
+		inputs: {
+			containerId: {
+				classPropertyName: "containerId",
+				publicName: "containerId",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			value: {
+				classPropertyName: "value",
+				publicName: "value",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			isVertical: {
+				classPropertyName: "isVertical",
+				publicName: "isVertical",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			slideShowActive: {
+				classPropertyName: "slideShowActive",
+				publicName: "slideShowActive",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			circular: {
+				classPropertyName: "circular",
+				publicName: "circular",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			responsiveOptions: {
+				classPropertyName: "responsiveOptions",
+				publicName: "responsiveOptions",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			contentHeight: {
+				classPropertyName: "contentHeight",
+				publicName: "contentHeight",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			showThumbnailNavigators: {
+				classPropertyName: "showThumbnailNavigators",
+				publicName: "showThumbnailNavigators",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			numVisibleInput: {
+				classPropertyName: "numVisibleInput",
+				publicName: "numVisible",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			activeIndexInput: {
+				classPropertyName: "activeIndexInput",
+				publicName: "activeIndex",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		outputs: {
+			onActiveIndexChange: "onActiveIndexChange",
+			stopSlideShow: "stopSlideShow"
+		},
+		host: { properties: { "class": "cx(\"thumbnails\")" } },
+		providers: [GalleriaStyle],
+		viewQueries: [{
+			propertyName: "itemsContainer",
+			first: true,
+			predicate: ["itemsContainer"],
+			descendants: true,
+			isSignal: true
+		}],
+		usesInheritance: true,
+		hostDirectives: [{ directive: i1.Bind }],
+		ngImport: i0,
+		template: `
         <div [pBind]="ptm('thumbnailContent')" [class]="cx('thumbnailContent')">
             @if (showThumbnailNavigators()) {
                 <button type="button" [pBind]="ptm('thumbnailPrevButton')" [class]="cx('thumbnailPrevButton')" (click)="navBackward($event)" pRipple [attr.aria-label]="ariaPrevButtonLabel()" data-pc-group-section="thumbnailnavigator">
@@ -1071,15 +1301,89 @@ class GalleriaThumbnails extends BaseComponent {
                 </button>
             }
         </div>
-    `, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: BindModule }, { kind: "directive", type: i1.Bind, selector: "[pBind]", inputs: ["pBind"] }, { kind: "directive", type: Ripple, selector: "[pRipple]" }, { kind: "component", type: ChevronLeft, selector: "svg[data-p-icon=\"chevron-left\"]" }, { kind: "component", type: ChevronRight, selector: "svg[data-p-icon=\"chevron-right\"]" }, { kind: "component", type: ChevronUp, selector: "svg[data-p-icon=\"chevron-up\"]" }, { kind: "component", type: ChevronDown, selector: "svg[data-p-icon=\"chevron-down\"]" }, { kind: "component", type: GalleriaItemSlot, selector: "div[pGalleriaItemSlot]", inputs: ["index", "item", "type"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: GalleriaThumbnails, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'div[pGalleriaThumbnails]',
-                    standalone: true,
-                    imports: [NgTemplateOutlet, BindModule, Ripple, ChevronLeft, ChevronRight, ChevronUp, ChevronDown, GalleriaItemSlot],
-                    template: `
+    `,
+		isInline: true,
+		dependencies: [
+			{
+				kind: "directive",
+				type: NgTemplateOutlet,
+				selector: "[ngTemplateOutlet]",
+				inputs: [
+					"ngTemplateOutletContext",
+					"ngTemplateOutlet",
+					"ngTemplateOutletInjector"
+				]
+			},
+			{
+				kind: "ngmodule",
+				type: BindModule
+			},
+			{
+				kind: "directive",
+				type: i1.Bind,
+				selector: "[pBind]",
+				inputs: ["pBind"]
+			},
+			{
+				kind: "directive",
+				type: Ripple,
+				selector: "[pRipple]"
+			},
+			{
+				kind: "component",
+				type: ChevronLeft,
+				selector: "svg[data-p-icon=\"chevron-left\"]"
+			},
+			{
+				kind: "component",
+				type: ChevronRight,
+				selector: "svg[data-p-icon=\"chevron-right\"]"
+			},
+			{
+				kind: "component",
+				type: ChevronUp,
+				selector: "svg[data-p-icon=\"chevron-up\"]"
+			},
+			{
+				kind: "component",
+				type: ChevronDown,
+				selector: "svg[data-p-icon=\"chevron-down\"]"
+			},
+			{
+				kind: "component",
+				type: GalleriaItemSlot,
+				selector: "div[pGalleriaItemSlot]",
+				inputs: [
+					"index",
+					"item",
+					"type"
+				]
+			}
+		],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.0",
+	ngImport: i0,
+	type: GalleriaThumbnails,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "div[pGalleriaThumbnails]",
+			standalone: true,
+			imports: [
+				NgTemplateOutlet,
+				BindModule,
+				Ripple,
+				ChevronLeft,
+				ChevronRight,
+				ChevronUp,
+				ChevronDown,
+				GalleriaItemSlot
+			],
+			template: `
         <div [pBind]="ptm('thumbnailContent')" [class]="cx('thumbnailContent')">
             @if (showThumbnailNavigators()) {
                 <button type="button" [pBind]="ptm('thumbnailPrevButton')" [class]="cx('thumbnailPrevButton')" (click)="navBackward($event)" pRipple [attr.aria-label]="ariaPrevButtonLabel()" data-pc-group-section="thumbnailnavigator">
@@ -1134,120 +1438,267 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImpor
             }
         </div>
     `,
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    providers: [GalleriaStyle],
-                    host: {
-                        '[class]': 'cx("thumbnails")'
-                    },
-                    hostDirectives: [Bind]
-                }]
-        }], propDecorators: { containerId: [{ type: i0.Input, args: [{ isSignal: true, alias: "containerId", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], isVertical: [{ type: i0.Input, args: [{ isSignal: true, alias: "isVertical", required: false }] }], slideShowActive: [{ type: i0.Input, args: [{ isSignal: true, alias: "slideShowActive", required: false }] }], circular: [{ type: i0.Input, args: [{ isSignal: true, alias: "circular", required: false }] }], responsiveOptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "responsiveOptions", required: false }] }], contentHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "contentHeight", required: false }] }], showThumbnailNavigators: [{ type: i0.Input, args: [{ isSignal: true, alias: "showThumbnailNavigators", required: false }] }], numVisibleInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "numVisible", required: false }] }], activeIndexInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "activeIndex", required: false }] }], onActiveIndexChange: [{ type: i0.Output, args: ["onActiveIndexChange"] }], stopSlideShow: [{ type: i0.Output, args: ["stopSlideShow"] }], itemsContainer: [{ type: i0.ViewChild, args: ['itemsContainer', { isSignal: true }] }] } });
-
-class GalleriaContent extends BaseComponent {
-    hostName = 'Galleria';
-    galleria = inject(GALLERIA_INSTANCE);
-    bindDirectiveInstance = inject(Bind, { self: true });
-    onAfterViewChecked() {
-        this.bindDirectiveInstance.setAttrs(this.getPTOptions('root'));
-    }
-    value = input([], /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
-    numVisible = input(3, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "numVisible" }] : /* istanbul ignore next */ []));
-    fullScreen = model(false, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "fullScreen" }] : /* istanbul ignore next */ []));
-    activeIndexInput = input(0, { ...(ngDevMode ? { debugName: "activeIndexInput" } : /* istanbul ignore next */ {}), alias: 'activeIndex' });
-    maskHide = output();
-    activeItemChange = output();
-    closeButton = viewChild('closeButton', /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "closeButton" }] : /* istanbul ignore next */ []));
-    _componentStyle = inject(GalleriaStyle);
-    $pcGalleria = inject(GALLERIA_INSTANCE, { optional: true, skipSelf: true }) ?? undefined;
-    _generatedId = uuid('pn_id_');
-    id = computed(() => this.galleria.id() || this._generatedId, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "id" }] : /* istanbul ignore next */ []));
-    _activeIndex = linkedSignal(() => this.activeIndexInput(), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "_activeIndex" }] : /* istanbul ignore next */ []));
-    slideShowActive = true;
-    interval;
-    hostStyle = computed(() => (!this.galleria.fullScreen() ? this.galleria.containerStyle() : {}), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "hostStyle" }] : /* istanbul ignore next */ []));
-    contentAriaLive = computed(() => (this.galleria.autoPlay() ? 'polite' : 'off'), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "contentAriaLive" }] : /* istanbul ignore next */ []));
-    isVertical = computed(() => this.galleria.thumbnailsPosition() === 'left' || this.galleria.thumbnailsPosition() === 'right', /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "isVertical" }] : /* istanbul ignore next */ []));
-    hasValue = computed(() => {
-        const val = this.value();
-        return val && val.length > 0;
-    }, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "hasValue" }] : /* istanbul ignore next */ []));
-    // For custom fullscreen
-    handleFullscreenChange() {
-        if (document?.fullscreenElement === this.el.nativeElement?.children[0]) {
-            this.fullScreen.set(true);
-        }
-        else {
-            this.fullScreen.set(false);
-        }
-    }
-    shouldRenderHeader() {
-        return !!this.galleria.headerTemplate();
-    }
-    shouldRenderFooter() {
-        return !!this.galleria.footerTemplate();
-    }
-    startSlideShow() {
-        if (isPlatformBrowser(this.galleria.platformId)) {
-            if (this.interval) {
-                clearInterval(this.interval);
-            }
-            this.interval = setInterval(() => {
-                let activeIndex = this.galleria.circular() && this.value().length - 1 === this._activeIndex() ? 0 : this._activeIndex() + 1;
-                this.onActiveIndexChange(activeIndex);
-                this._activeIndex.set(activeIndex);
-            }, this.galleria.transitionInterval());
-            this.slideShowActive = true;
-        }
-    }
-    stopSlideShow() {
-        if (this.galleria.autoPlay() && !this.galleria.shouldStopAutoplayByClick()) {
-            return;
-        }
-        if (this.interval) {
-            clearInterval(this.interval);
-        }
-        this.slideShowActive = false;
-    }
-    getPositionClass(preClassName, position) {
-        const positions = ['top', 'left', 'bottom', 'right'];
-        const pos = positions.find((item) => item === position);
-        return pos ? `${preClassName}-${pos}` : '';
-    }
-    onActiveIndexChange(index) {
-        if (this._activeIndex() !== index) {
-            this._activeIndex.set(index);
-            this.activeItemChange.emit(this._activeIndex());
-        }
-    }
-    closeAriaLabel() {
-        return this.config.translation.aria ? this.config.translation.aria.close : undefined;
-    }
-    onDestroy() {
-        if (this.interval) {
-            clearInterval(this.interval);
-            this.interval = null;
-        }
-    }
-    getPTOptions(key) {
-        return this.ptm(key, {
-            context: {
-                pt: this.pt(),
-                unstyled: this.unstyled()
-            }
-        });
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: GalleriaContent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.2", type: GalleriaContent, isStandalone: true, selector: "div[pGalleriaContent]", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, numVisible: { classPropertyName: "numVisible", publicName: "numVisible", isSignal: true, isRequired: false, transformFunction: null }, fullScreen: { classPropertyName: "fullScreen", publicName: "fullScreen", isSignal: true, isRequired: false, transformFunction: null }, activeIndexInput: { classPropertyName: "activeIndexInput", publicName: "activeIndex", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { fullScreen: "fullScreenChange", maskHide: "maskHide", activeItemChange: "activeItemChange" }, host: { listeners: { "document:fullscreenchange": "handleFullscreenChange()" }, properties: { "attr.id": "id()", "attr.role": "\"region\"", "style": "hostStyle()", "class": "cx('root')" } }, providers: [GalleriaStyle], viewQueries: [{ propertyName: "closeButton", first: true, predicate: ["closeButton"], descendants: true, isSignal: true }], usesInheritance: true, hostDirectives: [{ directive: i1.Bind }], ngImport: i0, template: `
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			providers: [GalleriaStyle],
+			host: { "[class]": "cx(\"thumbnails\")" },
+			hostDirectives: [Bind]
+		}]
+	}],
+	propDecorators: {
+		containerId: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "containerId",
+				required: false
+			}]
+		}],
+		value: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "value",
+				required: false
+			}]
+		}],
+		isVertical: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "isVertical",
+				required: false
+			}]
+		}],
+		slideShowActive: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "slideShowActive",
+				required: false
+			}]
+		}],
+		circular: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "circular",
+				required: false
+			}]
+		}],
+		responsiveOptions: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "responsiveOptions",
+				required: false
+			}]
+		}],
+		contentHeight: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "contentHeight",
+				required: false
+			}]
+		}],
+		showThumbnailNavigators: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "showThumbnailNavigators",
+				required: false
+			}]
+		}],
+		numVisibleInput: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "numVisible",
+				required: false
+			}]
+		}],
+		activeIndexInput: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "activeIndex",
+				required: false
+			}]
+		}],
+		onActiveIndexChange: [{
+			type: i0.Output,
+			args: ["onActiveIndexChange"]
+		}],
+		stopSlideShow: [{
+			type: i0.Output,
+			args: ["stopSlideShow"]
+		}],
+		itemsContainer: [{
+			type: i0.ViewChild,
+			args: ["itemsContainer", { isSignal: true }]
+		}]
+	}
+});
+var GalleriaContent = class GalleriaContent extends BaseComponent {
+	hostName = "Galleria";
+	galleria = inject(GALLERIA_INSTANCE);
+	bindDirectiveInstance = inject(Bind, { self: true });
+	value = input([], ...ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []);
+	numVisible = input(3, ...ngDevMode ? [{ debugName: "numVisible" }] : /* istanbul ignore next */ []);
+	fullScreen = model(false, ...ngDevMode ? [{ debugName: "fullScreen" }] : /* istanbul ignore next */ []);
+	activeIndexInput = input(0, {
+		...ngDevMode ? { debugName: "activeIndexInput" } : /* istanbul ignore next */ {},
+		alias: "activeIndex"
+	});
+	maskHide = output();
+	activeItemChange = output();
+	closeButton = viewChild("closeButton", ...ngDevMode ? [{ debugName: "closeButton" }] : /* istanbul ignore next */ []);
+	_componentStyle = inject(GalleriaStyle);
+	$pcGalleria = inject(GALLERIA_INSTANCE, {
+		optional: true,
+		skipSelf: true
+	}) ?? void 0;
+	_generatedId = uuid("pn_id_");
+	id = computed(() => this.galleria.id() || this._generatedId, ...ngDevMode ? [{ debugName: "id" }] : /* istanbul ignore next */ []);
+	_activeIndex = linkedSignal(() => this.activeIndexInput(), ...ngDevMode ? [{ debugName: "_activeIndex" }] : /* istanbul ignore next */ []);
+	slideShowActive = true;
+	interval;
+	hostStyle = computed(() => !this.galleria.fullScreen() ? this.galleria.containerStyle() : {}, ...ngDevMode ? [{ debugName: "hostStyle" }] : /* istanbul ignore next */ []);
+	contentAriaLive = computed(() => this.galleria.autoPlay() ? "polite" : "off", ...ngDevMode ? [{ debugName: "contentAriaLive" }] : /* istanbul ignore next */ []);
+	isVertical = computed(() => this.galleria.thumbnailsPosition() === "left" || this.galleria.thumbnailsPosition() === "right", ...ngDevMode ? [{ debugName: "isVertical" }] : /* istanbul ignore next */ []);
+	hasValue = computed(() => {
+		const val = this.value();
+		return val && val.length > 0;
+	}, ...ngDevMode ? [{ debugName: "hasValue" }] : /* istanbul ignore next */ []);
+	onAfterViewChecked() {
+		this.bindDirectiveInstance.setAttrs(this.getPTOptions("root"));
+	}
+	handleFullscreenChange() {
+		if (document?.fullscreenElement === this.el.nativeElement?.children[0]) this.fullScreen.set(true);
+		else this.fullScreen.set(false);
+	}
+	shouldRenderHeader() {
+		return !!this.galleria.headerTemplate();
+	}
+	shouldRenderFooter() {
+		return !!this.galleria.footerTemplate();
+	}
+	startSlideShow() {
+		if (isPlatformBrowser(this.galleria.platformId)) {
+			if (this.interval) clearInterval(this.interval);
+			this.interval = setInterval(() => {
+				let activeIndex = this.galleria.circular() && this.value().length - 1 === this._activeIndex() ? 0 : this._activeIndex() + 1;
+				this.onActiveIndexChange(activeIndex);
+				this._activeIndex.set(activeIndex);
+			}, this.galleria.transitionInterval());
+			this.slideShowActive = true;
+		}
+	}
+	stopSlideShow() {
+		if (this.galleria.autoPlay() && !this.galleria.shouldStopAutoplayByClick()) return;
+		if (this.interval) clearInterval(this.interval);
+		this.slideShowActive = false;
+	}
+	getPositionClass(preClassName, position) {
+		const pos = [
+			"top",
+			"left",
+			"bottom",
+			"right"
+		].find((item) => item === position);
+		return pos ? `${preClassName}-${pos}` : "";
+	}
+	onActiveIndexChange(index) {
+		if (this._activeIndex() !== index) {
+			this._activeIndex.set(index);
+			this.activeItemChange.emit(this._activeIndex());
+		}
+	}
+	closeAriaLabel() {
+		return this.config.translation.aria ? this.config.translation.aria.close : void 0;
+	}
+	onDestroy() {
+		if (this.interval) {
+			clearInterval(this.interval);
+			this.interval = null;
+		}
+	}
+	getPTOptions(key) {
+		return this.ptm(key, { context: {
+			pt: this.pt(),
+			unstyled: this.unstyled()
+		} });
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.0",
+		ngImport: i0,
+		type: GalleriaContent,
+		deps: null,
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.0",
+		type: GalleriaContent,
+		isStandalone: true,
+		selector: "div[pGalleriaContent]",
+		inputs: {
+			value: {
+				classPropertyName: "value",
+				publicName: "value",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			numVisible: {
+				classPropertyName: "numVisible",
+				publicName: "numVisible",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			fullScreen: {
+				classPropertyName: "fullScreen",
+				publicName: "fullScreen",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			activeIndexInput: {
+				classPropertyName: "activeIndexInput",
+				publicName: "activeIndex",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		outputs: {
+			fullScreen: "fullScreenChange",
+			maskHide: "maskHide",
+			activeItemChange: "activeItemChange"
+		},
+		host: {
+			listeners: { "document:fullscreenchange": "handleFullscreenChange()" },
+			properties: {
+				"attr.id": "id()",
+				"attr.role": "\"region\"",
+				"style": "hostStyle()",
+				"class": "cx('root')"
+			}
+		},
+		providers: [GalleriaStyle],
+		viewQueries: [{
+			propertyName: "closeButton",
+			first: true,
+			predicate: ["closeButton"],
+			descendants: true,
+			isSignal: true
+		}],
+		usesInheritance: true,
+		hostDirectives: [{ directive: i1.Bind }],
+		ngImport: i0,
+		template: `
         @if (hasValue()) {
             @if (galleria.fullScreen()) {
                 <button type="button" [pBind]="getPTOptions('closeButton')" [class]="cx('closeButton')" (click)="maskHide.emit(true)" [attr.aria-label]="closeAriaLabel()">
@@ -1304,15 +1755,106 @@ class GalleriaContent extends BaseComponent {
                 <div pGalleriaItemSlot [pBind]="getPTOptions('footer')" [class]="cx('footer')" type="footer" [unstyled]="unstyled()"></div>
             }
         }
-    `, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: BindModule }, { kind: "directive", type: i1.Bind, selector: "[pBind]", inputs: ["pBind"] }, { kind: "component", type: Times, selector: "svg[data-p-icon=\"times\"]" }, { kind: "component", type: GalleriaItemSlot, selector: "div[pGalleriaItemSlot]", inputs: ["index", "item", "type"] }, { kind: "component", type: GalleriaItem, selector: "div[pGalleriaItem]", inputs: ["id", "circular", "value", "showItemNavigators", "showIndicators", "slideShowActive", "changeItemOnIndicatorHover", "autoPlay", "activeIndex"], outputs: ["startSlideShow", "stopSlideShow", "onActiveIndexChange"] }, { kind: "component", type: GalleriaThumbnails, selector: "div[pGalleriaThumbnails]", inputs: ["containerId", "value", "isVertical", "slideShowActive", "circular", "responsiveOptions", "contentHeight", "showThumbnailNavigators", "numVisible", "activeIndex"], outputs: ["onActiveIndexChange", "stopSlideShow"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: GalleriaContent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'div[pGalleriaContent]',
-                    standalone: true,
-                    imports: [NgTemplateOutlet, BindModule, Times, GalleriaItemSlot, GalleriaItem, GalleriaThumbnails],
-                    template: `
+    `,
+		isInline: true,
+		dependencies: [
+			{
+				kind: "directive",
+				type: NgTemplateOutlet,
+				selector: "[ngTemplateOutlet]",
+				inputs: [
+					"ngTemplateOutletContext",
+					"ngTemplateOutlet",
+					"ngTemplateOutletInjector"
+				]
+			},
+			{
+				kind: "ngmodule",
+				type: BindModule
+			},
+			{
+				kind: "directive",
+				type: i1.Bind,
+				selector: "[pBind]",
+				inputs: ["pBind"]
+			},
+			{
+				kind: "component",
+				type: Times,
+				selector: "svg[data-p-icon=\"times\"]"
+			},
+			{
+				kind: "component",
+				type: GalleriaItemSlot,
+				selector: "div[pGalleriaItemSlot]",
+				inputs: [
+					"index",
+					"item",
+					"type"
+				]
+			},
+			{
+				kind: "component",
+				type: GalleriaItem,
+				selector: "div[pGalleriaItem]",
+				inputs: [
+					"id",
+					"circular",
+					"value",
+					"showItemNavigators",
+					"showIndicators",
+					"slideShowActive",
+					"changeItemOnIndicatorHover",
+					"autoPlay",
+					"activeIndex"
+				],
+				outputs: [
+					"startSlideShow",
+					"stopSlideShow",
+					"onActiveIndexChange"
+				]
+			},
+			{
+				kind: "component",
+				type: GalleriaThumbnails,
+				selector: "div[pGalleriaThumbnails]",
+				inputs: [
+					"containerId",
+					"value",
+					"isVertical",
+					"slideShowActive",
+					"circular",
+					"responsiveOptions",
+					"contentHeight",
+					"showThumbnailNavigators",
+					"numVisible",
+					"activeIndex"
+				],
+				outputs: ["onActiveIndexChange", "stopSlideShow"]
+			}
+		],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.0",
+	ngImport: i0,
+	type: GalleriaContent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "div[pGalleriaContent]",
+			standalone: true,
+			imports: [
+				NgTemplateOutlet,
+				BindModule,
+				Times,
+				GalleriaItemSlot,
+				GalleriaItem,
+				GalleriaThumbnails
+			],
+			template: `
         @if (hasValue()) {
             @if (galleria.fullScreen()) {
                 <button type="button" [pBind]="getPTOptions('closeButton')" [class]="cx('closeButton')" (click)="maskHide.emit(true)" [attr.aria-label]="closeAriaLabel()">
@@ -1370,363 +1912,574 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImpor
             }
         }
     `,
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    providers: [GalleriaStyle],
-                    host: {
-                        '[attr.id]': 'id()',
-                        '[attr.role]': '"region"',
-                        '[style]': 'hostStyle()',
-                        '[class]': "cx('root')"
-                    },
-                    hostDirectives: [Bind]
-                }]
-        }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], numVisible: [{ type: i0.Input, args: [{ isSignal: true, alias: "numVisible", required: false }] }], fullScreen: [{ type: i0.Input, args: [{ isSignal: true, alias: "fullScreen", required: false }] }, { type: i0.Output, args: ["fullScreenChange"] }], activeIndexInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "activeIndex", required: false }] }], maskHide: [{ type: i0.Output, args: ["maskHide"] }], activeItemChange: [{ type: i0.Output, args: ["activeItemChange"] }], closeButton: [{ type: i0.ViewChild, args: ['closeButton', { isSignal: true }] }], handleFullscreenChange: [{
-                type: HostListener,
-                args: ['document:fullscreenchange']
-            }] } });
-
-/**
- * Galleria is an advanced content gallery component.
- * @group Components
- * @deprecated Use Gallery component instead.
- */
-class Galleria extends BaseComponent {
-    componentName = 'Galleria';
-    bindDirectiveInstance = inject(Bind, { self: true });
-    $pcGalleria = inject(GALLERIA_INSTANCE, { optional: true, skipSelf: true }) ?? undefined;
-    onAfterViewChecked() {
-        this.bindDirectiveInstance.setAttrs(this.ptm('host'));
-    }
-    /**
-     * Index of the first item.
-     * @group Props
-     */
-    activeIndex = input(0, { ...(ngDevMode ? { debugName: "activeIndex" } : /* istanbul ignore next */ {}), transform: numberAttribute });
-    /**
-     * Whether to display the component on fullscreen.
-     * @group Props
-     */
-    fullScreen = input(false, { ...(ngDevMode ? { debugName: "fullScreen" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
-    /**
-     * Unique identifier of the element.
-     * @group Props
-     */
-    id = input(/* @ts-ignore */
-    ...(ngDevMode ? [undefined, { debugName: "id" }] : /* istanbul ignore next */ []));
-    /**
-     * An array of objects to display.
-     * @group Props
-     */
-    value = input(/* @ts-ignore */
-    ...(ngDevMode ? [undefined, { debugName: "value" }] : /* istanbul ignore next */ []));
-    /**
-     * Number of items per page.
-     * @group Props
-     */
-    numVisible = input(3, { ...(ngDevMode ? { debugName: "numVisible" } : /* istanbul ignore next */ {}), transform: numberAttribute });
-    /**
-     * An array of options for responsive design.
-     * @see {GalleriaResponsiveOptions}
-     * @group Props
-     */
-    responsiveOptions = input(/* @ts-ignore */
-    ...(ngDevMode ? [undefined, { debugName: "responsiveOptions" }] : /* istanbul ignore next */ []));
-    /**
-     * Whether to display navigation buttons in item section.
-     * @group Props
-     */
-    showItemNavigators = input(false, { ...(ngDevMode ? { debugName: "showItemNavigators" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
-    /**
-     * Whether to display navigation buttons in thumbnail container.
-     * @group Props
-     */
-    showThumbnailNavigators = input(true, { ...(ngDevMode ? { debugName: "showThumbnailNavigators" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
-    /**
-     * Whether to display navigation buttons on item hover.
-     * @group Props
-     */
-    showItemNavigatorsOnHover = input(false, { ...(ngDevMode ? { debugName: "showItemNavigatorsOnHover" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
-    /**
-     * When enabled, item is changed on indicator hover.
-     * @group Props
-     */
-    changeItemOnIndicatorHover = input(false, { ...(ngDevMode ? { debugName: "changeItemOnIndicatorHover" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
-    /**
-     * Defines if scrolling would be infinite.
-     * @group Props
-     */
-    circular = input(false, { ...(ngDevMode ? { debugName: "circular" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
-    /**
-     * Items are displayed with a slideshow in autoPlay mode.
-     * @group Props
-     */
-    autoPlay = input(false, { ...(ngDevMode ? { debugName: "autoPlay" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
-    /**
-     * When enabled, autorun should stop by click.
-     * @group Props
-     */
-    shouldStopAutoplayByClick = input(true, { ...(ngDevMode ? { debugName: "shouldStopAutoplayByClick" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
-    /**
-     * Time in milliseconds to scroll items.
-     * @group Props
-     */
-    transitionInterval = input(4000, { ...(ngDevMode ? { debugName: "transitionInterval" } : /* istanbul ignore next */ {}), transform: numberAttribute });
-    /**
-     * Whether to display thumbnail container.
-     * @group Props
-     */
-    showThumbnails = input(true, { ...(ngDevMode ? { debugName: "showThumbnails" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
-    /**
-     * Position of thumbnails.
-     * @group Props
-     */
-    thumbnailsPosition = input('bottom', /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "thumbnailsPosition" }] : /* istanbul ignore next */ []));
-    /**
-     * Height of the viewport in vertical thumbnail.
-     * @group Props
-     */
-    verticalThumbnailViewPortHeight = input('300px', /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "verticalThumbnailViewPortHeight" }] : /* istanbul ignore next */ []));
-    /**
-     * Whether to display indicator container.
-     * @group Props
-     */
-    showIndicators = input(false, { ...(ngDevMode ? { debugName: "showIndicators" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
-    /**
-     * When enabled, indicator container is displayed on item container.
-     * @group Props
-     */
-    showIndicatorsOnItem = input(false, { ...(ngDevMode ? { debugName: "showIndicatorsOnItem" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
-    /**
-     * Position of indicators.
-     * @group Props
-     */
-    indicatorsPosition = input('bottom', /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "indicatorsPosition" }] : /* istanbul ignore next */ []));
-    /**
-     * Base zIndex value to use in layering.
-     * @group Props
-     */
-    baseZIndex = input(0, { ...(ngDevMode ? { debugName: "baseZIndex" } : /* istanbul ignore next */ {}), transform: numberAttribute });
-    /**
-     * Style class of the mask on fullscreen mode.
-     * @group Props
-     */
-    maskClass = input(/* @ts-ignore */
-    ...(ngDevMode ? [undefined, { debugName: "maskClass" }] : /* istanbul ignore next */ []));
-    /**
-     * Style class of the component on fullscreen mode. Otherwise, the 'class' property can be used.
-     * @group Props
-     */
-    containerClass = input(/* @ts-ignore */
-    ...(ngDevMode ? [undefined, { debugName: "containerClass" }] : /* istanbul ignore next */ []));
-    /**
-     * Inline style of the component on fullscreen mode. Otherwise, the 'style' property can be used.
-     * @group Props
-     */
-    containerStyle = input(/* @ts-ignore */
-    ...(ngDevMode ? [undefined, { debugName: "containerStyle" }] : /* istanbul ignore next */ []));
-    /**
-     * The motion options.
-     * @group Props
-     */
-    motionOptions = input(/* @ts-ignore */
-    ...(ngDevMode ? [undefined, { debugName: "motionOptions" }] : /* istanbul ignore next */ []));
-    computedMotionOptions = computed(() => {
-        return {
-            ...this.ptm('motion'),
-            ...this.motionOptions()
-        };
-    }, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "computedMotionOptions" }] : /* istanbul ignore next */ []));
-    /**
-     * The mask motion options.
-     * @group Props
-     */
-    maskMotionOptions = input(/* @ts-ignore */
-    ...(ngDevMode ? [undefined, { debugName: "maskMotionOptions" }] : /* istanbul ignore next */ []));
-    computedMaskMotionOptions = computed(() => {
-        return {
-            ...this.ptm('maskMotion'),
-            ...this.maskMotionOptions()
-        };
-    }, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "computedMaskMotionOptions" }] : /* istanbul ignore next */ []));
-    maskEnterActiveClass = computed(() => (this.fullScreen() ? 'p-overlay-mask-enter-active' : ''), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "maskEnterActiveClass" }] : /* istanbul ignore next */ []));
-    maskLeaveActiveClass = computed(() => (this.fullScreen() ? 'p-overlay-mask-leave-active' : ''), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "maskLeaveActiveClass" }] : /* istanbul ignore next */ []));
-    maskRole = computed(() => (this.fullScreen() ? 'dialog' : 'region'), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "maskRole" }] : /* istanbul ignore next */ []));
-    maskAriaModal = computed(() => (this.fullScreen() ? 'true' : undefined), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "maskAriaModal" }] : /* istanbul ignore next */ []));
-    /**
-     * Specifies the visibility of the mask on fullscreen mode.
-     * @group Props
-     */
-    visible = model(false, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "visible" }] : /* istanbul ignore next */ []));
-    renderMask = signal(false, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "renderMask" }] : /* istanbul ignore next */ []));
-    renderContent = signal(false, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "renderContent" }] : /* istanbul ignore next */ []));
-    /**
-     * Callback to invoke on active index change.
-     * @param {number} number - Active index.
-     * @group Emits
-     */
-    activeIndexChange = output();
-    container = viewChild('container', /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "container" }] : /* istanbul ignore next */ []));
-    _activeIndex = linkedSignal(() => this.activeIndex(), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "_activeIndex" }] : /* istanbul ignore next */ []));
-    /**
-     * Custom header template.
-     * @group Templates
-     */
-    headerTemplate = contentChild('header', { ...(ngDevMode ? { debugName: "headerTemplate" } : /* istanbul ignore next */ {}), descendants: false });
-    /**
-     * Custom footer template.
-     * @group Templates
-     */
-    footerTemplate = contentChild('footer', { ...(ngDevMode ? { debugName: "footerTemplate" } : /* istanbul ignore next */ {}), descendants: false });
-    /**
-     * Custom indicator template.
-     * @group Templates
-     */
-    indicatorTemplate = contentChild('indicator', { ...(ngDevMode ? { debugName: "indicatorTemplate" } : /* istanbul ignore next */ {}), descendants: false });
-    /**
-     * Custom caption template.
-     * @group Templates
-     */
-    captionTemplate = contentChild('caption', { ...(ngDevMode ? { debugName: "captionTemplate" } : /* istanbul ignore next */ {}), descendants: false });
-    /**
-     * Custom close icon template.
-     * @group Templates
-     */
-    closeIconTemplate = contentChild('closeicon', { ...(ngDevMode ? { debugName: "closeIconTemplate" } : /* istanbul ignore next */ {}), descendants: false });
-    /**
-     * Custom previous thumbnail icon template.
-     * @group Templates
-     */
-    previousThumbnailIconTemplate = contentChild('previousthumbnailicon', { ...(ngDevMode ? { debugName: "previousThumbnailIconTemplate" } : /* istanbul ignore next */ {}), descendants: false });
-    /**
-     * Custom next thumbnail icon template.
-     * @group Templates
-     */
-    nextThumbnailIconTemplate = contentChild('nextthumbnailicon', { ...(ngDevMode ? { debugName: "nextThumbnailIconTemplate" } : /* istanbul ignore next */ {}), descendants: false });
-    /**
-     * Custom item previous icon template.
-     * @group Templates
-     */
-    itemPreviousIconTemplate = contentChild('itempreviousicon', { ...(ngDevMode ? { debugName: "itemPreviousIconTemplate" } : /* istanbul ignore next */ {}), descendants: false });
-    /**
-     * Custom item next icon template.
-     * @group Templates
-     */
-    itemNextIconTemplate = contentChild('itemnexticon', { ...(ngDevMode ? { debugName: "itemNextIconTemplate" } : /* istanbul ignore next */ {}), descendants: false });
-    /**
-     * Custom item template.
-     * @group Templates
-     */
-    itemTemplate = contentChild('item', { ...(ngDevMode ? { debugName: "itemTemplate" } : /* istanbul ignore next */ {}), descendants: false });
-    /**
-     * Custom thumbnail template.
-     * @group Templates
-     */
-    thumbnailTemplate = contentChild('thumbnail', { ...(ngDevMode ? { debugName: "thumbnailTemplate" } : /* istanbul ignore next */ {}), descendants: false });
-    maskVisible = false;
-    numVisibleLimit = signal(0, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "numVisibleLimit" }] : /* istanbul ignore next */ []));
-    d_numVisible = computed(() => this.numVisibleLimit() || this.numVisible(), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "d_numVisible" }] : /* istanbul ignore next */ []));
-    _componentStyle = inject(GalleriaStyle);
-    mask;
-    element = inject(ElementRef);
-    constructor() {
-        super();
-        // Effect for visible changes
-        effect(() => {
-            const isVisible = this.visible();
-            if (isVisible && !this.maskVisible) {
-                this.maskVisible = true;
-                this.renderMask.set(true);
-                this.renderContent.set(true);
-            }
-            else if (!isVisible && this.maskVisible) {
-                this.maskVisible = false;
-            }
-        });
-        // Effect for value changes
-        effect(() => {
-            const val = this.value();
-            if (val && val.length < this.numVisible()) {
-                this.numVisibleLimit.set(val.length);
-            }
-            else {
-                this.numVisibleLimit.set(0);
-            }
-        });
-    }
-    onMaskHide(event) {
-        if (!event || event.target === event.currentTarget) {
-            this.visible.set(false);
-        }
-    }
-    onActiveItemChange(index) {
-        if (this._activeIndex() !== index) {
-            this._activeIndex.set(index);
-            this.activeIndexChange.emit(index);
-        }
-    }
-    onBeforeEnter(event) {
-        this.mask = event.element?.parentElement;
-        this.enableModality();
-        setTimeout(() => {
-            const focusTarget = findSingle(this.container()?.nativeElement, '[data-pc-section="closebutton"]');
-            if (focusTarget)
-                focus(focusTarget);
-        }, 25);
-    }
-    onBeforeLeave() {
-        if (this.mask) {
-            this.maskVisible = false;
-        }
-    }
-    onAfterLeave() {
-        this.disableModality();
-        this.renderContent.set(false);
-    }
-    onMaskAfterLeave() {
-        if (!this.renderContent()) {
-            this.renderMask.set(false);
-        }
-    }
-    enableModality() {
-        //@ts-ignore
-        blockBodyScroll();
-        if (this.mask) {
-            ZIndexUtils.set('modal', this.mask, this.baseZIndex() || this.config.zIndex.modal);
-        }
-    }
-    disableModality() {
-        //@ts-ignore
-        unblockBodyScroll();
-        if (this.mask) {
-            ZIndexUtils.clear(this.mask);
-        }
-    }
-    onDestroy() {
-        if (this.fullScreen()) {
-            removeClass(this.document.body, 'p-overflow-hidden');
-        }
-        if (this.mask) {
-            this.disableModality();
-        }
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: Galleria, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.2", type: Galleria, isStandalone: true, selector: "p-galleria", inputs: { activeIndex: { classPropertyName: "activeIndex", publicName: "activeIndex", isSignal: true, isRequired: false, transformFunction: null }, fullScreen: { classPropertyName: "fullScreen", publicName: "fullScreen", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, numVisible: { classPropertyName: "numVisible", publicName: "numVisible", isSignal: true, isRequired: false, transformFunction: null }, responsiveOptions: { classPropertyName: "responsiveOptions", publicName: "responsiveOptions", isSignal: true, isRequired: false, transformFunction: null }, showItemNavigators: { classPropertyName: "showItemNavigators", publicName: "showItemNavigators", isSignal: true, isRequired: false, transformFunction: null }, showThumbnailNavigators: { classPropertyName: "showThumbnailNavigators", publicName: "showThumbnailNavigators", isSignal: true, isRequired: false, transformFunction: null }, showItemNavigatorsOnHover: { classPropertyName: "showItemNavigatorsOnHover", publicName: "showItemNavigatorsOnHover", isSignal: true, isRequired: false, transformFunction: null }, changeItemOnIndicatorHover: { classPropertyName: "changeItemOnIndicatorHover", publicName: "changeItemOnIndicatorHover", isSignal: true, isRequired: false, transformFunction: null }, circular: { classPropertyName: "circular", publicName: "circular", isSignal: true, isRequired: false, transformFunction: null }, autoPlay: { classPropertyName: "autoPlay", publicName: "autoPlay", isSignal: true, isRequired: false, transformFunction: null }, shouldStopAutoplayByClick: { classPropertyName: "shouldStopAutoplayByClick", publicName: "shouldStopAutoplayByClick", isSignal: true, isRequired: false, transformFunction: null }, transitionInterval: { classPropertyName: "transitionInterval", publicName: "transitionInterval", isSignal: true, isRequired: false, transformFunction: null }, showThumbnails: { classPropertyName: "showThumbnails", publicName: "showThumbnails", isSignal: true, isRequired: false, transformFunction: null }, thumbnailsPosition: { classPropertyName: "thumbnailsPosition", publicName: "thumbnailsPosition", isSignal: true, isRequired: false, transformFunction: null }, verticalThumbnailViewPortHeight: { classPropertyName: "verticalThumbnailViewPortHeight", publicName: "verticalThumbnailViewPortHeight", isSignal: true, isRequired: false, transformFunction: null }, showIndicators: { classPropertyName: "showIndicators", publicName: "showIndicators", isSignal: true, isRequired: false, transformFunction: null }, showIndicatorsOnItem: { classPropertyName: "showIndicatorsOnItem", publicName: "showIndicatorsOnItem", isSignal: true, isRequired: false, transformFunction: null }, indicatorsPosition: { classPropertyName: "indicatorsPosition", publicName: "indicatorsPosition", isSignal: true, isRequired: false, transformFunction: null }, baseZIndex: { classPropertyName: "baseZIndex", publicName: "baseZIndex", isSignal: true, isRequired: false, transformFunction: null }, maskClass: { classPropertyName: "maskClass", publicName: "maskClass", isSignal: true, isRequired: false, transformFunction: null }, containerClass: { classPropertyName: "containerClass", publicName: "containerClass", isSignal: true, isRequired: false, transformFunction: null }, containerStyle: { classPropertyName: "containerStyle", publicName: "containerStyle", isSignal: true, isRequired: false, transformFunction: null }, motionOptions: { classPropertyName: "motionOptions", publicName: "motionOptions", isSignal: true, isRequired: false, transformFunction: null }, maskMotionOptions: { classPropertyName: "maskMotionOptions", publicName: "maskMotionOptions", isSignal: true, isRequired: false, transformFunction: null }, visible: { classPropertyName: "visible", publicName: "visible", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { visible: "visibleChange", activeIndexChange: "activeIndexChange" }, providers: [GalleriaStyle, { provide: GALLERIA_INSTANCE, useExisting: Galleria }, { provide: PARENT_INSTANCE, useExisting: Galleria }], queries: [{ propertyName: "headerTemplate", first: true, predicate: ["header"], isSignal: true }, { propertyName: "footerTemplate", first: true, predicate: ["footer"], isSignal: true }, { propertyName: "indicatorTemplate", first: true, predicate: ["indicator"], isSignal: true }, { propertyName: "captionTemplate", first: true, predicate: ["caption"], isSignal: true }, { propertyName: "closeIconTemplate", first: true, predicate: ["closeicon"], isSignal: true }, { propertyName: "previousThumbnailIconTemplate", first: true, predicate: ["previousthumbnailicon"], isSignal: true }, { propertyName: "nextThumbnailIconTemplate", first: true, predicate: ["nextthumbnailicon"], isSignal: true }, { propertyName: "itemPreviousIconTemplate", first: true, predicate: ["itempreviousicon"], isSignal: true }, { propertyName: "itemNextIconTemplate", first: true, predicate: ["itemnexticon"], isSignal: true }, { propertyName: "itemTemplate", first: true, predicate: ["item"], isSignal: true }, { propertyName: "thumbnailTemplate", first: true, predicate: ["thumbnail"], isSignal: true }], viewQueries: [{ propertyName: "container", first: true, predicate: ["container"], descendants: true, isSignal: true }], usesInheritance: true, hostDirectives: [{ directive: i1.Bind }], ngImport: i0, template: `
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			providers: [GalleriaStyle],
+			host: {
+				"[attr.id]": "id()",
+				"[attr.role]": "\"region\"",
+				"[style]": "hostStyle()",
+				"[class]": "cx('root')"
+			},
+			hostDirectives: [Bind]
+		}]
+	}],
+	propDecorators: {
+		value: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "value",
+				required: false
+			}]
+		}],
+		numVisible: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "numVisible",
+				required: false
+			}]
+		}],
+		fullScreen: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "fullScreen",
+				required: false
+			}]
+		}, {
+			type: i0.Output,
+			args: ["fullScreenChange"]
+		}],
+		activeIndexInput: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "activeIndex",
+				required: false
+			}]
+		}],
+		maskHide: [{
+			type: i0.Output,
+			args: ["maskHide"]
+		}],
+		activeItemChange: [{
+			type: i0.Output,
+			args: ["activeItemChange"]
+		}],
+		closeButton: [{
+			type: i0.ViewChild,
+			args: ["closeButton", { isSignal: true }]
+		}],
+		handleFullscreenChange: [{
+			type: HostListener,
+			args: ["document:fullscreenchange"]
+		}]
+	}
+});
+var Galleria = class Galleria extends BaseComponent {
+	componentName = "Galleria";
+	bindDirectiveInstance = inject(Bind, { self: true });
+	$pcGalleria = inject(GALLERIA_INSTANCE, {
+		optional: true,
+		skipSelf: true
+	}) ?? void 0;
+	activeIndex = input(0, {
+		...ngDevMode ? { debugName: "activeIndex" } : /* istanbul ignore next */ {},
+		transform: numberAttribute
+	});
+	fullScreen = input(false, {
+		...ngDevMode ? { debugName: "fullScreen" } : /* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	id = input(...ngDevMode ? [void 0, { debugName: "id" }] : /* istanbul ignore next */ []);
+	value = input(...ngDevMode ? [void 0, { debugName: "value" }] : /* istanbul ignore next */ []);
+	numVisible = input(3, {
+		...ngDevMode ? { debugName: "numVisible" } : /* istanbul ignore next */ {},
+		transform: numberAttribute
+	});
+	responsiveOptions = input(...ngDevMode ? [void 0, { debugName: "responsiveOptions" }] : /* istanbul ignore next */ []);
+	showItemNavigators = input(false, {
+		...ngDevMode ? { debugName: "showItemNavigators" } : /* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	showThumbnailNavigators = input(true, {
+		...ngDevMode ? { debugName: "showThumbnailNavigators" } : /* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	showItemNavigatorsOnHover = input(false, {
+		...ngDevMode ? { debugName: "showItemNavigatorsOnHover" } : /* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	changeItemOnIndicatorHover = input(false, {
+		...ngDevMode ? { debugName: "changeItemOnIndicatorHover" } : /* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	circular = input(false, {
+		...ngDevMode ? { debugName: "circular" } : /* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	autoPlay = input(false, {
+		...ngDevMode ? { debugName: "autoPlay" } : /* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	shouldStopAutoplayByClick = input(true, {
+		...ngDevMode ? { debugName: "shouldStopAutoplayByClick" } : /* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	transitionInterval = input(4e3, {
+		...ngDevMode ? { debugName: "transitionInterval" } : /* istanbul ignore next */ {},
+		transform: numberAttribute
+	});
+	showThumbnails = input(true, {
+		...ngDevMode ? { debugName: "showThumbnails" } : /* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	thumbnailsPosition = input("bottom", ...ngDevMode ? [{ debugName: "thumbnailsPosition" }] : /* istanbul ignore next */ []);
+	verticalThumbnailViewPortHeight = input("300px", ...ngDevMode ? [{ debugName: "verticalThumbnailViewPortHeight" }] : /* istanbul ignore next */ []);
+	showIndicators = input(false, {
+		...ngDevMode ? { debugName: "showIndicators" } : /* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	showIndicatorsOnItem = input(false, {
+		...ngDevMode ? { debugName: "showIndicatorsOnItem" } : /* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	indicatorsPosition = input("bottom", ...ngDevMode ? [{ debugName: "indicatorsPosition" }] : /* istanbul ignore next */ []);
+	baseZIndex = input(0, {
+		...ngDevMode ? { debugName: "baseZIndex" } : /* istanbul ignore next */ {},
+		transform: numberAttribute
+	});
+	maskClass = input(...ngDevMode ? [void 0, { debugName: "maskClass" }] : /* istanbul ignore next */ []);
+	containerClass = input(...ngDevMode ? [void 0, { debugName: "containerClass" }] : /* istanbul ignore next */ []);
+	containerStyle = input(...ngDevMode ? [void 0, { debugName: "containerStyle" }] : /* istanbul ignore next */ []);
+	motionOptions = input(...ngDevMode ? [void 0, { debugName: "motionOptions" }] : /* istanbul ignore next */ []);
+	computedMotionOptions = computed(() => ({
+		...this.ptm("motion"),
+		...this.motionOptions()
+	}), ...ngDevMode ? [{ debugName: "computedMotionOptions" }] : /* istanbul ignore next */ []);
+	maskMotionOptions = input(...ngDevMode ? [void 0, { debugName: "maskMotionOptions" }] : /* istanbul ignore next */ []);
+	computedMaskMotionOptions = computed(() => ({
+		...this.ptm("maskMotion"),
+		...this.maskMotionOptions()
+	}), ...ngDevMode ? [{ debugName: "computedMaskMotionOptions" }] : /* istanbul ignore next */ []);
+	maskEnterActiveClass = computed(() => this.fullScreen() ? "p-overlay-mask-enter-active" : "", ...ngDevMode ? [{ debugName: "maskEnterActiveClass" }] : /* istanbul ignore next */ []);
+	maskLeaveActiveClass = computed(() => this.fullScreen() ? "p-overlay-mask-leave-active" : "", ...ngDevMode ? [{ debugName: "maskLeaveActiveClass" }] : /* istanbul ignore next */ []);
+	maskRole = computed(() => this.fullScreen() ? "dialog" : "region", ...ngDevMode ? [{ debugName: "maskRole" }] : /* istanbul ignore next */ []);
+	maskAriaModal = computed(() => this.fullScreen() ? "true" : void 0, ...ngDevMode ? [{ debugName: "maskAriaModal" }] : /* istanbul ignore next */ []);
+	visible = model(false, ...ngDevMode ? [{ debugName: "visible" }] : /* istanbul ignore next */ []);
+	renderMask = signal(false, ...ngDevMode ? [{ debugName: "renderMask" }] : /* istanbul ignore next */ []);
+	renderContent = signal(false, ...ngDevMode ? [{ debugName: "renderContent" }] : /* istanbul ignore next */ []);
+	activeIndexChange = output();
+	container = viewChild("container", ...ngDevMode ? [{ debugName: "container" }] : /* istanbul ignore next */ []);
+	_activeIndex = linkedSignal(() => this.activeIndex(), ...ngDevMode ? [{ debugName: "_activeIndex" }] : /* istanbul ignore next */ []);
+	headerTemplate = contentChild("header", {
+		...ngDevMode ? { debugName: "headerTemplate" } : /* istanbul ignore next */ {},
+		descendants: false
+	});
+	footerTemplate = contentChild("footer", {
+		...ngDevMode ? { debugName: "footerTemplate" } : /* istanbul ignore next */ {},
+		descendants: false
+	});
+	indicatorTemplate = contentChild("indicator", {
+		...ngDevMode ? { debugName: "indicatorTemplate" } : /* istanbul ignore next */ {},
+		descendants: false
+	});
+	captionTemplate = contentChild("caption", {
+		...ngDevMode ? { debugName: "captionTemplate" } : /* istanbul ignore next */ {},
+		descendants: false
+	});
+	closeIconTemplate = contentChild("closeicon", {
+		...ngDevMode ? { debugName: "closeIconTemplate" } : /* istanbul ignore next */ {},
+		descendants: false
+	});
+	previousThumbnailIconTemplate = contentChild("previousthumbnailicon", {
+		...ngDevMode ? { debugName: "previousThumbnailIconTemplate" } : /* istanbul ignore next */ {},
+		descendants: false
+	});
+	nextThumbnailIconTemplate = contentChild("nextthumbnailicon", {
+		...ngDevMode ? { debugName: "nextThumbnailIconTemplate" } : /* istanbul ignore next */ {},
+		descendants: false
+	});
+	itemPreviousIconTemplate = contentChild("itempreviousicon", {
+		...ngDevMode ? { debugName: "itemPreviousIconTemplate" } : /* istanbul ignore next */ {},
+		descendants: false
+	});
+	itemNextIconTemplate = contentChild("itemnexticon", {
+		...ngDevMode ? { debugName: "itemNextIconTemplate" } : /* istanbul ignore next */ {},
+		descendants: false
+	});
+	itemTemplate = contentChild("item", {
+		...ngDevMode ? { debugName: "itemTemplate" } : /* istanbul ignore next */ {},
+		descendants: false
+	});
+	thumbnailTemplate = contentChild("thumbnail", {
+		...ngDevMode ? { debugName: "thumbnailTemplate" } : /* istanbul ignore next */ {},
+		descendants: false
+	});
+	maskVisible = false;
+	numVisibleLimit = signal(0, ...ngDevMode ? [{ debugName: "numVisibleLimit" }] : /* istanbul ignore next */ []);
+	d_numVisible = computed(() => this.numVisibleLimit() || this.numVisible(), ...ngDevMode ? [{ debugName: "d_numVisible" }] : /* istanbul ignore next */ []);
+	_componentStyle = inject(GalleriaStyle);
+	mask;
+	element = inject(ElementRef);
+	constructor() {
+		super();
+		effect(() => {
+			const isVisible = this.visible();
+			if (isVisible && !this.maskVisible) {
+				this.maskVisible = true;
+				this.renderMask.set(true);
+				this.renderContent.set(true);
+			} else if (!isVisible && this.maskVisible) this.maskVisible = false;
+		});
+		effect(() => {
+			const val = this.value();
+			if (val && val.length < this.numVisible()) this.numVisibleLimit.set(val.length);
+			else this.numVisibleLimit.set(0);
+		});
+	}
+	onAfterViewChecked() {
+		this.bindDirectiveInstance.setAttrs(this.ptm("host"));
+	}
+	onMaskHide(event) {
+		if (!event || event.target === event.currentTarget) this.visible.set(false);
+	}
+	onActiveItemChange(index) {
+		if (this._activeIndex() !== index) {
+			this._activeIndex.set(index);
+			this.activeIndexChange.emit(index);
+		}
+	}
+	onBeforeEnter(event) {
+		this.mask = event.element?.parentElement;
+		this.enableModality();
+		setTimeout(() => {
+			const focusTarget = findSingle(this.container()?.nativeElement, "[data-pc-section=\"closebutton\"]");
+			if (focusTarget) focus(focusTarget);
+		}, 25);
+	}
+	onBeforeLeave() {
+		if (this.mask) this.maskVisible = false;
+	}
+	onAfterLeave() {
+		this.disableModality();
+		this.renderContent.set(false);
+	}
+	onMaskAfterLeave() {
+		if (!this.renderContent()) this.renderMask.set(false);
+	}
+	enableModality() {
+		blockBodyScroll();
+		if (this.mask) ZIndexUtils.set("modal", this.mask, this.baseZIndex() || this.config.zIndex.modal);
+	}
+	disableModality() {
+		unblockBodyScroll();
+		if (this.mask) ZIndexUtils.clear(this.mask);
+	}
+	onDestroy() {
+		if (this.fullScreen()) removeClass(this.document.body, "p-overflow-hidden");
+		if (this.mask) this.disableModality();
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.0",
+		ngImport: i0,
+		type: Galleria,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.0",
+		type: Galleria,
+		isStandalone: true,
+		selector: "p-galleria",
+		inputs: {
+			activeIndex: {
+				classPropertyName: "activeIndex",
+				publicName: "activeIndex",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			fullScreen: {
+				classPropertyName: "fullScreen",
+				publicName: "fullScreen",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			id: {
+				classPropertyName: "id",
+				publicName: "id",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			value: {
+				classPropertyName: "value",
+				publicName: "value",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			numVisible: {
+				classPropertyName: "numVisible",
+				publicName: "numVisible",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			responsiveOptions: {
+				classPropertyName: "responsiveOptions",
+				publicName: "responsiveOptions",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			showItemNavigators: {
+				classPropertyName: "showItemNavigators",
+				publicName: "showItemNavigators",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			showThumbnailNavigators: {
+				classPropertyName: "showThumbnailNavigators",
+				publicName: "showThumbnailNavigators",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			showItemNavigatorsOnHover: {
+				classPropertyName: "showItemNavigatorsOnHover",
+				publicName: "showItemNavigatorsOnHover",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			changeItemOnIndicatorHover: {
+				classPropertyName: "changeItemOnIndicatorHover",
+				publicName: "changeItemOnIndicatorHover",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			circular: {
+				classPropertyName: "circular",
+				publicName: "circular",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			autoPlay: {
+				classPropertyName: "autoPlay",
+				publicName: "autoPlay",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			shouldStopAutoplayByClick: {
+				classPropertyName: "shouldStopAutoplayByClick",
+				publicName: "shouldStopAutoplayByClick",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			transitionInterval: {
+				classPropertyName: "transitionInterval",
+				publicName: "transitionInterval",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			showThumbnails: {
+				classPropertyName: "showThumbnails",
+				publicName: "showThumbnails",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			thumbnailsPosition: {
+				classPropertyName: "thumbnailsPosition",
+				publicName: "thumbnailsPosition",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			verticalThumbnailViewPortHeight: {
+				classPropertyName: "verticalThumbnailViewPortHeight",
+				publicName: "verticalThumbnailViewPortHeight",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			showIndicators: {
+				classPropertyName: "showIndicators",
+				publicName: "showIndicators",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			showIndicatorsOnItem: {
+				classPropertyName: "showIndicatorsOnItem",
+				publicName: "showIndicatorsOnItem",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			indicatorsPosition: {
+				classPropertyName: "indicatorsPosition",
+				publicName: "indicatorsPosition",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			baseZIndex: {
+				classPropertyName: "baseZIndex",
+				publicName: "baseZIndex",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			maskClass: {
+				classPropertyName: "maskClass",
+				publicName: "maskClass",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			containerClass: {
+				classPropertyName: "containerClass",
+				publicName: "containerClass",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			containerStyle: {
+				classPropertyName: "containerStyle",
+				publicName: "containerStyle",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			motionOptions: {
+				classPropertyName: "motionOptions",
+				publicName: "motionOptions",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			maskMotionOptions: {
+				classPropertyName: "maskMotionOptions",
+				publicName: "maskMotionOptions",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			visible: {
+				classPropertyName: "visible",
+				publicName: "visible",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		outputs: {
+			visible: "visibleChange",
+			activeIndexChange: "activeIndexChange"
+		},
+		providers: [
+			GalleriaStyle,
+			{
+				provide: GALLERIA_INSTANCE,
+				useExisting: Galleria
+			},
+			{
+				provide: PARENT_INSTANCE,
+				useExisting: Galleria
+			}
+		],
+		queries: [
+			{
+				propertyName: "headerTemplate",
+				first: true,
+				predicate: ["header"],
+				isSignal: true
+			},
+			{
+				propertyName: "footerTemplate",
+				first: true,
+				predicate: ["footer"],
+				isSignal: true
+			},
+			{
+				propertyName: "indicatorTemplate",
+				first: true,
+				predicate: ["indicator"],
+				isSignal: true
+			},
+			{
+				propertyName: "captionTemplate",
+				first: true,
+				predicate: ["caption"],
+				isSignal: true
+			},
+			{
+				propertyName: "closeIconTemplate",
+				first: true,
+				predicate: ["closeicon"],
+				isSignal: true
+			},
+			{
+				propertyName: "previousThumbnailIconTemplate",
+				first: true,
+				predicate: ["previousthumbnailicon"],
+				isSignal: true
+			},
+			{
+				propertyName: "nextThumbnailIconTemplate",
+				first: true,
+				predicate: ["nextthumbnailicon"],
+				isSignal: true
+			},
+			{
+				propertyName: "itemPreviousIconTemplate",
+				first: true,
+				predicate: ["itempreviousicon"],
+				isSignal: true
+			},
+			{
+				propertyName: "itemNextIconTemplate",
+				first: true,
+				predicate: ["itemnexticon"],
+				isSignal: true
+			},
+			{
+				propertyName: "itemTemplate",
+				first: true,
+				predicate: ["item"],
+				isSignal: true
+			},
+			{
+				propertyName: "thumbnailTemplate",
+				first: true,
+				predicate: ["thumbnail"],
+				isSignal: true
+			}
+		],
+		viewQueries: [{
+			propertyName: "container",
+			first: true,
+			predicate: ["container"],
+			descendants: true,
+			isSignal: true
+		}],
+		usesInheritance: true,
+		hostDirectives: [{ directive: i1.Bind }],
+		ngImport: i0,
+		template: `
         @if (fullScreen()) {
             <div #container>
                 @if (renderMask()) {
@@ -1772,15 +2525,101 @@ class Galleria extends BaseComponent {
         } @else {
             <div pGalleriaContent [pt]="pt()" [unstyled]="unstyled()" [value]="value() ?? []" [activeIndex]="_activeIndex()" [numVisible]="d_numVisible()" (activeItemChange)="onActiveItemChange($event)"></div>
         }
-    `, isInline: true, dependencies: [{ kind: "component", type: GalleriaContent, selector: "div[pGalleriaContent]", inputs: ["value", "numVisible", "fullScreen", "activeIndex"], outputs: ["fullScreenChange", "maskHide", "activeItemChange"] }, { kind: "ngmodule", type: BindModule }, { kind: "directive", type: i1.Bind, selector: "[pBind]", inputs: ["pBind"] }, { kind: "ngmodule", type: MotionModule }, { kind: "directive", type: i2.MotionDirective, selector: "[pMotion]", inputs: ["pMotion", "pMotionName", "pMotionType", "pMotionSafe", "pMotionDisabled", "pMotionAppear", "pMotionEnter", "pMotionLeave", "pMotionDuration", "pMotionHideStrategy", "pMotionEnterFromClass", "pMotionEnterToClass", "pMotionEnterActiveClass", "pMotionLeaveFromClass", "pMotionLeaveToClass", "pMotionLeaveActiveClass", "pMotionOptions"], outputs: ["pMotionOnBeforeEnter", "pMotionOnEnter", "pMotionOnAfterEnter", "pMotionOnEnterCancelled", "pMotionOnBeforeLeave", "pMotionOnLeave", "pMotionOnAfterLeave", "pMotionOnLeaveCancelled"] }, { kind: "directive", type: FocusTrap, selector: "[pFocusTrap]", inputs: ["pFocusTrapDisabled"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: Galleria, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'p-galleria',
-                    standalone: true,
-                    imports: [GalleriaContent, BindModule, MotionModule, FocusTrap],
-                    template: `
+    `,
+		isInline: true,
+		dependencies: [
+			{
+				kind: "component",
+				type: GalleriaContent,
+				selector: "div[pGalleriaContent]",
+				inputs: [
+					"value",
+					"numVisible",
+					"fullScreen",
+					"activeIndex"
+				],
+				outputs: [
+					"fullScreenChange",
+					"maskHide",
+					"activeItemChange"
+				]
+			},
+			{
+				kind: "ngmodule",
+				type: BindModule
+			},
+			{
+				kind: "directive",
+				type: i1.Bind,
+				selector: "[pBind]",
+				inputs: ["pBind"]
+			},
+			{
+				kind: "ngmodule",
+				type: MotionModule
+			},
+			{
+				kind: "directive",
+				type: i2.MotionDirective,
+				selector: "[pMotion]",
+				inputs: [
+					"pMotion",
+					"pMotionName",
+					"pMotionType",
+					"pMotionSafe",
+					"pMotionDisabled",
+					"pMotionAppear",
+					"pMotionEnter",
+					"pMotionLeave",
+					"pMotionDuration",
+					"pMotionHideStrategy",
+					"pMotionEnterFromClass",
+					"pMotionEnterToClass",
+					"pMotionEnterActiveClass",
+					"pMotionLeaveFromClass",
+					"pMotionLeaveToClass",
+					"pMotionLeaveActiveClass",
+					"pMotionOptions"
+				],
+				outputs: [
+					"pMotionOnBeforeEnter",
+					"pMotionOnEnter",
+					"pMotionOnAfterEnter",
+					"pMotionOnEnterCancelled",
+					"pMotionOnBeforeLeave",
+					"pMotionOnLeave",
+					"pMotionOnAfterLeave",
+					"pMotionOnLeaveCancelled"
+				]
+			},
+			{
+				kind: "directive",
+				type: FocusTrap,
+				selector: "[pFocusTrap]",
+				inputs: ["pFocusTrapDisabled"]
+			}
+		],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush,
+		encapsulation: i0.ViewEncapsulation.None
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.0",
+	ngImport: i0,
+	type: Galleria,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "p-galleria",
+			standalone: true,
+			imports: [
+				GalleriaContent,
+				BindModule,
+				MotionModule,
+				FocusTrap
+			],
+			template: `
         @if (fullScreen()) {
             <div #container>
                 @if (renderMask()) {
@@ -1827,28 +2666,372 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImpor
             <div pGalleriaContent [pt]="pt()" [unstyled]="unstyled()" [value]="value() ?? []" [activeIndex]="_activeIndex()" [numVisible]="d_numVisible()" (activeItemChange)="onActiveItemChange($event)"></div>
         }
     `,
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    encapsulation: ViewEncapsulation.None,
-                    providers: [GalleriaStyle, { provide: GALLERIA_INSTANCE, useExisting: Galleria }, { provide: PARENT_INSTANCE, useExisting: Galleria }],
-                    hostDirectives: [Bind]
-                }]
-        }], ctorParameters: () => [], propDecorators: { activeIndex: [{ type: i0.Input, args: [{ isSignal: true, alias: "activeIndex", required: false }] }], fullScreen: [{ type: i0.Input, args: [{ isSignal: true, alias: "fullScreen", required: false }] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], numVisible: [{ type: i0.Input, args: [{ isSignal: true, alias: "numVisible", required: false }] }], responsiveOptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "responsiveOptions", required: false }] }], showItemNavigators: [{ type: i0.Input, args: [{ isSignal: true, alias: "showItemNavigators", required: false }] }], showThumbnailNavigators: [{ type: i0.Input, args: [{ isSignal: true, alias: "showThumbnailNavigators", required: false }] }], showItemNavigatorsOnHover: [{ type: i0.Input, args: [{ isSignal: true, alias: "showItemNavigatorsOnHover", required: false }] }], changeItemOnIndicatorHover: [{ type: i0.Input, args: [{ isSignal: true, alias: "changeItemOnIndicatorHover", required: false }] }], circular: [{ type: i0.Input, args: [{ isSignal: true, alias: "circular", required: false }] }], autoPlay: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoPlay", required: false }] }], shouldStopAutoplayByClick: [{ type: i0.Input, args: [{ isSignal: true, alias: "shouldStopAutoplayByClick", required: false }] }], transitionInterval: [{ type: i0.Input, args: [{ isSignal: true, alias: "transitionInterval", required: false }] }], showThumbnails: [{ type: i0.Input, args: [{ isSignal: true, alias: "showThumbnails", required: false }] }], thumbnailsPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "thumbnailsPosition", required: false }] }], verticalThumbnailViewPortHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "verticalThumbnailViewPortHeight", required: false }] }], showIndicators: [{ type: i0.Input, args: [{ isSignal: true, alias: "showIndicators", required: false }] }], showIndicatorsOnItem: [{ type: i0.Input, args: [{ isSignal: true, alias: "showIndicatorsOnItem", required: false }] }], indicatorsPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "indicatorsPosition", required: false }] }], baseZIndex: [{ type: i0.Input, args: [{ isSignal: true, alias: "baseZIndex", required: false }] }], maskClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "maskClass", required: false }] }], containerClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "containerClass", required: false }] }], containerStyle: [{ type: i0.Input, args: [{ isSignal: true, alias: "containerStyle", required: false }] }], motionOptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "motionOptions", required: false }] }], maskMotionOptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "maskMotionOptions", required: false }] }], visible: [{ type: i0.Input, args: [{ isSignal: true, alias: "visible", required: false }] }, { type: i0.Output, args: ["visibleChange"] }], activeIndexChange: [{ type: i0.Output, args: ["activeIndexChange"] }], container: [{ type: i0.ViewChild, args: ['container', { isSignal: true }] }], headerTemplate: [{ type: i0.ContentChild, args: ['header', { ...{ descendants: false }, isSignal: true }] }], footerTemplate: [{ type: i0.ContentChild, args: ['footer', { ...{ descendants: false }, isSignal: true }] }], indicatorTemplate: [{ type: i0.ContentChild, args: ['indicator', { ...{ descendants: false }, isSignal: true }] }], captionTemplate: [{ type: i0.ContentChild, args: ['caption', { ...{ descendants: false }, isSignal: true }] }], closeIconTemplate: [{ type: i0.ContentChild, args: ['closeicon', { ...{ descendants: false }, isSignal: true }] }], previousThumbnailIconTemplate: [{ type: i0.ContentChild, args: ['previousthumbnailicon', { ...{ descendants: false }, isSignal: true }] }], nextThumbnailIconTemplate: [{ type: i0.ContentChild, args: ['nextthumbnailicon', { ...{ descendants: false }, isSignal: true }] }], itemPreviousIconTemplate: [{ type: i0.ContentChild, args: ['itempreviousicon', { ...{ descendants: false }, isSignal: true }] }], itemNextIconTemplate: [{ type: i0.ContentChild, args: ['itemnexticon', { ...{ descendants: false }, isSignal: true }] }], itemTemplate: [{ type: i0.ContentChild, args: ['item', { ...{ descendants: false }, isSignal: true }] }], thumbnailTemplate: [{ type: i0.ContentChild, args: ['thumbnail', { ...{ descendants: false }, isSignal: true }] }] } });
-class GalleriaModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: GalleriaModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.1.2", ngImport: i0, type: GalleriaModule, imports: [Galleria, SharedModule], exports: [Galleria, SharedModule] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: GalleriaModule, imports: [Galleria, SharedModule, SharedModule] });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: GalleriaModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    imports: [Galleria, SharedModule],
-                    exports: [Galleria, SharedModule]
-                }]
-        }] });
-
-/**
- * Generated bundle index. Do not edit.
- */
-
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			encapsulation: ViewEncapsulation.None,
+			providers: [
+				GalleriaStyle,
+				{
+					provide: GALLERIA_INSTANCE,
+					useExisting: Galleria
+				},
+				{
+					provide: PARENT_INSTANCE,
+					useExisting: Galleria
+				}
+			],
+			hostDirectives: [Bind]
+		}]
+	}],
+	ctorParameters: () => [],
+	propDecorators: {
+		activeIndex: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "activeIndex",
+				required: false
+			}]
+		}],
+		fullScreen: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "fullScreen",
+				required: false
+			}]
+		}],
+		id: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "id",
+				required: false
+			}]
+		}],
+		value: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "value",
+				required: false
+			}]
+		}],
+		numVisible: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "numVisible",
+				required: false
+			}]
+		}],
+		responsiveOptions: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "responsiveOptions",
+				required: false
+			}]
+		}],
+		showItemNavigators: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "showItemNavigators",
+				required: false
+			}]
+		}],
+		showThumbnailNavigators: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "showThumbnailNavigators",
+				required: false
+			}]
+		}],
+		showItemNavigatorsOnHover: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "showItemNavigatorsOnHover",
+				required: false
+			}]
+		}],
+		changeItemOnIndicatorHover: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "changeItemOnIndicatorHover",
+				required: false
+			}]
+		}],
+		circular: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "circular",
+				required: false
+			}]
+		}],
+		autoPlay: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "autoPlay",
+				required: false
+			}]
+		}],
+		shouldStopAutoplayByClick: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "shouldStopAutoplayByClick",
+				required: false
+			}]
+		}],
+		transitionInterval: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "transitionInterval",
+				required: false
+			}]
+		}],
+		showThumbnails: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "showThumbnails",
+				required: false
+			}]
+		}],
+		thumbnailsPosition: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "thumbnailsPosition",
+				required: false
+			}]
+		}],
+		verticalThumbnailViewPortHeight: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "verticalThumbnailViewPortHeight",
+				required: false
+			}]
+		}],
+		showIndicators: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "showIndicators",
+				required: false
+			}]
+		}],
+		showIndicatorsOnItem: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "showIndicatorsOnItem",
+				required: false
+			}]
+		}],
+		indicatorsPosition: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "indicatorsPosition",
+				required: false
+			}]
+		}],
+		baseZIndex: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "baseZIndex",
+				required: false
+			}]
+		}],
+		maskClass: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "maskClass",
+				required: false
+			}]
+		}],
+		containerClass: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "containerClass",
+				required: false
+			}]
+		}],
+		containerStyle: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "containerStyle",
+				required: false
+			}]
+		}],
+		motionOptions: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "motionOptions",
+				required: false
+			}]
+		}],
+		maskMotionOptions: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "maskMotionOptions",
+				required: false
+			}]
+		}],
+		visible: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "visible",
+				required: false
+			}]
+		}, {
+			type: i0.Output,
+			args: ["visibleChange"]
+		}],
+		activeIndexChange: [{
+			type: i0.Output,
+			args: ["activeIndexChange"]
+		}],
+		container: [{
+			type: i0.ViewChild,
+			args: ["container", { isSignal: true }]
+		}],
+		headerTemplate: [{
+			type: i0.ContentChild,
+			args: ["header", {
+				descendants: false,
+				isSignal: true
+			}]
+		}],
+		footerTemplate: [{
+			type: i0.ContentChild,
+			args: ["footer", {
+				descendants: false,
+				isSignal: true
+			}]
+		}],
+		indicatorTemplate: [{
+			type: i0.ContentChild,
+			args: ["indicator", {
+				descendants: false,
+				isSignal: true
+			}]
+		}],
+		captionTemplate: [{
+			type: i0.ContentChild,
+			args: ["caption", {
+				descendants: false,
+				isSignal: true
+			}]
+		}],
+		closeIconTemplate: [{
+			type: i0.ContentChild,
+			args: ["closeicon", {
+				descendants: false,
+				isSignal: true
+			}]
+		}],
+		previousThumbnailIconTemplate: [{
+			type: i0.ContentChild,
+			args: ["previousthumbnailicon", {
+				descendants: false,
+				isSignal: true
+			}]
+		}],
+		nextThumbnailIconTemplate: [{
+			type: i0.ContentChild,
+			args: ["nextthumbnailicon", {
+				descendants: false,
+				isSignal: true
+			}]
+		}],
+		itemPreviousIconTemplate: [{
+			type: i0.ContentChild,
+			args: ["itempreviousicon", {
+				descendants: false,
+				isSignal: true
+			}]
+		}],
+		itemNextIconTemplate: [{
+			type: i0.ContentChild,
+			args: ["itemnexticon", {
+				descendants: false,
+				isSignal: true
+			}]
+		}],
+		itemTemplate: [{
+			type: i0.ContentChild,
+			args: ["item", {
+				descendants: false,
+				isSignal: true
+			}]
+		}],
+		thumbnailTemplate: [{
+			type: i0.ContentChild,
+			args: ["thumbnail", {
+				descendants: false,
+				isSignal: true
+			}]
+		}]
+	}
+});
+var GalleriaModule = class GalleriaModule {
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.0",
+		ngImport: i0,
+		type: GalleriaModule,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.NgModule
+	});
+	static ɵmod = i0.ɵɵngDeclareNgModule({
+		minVersion: "14.0.0",
+		version: "22.2.0",
+		ngImport: i0,
+		type: GalleriaModule,
+		imports: [Galleria, SharedModule],
+		exports: [Galleria, SharedModule]
+	});
+	static ɵinj = i0.ɵɵngDeclareInjector({
+		minVersion: "12.0.0",
+		version: "22.2.0",
+		ngImport: i0,
+		type: GalleriaModule,
+		imports: [
+			Galleria,
+			SharedModule,
+			SharedModule
+		]
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.0",
+	ngImport: i0,
+	type: GalleriaModule,
+	decorators: [{
+		type: NgModule,
+		args: [{
+			imports: [Galleria, SharedModule],
+			exports: [Galleria, SharedModule]
+		}]
+	}]
+});
 export { Galleria, GalleriaClasses, GalleriaModule, GalleriaStyle };
-//# sourceMappingURL=primeng-galleria.mjs.map
+
+//# sourceMappingURL=primeng-galleria.mjs.map