@vinlos/ngx-gallery
Version:
A simple responsive native gallery component for Angular 18.
593 lines (574 loc) • 29.9 kB
TypeScript
import * as _angular_core from '@angular/core';
import { ElementRef, OnInit, OnDestroy, OnChanges, SimpleChanges, DoCheck, AfterViewInit } from '@angular/core';
import { SafeUrl, SafeResourceUrl, SafeStyle, HammerGestureConfig } from '@angular/platform-browser';
import { AnimationEvent } from '@angular/animations';
import * as i1 from '@angular/common';
declare class NgxGalleryService {
private renderer;
private swipeHandlers;
manageSwipe(status: boolean, element: ElementRef, id: string, nextHandler: () => void, prevHandler: () => void): void;
validateUrl(url: string): string;
getBackgroundUrl(image: string): string;
getFileType(fileSource: string): string;
private getSwipeHandlers;
private removeSwipeHandlers;
static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgxGalleryService, never>;
static ɵprov: _angular_core.ɵɵInjectableDeclaration<NgxGalleryService>;
}
interface INgxGalleryAction {
icon: string;
disabled?: boolean;
titleText?: string;
onClick: (event: Event, index: number) => void;
}
declare class NgxGalleryAction implements INgxGalleryAction {
icon: string;
disabled?: boolean;
titleText?: string;
onClick: (event: Event, index: number) => void;
constructor(action: INgxGalleryAction);
}
declare class NgxGalleryPreviewComponent implements OnInit, OnDestroy, OnChanges {
private sanitization;
private elementRef;
private helperService;
private renderer;
private changeDetectorRef;
src: SafeUrl;
srcIndex: number;
description: string;
type: string;
showSpinner: boolean;
positionLeft: number;
positionTop: number;
zoomValue: number;
loading: boolean;
rotateValue: number;
index: number;
readonly images: _angular_core.InputSignal<string[] | SafeResourceUrl[]>;
readonly descriptions: _angular_core.InputSignal<string[]>;
readonly showDescription: _angular_core.InputSignal<boolean>;
arrows: boolean;
readonly arrowsAutoHide: _angular_core.InputSignal<boolean>;
readonly swipe: _angular_core.InputSignal<boolean>;
readonly fullscreen: _angular_core.InputSignal<boolean>;
readonly forceFullscreen: _angular_core.InputSignal<boolean>;
readonly closeOnClick: _angular_core.InputSignal<boolean>;
readonly closeOnEsc: _angular_core.InputSignal<boolean>;
readonly keyboardNavigation: _angular_core.InputSignal<boolean>;
readonly arrowPrevIcon: _angular_core.InputSignal<string>;
readonly arrowNextIcon: _angular_core.InputSignal<string>;
readonly closeIcon: _angular_core.InputSignal<string>;
readonly fullscreenIcon: _angular_core.InputSignal<string>;
readonly spinnerIcon: _angular_core.InputSignal<string>;
readonly autoPlay: _angular_core.InputSignal<boolean>;
readonly autoPlayInterval: _angular_core.InputSignal<number>;
readonly autoPlayPauseOnHover: _angular_core.InputSignal<boolean>;
readonly infinityMove: _angular_core.InputSignal<boolean>;
readonly zoom: _angular_core.InputSignal<boolean>;
readonly zoomStep: _angular_core.InputSignal<number>;
readonly zoomMax: _angular_core.InputSignal<number>;
readonly zoomMin: _angular_core.InputSignal<number>;
readonly zoomInIcon: _angular_core.InputSignal<string>;
readonly zoomOutIcon: _angular_core.InputSignal<string>;
readonly animation: _angular_core.InputSignal<boolean>;
readonly actions: _angular_core.InputSignal<NgxGalleryAction[]>;
readonly rotate: _angular_core.InputSignal<boolean>;
readonly rotateLeftIcon: _angular_core.InputSignal<string>;
readonly rotateRightIcon: _angular_core.InputSignal<string>;
readonly download: _angular_core.InputSignal<boolean>;
readonly downloadIcon: _angular_core.InputSignal<string>;
readonly bullets: _angular_core.InputSignal<boolean>;
readonly previewOpen: _angular_core.OutputEmitterRef<void>;
readonly previewClose: _angular_core.OutputEmitterRef<void>;
readonly activeChange: _angular_core.OutputEmitterRef<number>;
readonly previewImage: _angular_core.Signal<any>;
private isOpen;
private timer;
private initialX;
private initialY;
private initialLeft;
private initialTop;
private isMove;
private keyDownListener;
ngOnInit(): void;
ngOnChanges(changes: SimpleChanges): void;
ngOnDestroy(): void;
onMouseEnter(): void;
onMouseLeave(): void;
onKeyDown(e: any): void;
open(index: number): void;
close(): void;
imageMouseEnter(): void;
imageMouseLeave(): void;
startAutoPlay(): void;
stopAutoPlay(): void;
showAtIndex(index: number): void;
showNext(): boolean;
showPrev(): void;
canShowNext(): boolean;
canShowPrev(): boolean;
manageFullscreen(): void;
getSafeUrl(image: string): SafeUrl;
getFileType(fileSource: string): string;
zoomIn(): void;
zoomOut(): void;
rotateLeft(): void;
rotateRight(): void;
getTransform(): SafeStyle;
canZoomIn(): boolean;
canZoomOut(): boolean;
canDragOnZoom(): boolean;
mouseDownHandler(e: any): void;
mouseUpHandler(e: any): void;
mouseMoveHandler(e: any): void;
private getClientX;
private getClientY;
private resetPosition;
private isKeyboardNext;
private isKeyboardPrev;
private isKeyboardEsc;
private openFullscreen;
private closeFullscreen;
private isFullscreen;
private show;
private _show;
private isLoaded;
static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgxGalleryPreviewComponent, never>;
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgxGalleryPreviewComponent, "ngx-gallery-preview", never, { "images": { "alias": "images"; "required": false; "isSignal": true; }; "descriptions": { "alias": "descriptions"; "required": false; "isSignal": true; }; "showDescription": { "alias": "showDescription"; "required": false; "isSignal": true; }; "arrows": { "alias": "arrows"; "required": false; }; "arrowsAutoHide": { "alias": "arrowsAutoHide"; "required": false; "isSignal": true; }; "swipe": { "alias": "swipe"; "required": false; "isSignal": true; }; "fullscreen": { "alias": "fullscreen"; "required": false; "isSignal": true; }; "forceFullscreen": { "alias": "forceFullscreen"; "required": false; "isSignal": true; }; "closeOnClick": { "alias": "closeOnClick"; "required": false; "isSignal": true; }; "closeOnEsc": { "alias": "closeOnEsc"; "required": false; "isSignal": true; }; "keyboardNavigation": { "alias": "keyboardNavigation"; "required": false; "isSignal": true; }; "arrowPrevIcon": { "alias": "arrowPrevIcon"; "required": false; "isSignal": true; }; "arrowNextIcon": { "alias": "arrowNextIcon"; "required": false; "isSignal": true; }; "closeIcon": { "alias": "closeIcon"; "required": false; "isSignal": true; }; "fullscreenIcon": { "alias": "fullscreenIcon"; "required": false; "isSignal": true; }; "spinnerIcon": { "alias": "spinnerIcon"; "required": false; "isSignal": true; }; "autoPlay": { "alias": "autoPlay"; "required": false; "isSignal": true; }; "autoPlayInterval": { "alias": "autoPlayInterval"; "required": false; "isSignal": true; }; "autoPlayPauseOnHover": { "alias": "autoPlayPauseOnHover"; "required": false; "isSignal": true; }; "infinityMove": { "alias": "infinityMove"; "required": false; "isSignal": true; }; "zoom": { "alias": "zoom"; "required": false; "isSignal": true; }; "zoomStep": { "alias": "zoomStep"; "required": false; "isSignal": true; }; "zoomMax": { "alias": "zoomMax"; "required": false; "isSignal": true; }; "zoomMin": { "alias": "zoomMin"; "required": false; "isSignal": true; }; "zoomInIcon": { "alias": "zoomInIcon"; "required": false; "isSignal": true; }; "zoomOutIcon": { "alias": "zoomOutIcon"; "required": false; "isSignal": true; }; "animation": { "alias": "animation"; "required": false; "isSignal": true; }; "actions": { "alias": "actions"; "required": false; "isSignal": true; }; "rotate": { "alias": "rotate"; "required": false; "isSignal": true; }; "rotateLeftIcon": { "alias": "rotateLeftIcon"; "required": false; "isSignal": true; }; "rotateRightIcon": { "alias": "rotateRightIcon"; "required": false; "isSignal": true; }; "download": { "alias": "download"; "required": false; "isSignal": true; }; "downloadIcon": { "alias": "downloadIcon"; "required": false; "isSignal": true; }; "bullets": { "alias": "bullets"; "required": false; "isSignal": true; }; }, { "previewOpen": "previewOpen"; "previewClose": "previewClose"; "activeChange": "activeChange"; }, never, never, true, never>;
}
interface INgxGalleryOrderedImage {
src: string | SafeResourceUrl;
type: string;
index: number;
}
declare class NgxGalleryOrderedImage implements INgxGalleryOrderedImage {
src: string | SafeResourceUrl;
type: string;
index: number;
constructor(obj: INgxGalleryOrderedImage);
}
type Orientation = ('slideLeft' | 'slideRight' | 'fade' | 'rotateLeft' | 'rotateRight' | 'zoom' | 'none');
declare class NgxGalleryImageComponent implements OnInit, OnChanges {
private sanitization;
private changeDetectorRef;
private elementRef;
private helperService;
readonly images: _angular_core.InputSignal<NgxGalleryOrderedImage[]>;
readonly clickable: _angular_core.InputSignal<boolean>;
_selectedIndex: any;
set selectedIndex(index: number);
arrows: boolean;
readonly arrowsAutoHide: _angular_core.InputSignal<boolean>;
readonly swipe: _angular_core.InputSignal<boolean>;
readonly animation: _angular_core.InputSignal<string>;
readonly size: _angular_core.InputSignal<string>;
readonly arrowPrevIcon: _angular_core.InputSignal<string>;
readonly arrowNextIcon: _angular_core.InputSignal<string>;
readonly autoPlay: _angular_core.InputSignal<boolean>;
readonly autoPlayInterval: _angular_core.InputSignal<number>;
readonly autoPlayPauseOnHover: _angular_core.InputSignal<boolean>;
readonly infinityMove: _angular_core.InputSignal<boolean>;
readonly lazyLoading: _angular_core.InputSignal<boolean>;
readonly actions: _angular_core.InputSignal<NgxGalleryAction[]>;
descriptions: string[];
readonly showDescription: _angular_core.InputSignal<boolean>;
readonly bullets: _angular_core.InputSignal<boolean>;
readonly imageClick: _angular_core.OutputEmitterRef<number>;
readonly activeChange: _angular_core.OutputEmitterRef<number>;
readonly animating: _angular_core.OutputEmitterRef<boolean>;
canChangeImage: boolean;
action: Orientation;
isAnimating: boolean;
private timer;
constructor();
ngOnInit(): void;
ngOnChanges(changes: SimpleChanges): void;
onMouseEnter(): void;
onMouseLeave(): void;
reset(index: number): void;
getImages(): NgxGalleryOrderedImage[];
startAutoPlay(): void;
stopAutoPlay(): void;
handleClick(event: Event, index: number): void;
show(index: number): void;
setAction(action: Orientation): void;
showNext(): boolean;
showPrev(): void;
setChangeTimeout(): void;
canShowNext(): boolean;
canShowPrev(): boolean;
getSafeUrl(image: string | SafeResourceUrl): SafeStyle;
getFileType(fileSource: string): string;
onStart(event: AnimationEvent): void;
onDone(event: AnimationEvent): void;
static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgxGalleryImageComponent, never>;
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgxGalleryImageComponent, "ngx-gallery-image", never, { "images": { "alias": "images"; "required": false; "isSignal": true; }; "clickable": { "alias": "clickable"; "required": false; "isSignal": true; }; "selectedIndex": { "alias": "selectedIndex"; "required": false; }; "arrows": { "alias": "arrows"; "required": false; }; "arrowsAutoHide": { "alias": "arrowsAutoHide"; "required": false; "isSignal": true; }; "swipe": { "alias": "swipe"; "required": false; "isSignal": true; }; "animation": { "alias": "animation"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "arrowPrevIcon": { "alias": "arrowPrevIcon"; "required": false; "isSignal": true; }; "arrowNextIcon": { "alias": "arrowNextIcon"; "required": false; "isSignal": true; }; "autoPlay": { "alias": "autoPlay"; "required": false; "isSignal": true; }; "autoPlayInterval": { "alias": "autoPlayInterval"; "required": false; "isSignal": true; }; "autoPlayPauseOnHover": { "alias": "autoPlayPauseOnHover"; "required": false; "isSignal": true; }; "infinityMove": { "alias": "infinityMove"; "required": false; "isSignal": true; }; "lazyLoading": { "alias": "lazyLoading"; "required": false; "isSignal": true; }; "actions": { "alias": "actions"; "required": false; "isSignal": true; }; "descriptions": { "alias": "descriptions"; "required": false; }; "showDescription": { "alias": "showDescription"; "required": false; "isSignal": true; }; "bullets": { "alias": "bullets"; "required": false; "isSignal": true; }; }, { "imageClick": "imageClick"; "activeChange": "activeChange"; "animating": "animating"; }, never, never, true, never>;
}
declare class NgxGalleryThumbnailsComponent implements OnChanges {
private sanitization;
private elementRef;
private helperService;
thumbnailsLeft: string;
thumbnailsMarginLeft: string;
mouseenter: boolean;
remainingCountValue: number;
minStopIndex: number;
readonly images: _angular_core.InputSignal<string[] | SafeResourceUrl[]>;
readonly isAnimating: _angular_core.InputSignal<boolean>;
readonly links: _angular_core.InputSignal<string[]>;
readonly labels: _angular_core.InputSignal<string[]>;
readonly linkTarget: _angular_core.InputSignal<string>;
readonly columns: _angular_core.InputSignal<number>;
readonly rows: _angular_core.InputSignal<number>;
readonly arrows: _angular_core.InputSignal<boolean>;
readonly arrowsAutoHide: _angular_core.InputSignal<boolean>;
readonly margin: _angular_core.InputSignal<number>;
selectedIndex: number;
readonly clickable: _angular_core.InputSignal<boolean>;
readonly swipe: _angular_core.InputSignal<boolean>;
readonly size: _angular_core.InputSignal<string>;
readonly arrowPrevIcon: _angular_core.InputSignal<string>;
readonly arrowNextIcon: _angular_core.InputSignal<string>;
readonly moveSize: _angular_core.InputSignal<number>;
readonly order: _angular_core.InputSignal<number>;
readonly remainingCount: _angular_core.InputSignal<boolean>;
readonly lazyLoading: _angular_core.InputSignal<boolean>;
readonly actions: _angular_core.InputSignal<NgxGalleryAction[]>;
readonly activeChange: _angular_core.OutputEmitterRef<number>;
private index;
ngOnChanges(changes: SimpleChanges): void;
onMouseEnter(): void;
onMouseLeave(): void;
reset(index: number): void;
getImages(): string[] | SafeResourceUrl[];
handleClick(event: Event, index: number): void;
hasLink(index: number): boolean;
moveRight(): void;
moveLeft(): void;
canMoveRight(): boolean;
canMoveLeft(): boolean;
getThumbnailLeft(index: number): SafeStyle;
getThumbnailTop(index: number): SafeStyle;
getThumbnailWidth(): SafeStyle;
getThumbnailHeight(): SafeStyle;
setThumbnailsPosition(): void;
setDefaultPosition(): void;
canShowArrows(): boolean;
validateIndex(): void;
getSafeUrl(image: string | SafeResourceUrl): SafeStyle;
getFileType(fileSource: string | SafeResourceUrl): string;
private getThumbnailPosition;
private getThumbnailDimension;
private getMaxIndex;
private getVisibleCount;
private getSafeStyle;
static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgxGalleryThumbnailsComponent, never>;
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgxGalleryThumbnailsComponent, "ngx-gallery-thumbnails", never, { "images": { "alias": "images"; "required": false; "isSignal": true; }; "isAnimating": { "alias": "isAnimating"; "required": false; "isSignal": true; }; "links": { "alias": "links"; "required": false; "isSignal": true; }; "labels": { "alias": "labels"; "required": false; "isSignal": true; }; "linkTarget": { "alias": "linkTarget"; "required": false; "isSignal": true; }; "columns": { "alias": "columns"; "required": false; "isSignal": true; }; "rows": { "alias": "rows"; "required": false; "isSignal": true; }; "arrows": { "alias": "arrows"; "required": false; "isSignal": true; }; "arrowsAutoHide": { "alias": "arrowsAutoHide"; "required": false; "isSignal": true; }; "margin": { "alias": "margin"; "required": false; "isSignal": true; }; "selectedIndex": { "alias": "selectedIndex"; "required": false; }; "clickable": { "alias": "clickable"; "required": false; "isSignal": true; }; "swipe": { "alias": "swipe"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "arrowPrevIcon": { "alias": "arrowPrevIcon"; "required": false; "isSignal": true; }; "arrowNextIcon": { "alias": "arrowNextIcon"; "required": false; "isSignal": true; }; "moveSize": { "alias": "moveSize"; "required": false; "isSignal": true; }; "order": { "alias": "order"; "required": false; "isSignal": true; }; "remainingCount": { "alias": "remainingCount"; "required": false; "isSignal": true; }; "lazyLoading": { "alias": "lazyLoading"; "required": false; "isSignal": true; }; "actions": { "alias": "actions"; "required": false; "isSignal": true; }; }, { "activeChange": "activeChange"; }, never, never, true, never>;
}
interface INgxGalleryOptions {
width?: string;
height?: string;
breakpoint?: number;
fullWidth?: boolean;
layout?: string;
startIndex?: number;
linkTarget?: string;
lazyLoading?: boolean;
image?: boolean;
imagePercent?: number;
imageArrows?: boolean;
imageArrowsAutoHide?: boolean;
imageSwipe?: boolean;
imageAnimation?: string;
imageSize?: string;
imageAutoPlay?: boolean;
imageAutoPlayInterval?: number;
imageAutoPlayPauseOnHover?: boolean;
imageInfinityMove?: boolean;
imageActions?: NgxGalleryAction[];
imageDescription?: boolean;
imageBullets?: boolean;
thumbnails?: boolean;
thumbnailsColumns?: number;
thumbnailsRows?: number;
thumbnailsPercent?: number;
thumbnailsMargin?: number;
thumbnailsArrows?: boolean;
thumbnailsArrowsAutoHide?: boolean;
thumbnailsSwipe?: boolean;
thumbnailsMoveSize?: number;
thumbnailsOrder?: number;
thumbnailsRemainingCount?: boolean;
thumbnailsAsLinks?: boolean;
thumbnailsAutoHide?: boolean;
thumbnailMargin?: number;
thumbnailSize?: string;
thumbnailActions?: NgxGalleryAction[];
thumbnailClasses?: string[];
preview?: boolean;
previewDescription?: boolean;
previewArrows?: boolean;
previewArrowsAutoHide?: boolean;
previewSwipe?: boolean;
previewFullscreen?: boolean;
previewForceFullscreen?: boolean;
previewCloseOnClick?: boolean;
previewCloseOnEsc?: boolean;
previewKeyboardNavigation?: boolean;
previewAnimation?: boolean;
previewAutoPlay?: boolean;
previewAutoPlayInterval?: number;
previewAutoPlayPauseOnHover?: boolean;
previewInfinityMove?: boolean;
previewZoom?: boolean;
previewZoomStep?: number;
previewZoomMax?: number;
previewZoomMin?: number;
previewRotate?: boolean;
previewDownload?: boolean;
previewCustom?: (index: number) => void;
previewBullets?: boolean;
arrowPrevIcon?: string;
arrowNextIcon?: string;
closeIcon?: string;
fullscreenIcon?: string;
spinnerIcon?: string;
zoomInIcon?: string;
zoomOutIcon?: string;
rotateLeftIcon?: string;
rotateRightIcon?: string;
downloadIcon?: string;
actions?: NgxGalleryAction[];
}
declare class NgxGalleryOptions implements INgxGalleryOptions {
width?: string;
height?: string;
breakpoint?: number;
fullWidth?: boolean;
layout?: string;
startIndex?: number;
linkTarget?: string;
lazyLoading?: boolean;
image?: boolean;
imagePercent?: number;
imageArrows?: boolean;
imageArrowsAutoHide?: boolean;
imageSwipe?: boolean;
imageAnimation?: string;
imageSize?: string;
imageAutoPlay?: boolean;
imageAutoPlayInterval?: number;
imageAutoPlayPauseOnHover?: boolean;
imageInfinityMove?: boolean;
imageActions?: NgxGalleryAction[];
imageDescription?: boolean;
imageBullets?: boolean;
thumbnails?: boolean;
thumbnailsColumns?: number;
thumbnailsRows?: number;
thumbnailsPercent?: number;
thumbnailsMargin?: number;
thumbnailsArrows?: boolean;
thumbnailsArrowsAutoHide?: boolean;
thumbnailsSwipe?: boolean;
thumbnailsMoveSize?: number;
thumbnailsOrder?: number;
thumbnailsRemainingCount?: boolean;
thumbnailsAsLinks?: boolean;
thumbnailsAutoHide?: boolean;
thumbnailMargin?: number;
thumbnailSize?: string;
thumbnailActions?: NgxGalleryAction[];
thumbnailClasses?: string[];
preview?: boolean;
previewDescription?: boolean;
previewArrows?: boolean;
previewArrowsAutoHide?: boolean;
previewSwipe?: boolean;
previewFullscreen?: boolean;
previewForceFullscreen?: boolean;
previewCloseOnClick?: boolean;
previewCloseOnEsc?: boolean;
previewKeyboardNavigation?: boolean;
previewAnimation?: boolean;
previewAutoPlay?: boolean;
previewAutoPlayInterval?: number;
previewAutoPlayPauseOnHover?: boolean;
previewInfinityMove?: boolean;
previewZoom?: boolean;
previewZoomStep?: number;
previewZoomMax?: number;
previewZoomMin?: number;
previewRotate?: boolean;
previewDownload?: boolean;
previewCustom?: (index: number) => void;
previewBullets?: boolean;
arrowPrevIcon?: string;
arrowNextIcon?: string;
closeIcon?: string;
fullscreenIcon?: string;
spinnerIcon?: string;
zoomInIcon?: string;
zoomOutIcon?: string;
rotateLeftIcon?: string;
rotateRightIcon?: string;
downloadIcon?: string;
actions?: NgxGalleryAction[];
constructor(obj: INgxGalleryOptions);
}
interface INgxGalleryImage {
small?: string | SafeResourceUrl;
medium?: string | SafeResourceUrl;
big?: string | SafeResourceUrl;
description?: string;
url?: string;
type?: string;
label?: string;
}
declare class NgxGalleryImage implements INgxGalleryImage {
small?: string | SafeResourceUrl;
medium?: string | SafeResourceUrl;
big?: string | SafeResourceUrl;
description?: string;
url?: string;
type?: string;
label?: string;
constructor(obj: INgxGalleryImage);
}
declare class NgxGalleryComponent implements OnInit, DoCheck, AfterViewInit {
private myElement;
private helperService;
options: NgxGalleryOptions[];
readonly images: _angular_core.InputSignal<NgxGalleryImage[]>;
readonly imagesReady: _angular_core.OutputEmitterRef<void>;
readonly change: _angular_core.OutputEmitterRef<{
index: number;
image: NgxGalleryImage;
}>;
readonly previewOpen: _angular_core.OutputEmitterRef<void>;
readonly previewClose: _angular_core.OutputEmitterRef<void>;
readonly previewChange: _angular_core.OutputEmitterRef<{
index: number;
image: NgxGalleryImage;
}>;
smallImages: string[] | SafeResourceUrl[];
mediumImages: NgxGalleryOrderedImage[];
bigImages: string[] | SafeResourceUrl[];
descriptions: string[];
links: string[];
labels: string[];
oldImages: NgxGalleryImage[];
oldImagesLength: number;
selectedIndex: number;
isAnimating: boolean;
previewEnabled: boolean;
currentOptions: NgxGalleryOptions;
private breakpoint;
private prevBreakpoint;
private fullWidthTimeout;
readonly preview: _angular_core.Signal<NgxGalleryPreviewComponent>;
readonly image: _angular_core.Signal<NgxGalleryImageComponent>;
readonly thumbnails: _angular_core.Signal<NgxGalleryThumbnailsComponent>;
width: string;
height: string;
left: string;
ngOnInit(): void;
ngDoCheck(): void;
ngAfterViewInit(): void;
onResize(): void;
getImageHeight(): string;
getThumbnailsHeight(): string;
getThumbnailsMarginTop(): string;
getThumbnailsMarginBottom(): string;
openPreview(index: number): void;
onPreviewOpen(): void;
onPreviewClose(): void;
selectFromImage(index: number): void;
selectFromThumbnails(index: number): void;
show(index: number): void;
showNext(): void;
showPrev(): void;
canShowNext(): boolean;
canShowPrev(): boolean;
previewSelect(index: number): void;
moveThumbnailsRight(): void;
moveThumbnailsLeft(): void;
canMoveThumbnailsRight(): boolean;
canMoveThumbnailsLeft(): boolean;
private resetThumbnails;
private select;
private checkFullWidth;
private setImages;
private setBreakpoint;
private sortOptions;
private setOptions;
private combineOptions;
setAnimating(event: boolean): void;
static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgxGalleryComponent, never>;
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgxGalleryComponent, "ngx-gallery", never, { "options": { "alias": "options"; "required": false; }; "images": { "alias": "images"; "required": false; "isSignal": true; }; }, { "imagesReady": "imagesReady"; "change": "change"; "previewOpen": "previewOpen"; "previewClose": "previewClose"; "previewChange": "previewChange"; }, never, never, true, never>;
}
declare class NgxGalleryArrowsComponent {
readonly prevDisabled: _angular_core.InputSignal<boolean>;
readonly nextDisabled: _angular_core.InputSignal<boolean>;
readonly arrowPrevIcon: _angular_core.InputSignal<string>;
readonly arrowNextIcon: _angular_core.InputSignal<string>;
readonly prevClick: _angular_core.OutputEmitterRef<void>;
readonly nextClick: _angular_core.OutputEmitterRef<void>;
constructor();
handlePrevClick(): void;
handleNextClick(): void;
static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgxGalleryArrowsComponent, never>;
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgxGalleryArrowsComponent, "ngx-gallery-arrows", never, { "prevDisabled": { "alias": "prevDisabled"; "required": false; "isSignal": true; }; "nextDisabled": { "alias": "nextDisabled"; "required": false; "isSignal": true; }; "arrowPrevIcon": { "alias": "arrowPrevIcon"; "required": false; "isSignal": true; }; "arrowNextIcon": { "alias": "arrowNextIcon"; "required": false; "isSignal": true; }; }, { "prevClick": "prevClick"; "nextClick": "nextClick"; }, never, never, true, never>;
}
declare class NgxGalleryActionComponent {
readonly icon: _angular_core.InputSignal<string>;
readonly disabled: _angular_core.InputSignal<boolean>;
readonly titleText: _angular_core.InputSignal<string>;
readonly closeClick: _angular_core.OutputEmitterRef<Event>;
constructor();
handleClick(event: Event): void;
static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgxGalleryActionComponent, never>;
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgxGalleryActionComponent, "ngx-gallery-action", never, { "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "titleText": { "alias": "titleText"; "required": false; "isSignal": true; }; }, { "closeClick": "closeClick"; }, never, never, true, never>;
}
declare class NgxGalleryBulletsComponent {
readonly count: _angular_core.InputSignal<number>;
readonly active: _angular_core.InputSignal<number>;
readonly bulletChange: _angular_core.OutputEmitterRef<number>;
constructor();
getBullets(): number[];
handleChange(event: Event, index: number): void;
static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgxGalleryBulletsComponent, never>;
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgxGalleryBulletsComponent, "ngx-gallery-bullets", never, { "count": { "alias": "count"; "required": false; "isSignal": true; }; "active": { "alias": "active"; "required": false; "isSignal": true; }; }, { "bulletChange": "bulletChange"; }, never, never, true, never>;
}
declare class CustomHammerConfig extends HammerGestureConfig {
overrides: any;
static ɵfac: _angular_core.ɵɵFactoryDeclaration<CustomHammerConfig, never>;
static ɵprov: _angular_core.ɵɵInjectableDeclaration<CustomHammerConfig>;
}
declare class NgxGalleryModule {
static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgxGalleryModule, never>;
static ɵmod: _angular_core.ɵɵNgModuleDeclaration<NgxGalleryModule, never, [typeof i1.CommonModule, typeof NgxGalleryComponent, typeof NgxGalleryImageComponent, typeof NgxGalleryArrowsComponent, typeof NgxGalleryThumbnailsComponent, typeof NgxGalleryPreviewComponent, typeof NgxGalleryActionComponent, typeof NgxGalleryBulletsComponent], [typeof NgxGalleryComponent]>;
static ɵinj: _angular_core.ɵɵInjectorDeclaration<NgxGalleryModule>;
}
declare class NgxGalleryAnimation {
static Fade: string;
static Slide: string;
static Rotate: string;
static Zoom: string;
}
declare class NgxGalleryImageSize {
static Cover: string;
static Contain: string;
}
declare class NgxGalleryLayout {
static ThumbnailsTop: string;
static ThumbnailsBottom: string;
}
declare class NgxGalleryOrder {
static Column: number;
static Row: number;
static Page: number;
}
export { CustomHammerConfig, NgxGalleryAction, NgxGalleryAnimation, NgxGalleryArrowsComponent, NgxGalleryBulletsComponent, NgxGalleryComponent, NgxGalleryImage, NgxGalleryImageSize, NgxGalleryLayout, NgxGalleryModule, NgxGalleryOptions, NgxGalleryOrder, NgxGalleryOrderedImage, NgxGalleryPreviewComponent, NgxGalleryService, NgxGalleryThumbnailsComponent };
export type { INgxGalleryAction, INgxGalleryImage, INgxGalleryOptions, INgxGalleryOrderedImage };