397 lines
18 KiB
TypeScript
397 lines
18 KiB
TypeScript
|
import { AnimationEvent } from '@angular/animations';
|
||
|
import { AfterContentChecked, AfterViewInit, ChangeDetectorRef, DoCheck, ElementRef, EventEmitter, KeyValueDiffers, OnChanges, OnDestroy, OnInit, QueryList, Renderer2, SimpleChanges, TemplateRef } from '@angular/core';
|
||
|
import { PrimeNGConfig, PrimeTemplate } from 'primeng/api';
|
||
|
import { VoidListener } from 'primeng/ts-helpers';
|
||
|
import { GalleriaResponsiveOptions } from './galleria.interface';
|
||
|
import * as i0 from "@angular/core";
|
||
|
import * as i1 from "@angular/common";
|
||
|
import * as i2 from "primeng/api";
|
||
|
import * as i3 from "primeng/ripple";
|
||
|
import * as i4 from "primeng/icons/times";
|
||
|
import * as i5 from "primeng/icons/chevronright";
|
||
|
import * as i6 from "primeng/icons/chevronleft";
|
||
|
import * as i7 from "primeng/icons/windowmaximize";
|
||
|
import * as i8 from "primeng/icons/windowminimize";
|
||
|
import * as i9 from "primeng/focustrap";
|
||
|
/**
|
||
|
* Galleria is an advanced content gallery component.
|
||
|
* @group Components
|
||
|
*/
|
||
|
export declare class Galleria implements OnChanges, OnDestroy {
|
||
|
private document;
|
||
|
platformId: any;
|
||
|
element: ElementRef;
|
||
|
cd: ChangeDetectorRef;
|
||
|
config: PrimeNGConfig;
|
||
|
/**
|
||
|
* Index of the first item.
|
||
|
* @group Props
|
||
|
*/
|
||
|
get activeIndex(): number;
|
||
|
set activeIndex(activeIndex: number);
|
||
|
/**
|
||
|
* Whether to display the component on fullscreen.
|
||
|
* @group Props
|
||
|
*/
|
||
|
fullScreen: boolean;
|
||
|
/**
|
||
|
* Unique identifier of the element.
|
||
|
* @group Props
|
||
|
*/
|
||
|
id: string | undefined;
|
||
|
/**
|
||
|
* An array of objects to display.
|
||
|
* @group Props
|
||
|
*/
|
||
|
value: any[] | undefined;
|
||
|
/**
|
||
|
* Number of items per page.
|
||
|
* @group Props
|
||
|
*/
|
||
|
numVisible: number;
|
||
|
/**
|
||
|
* An array of options for responsive design.
|
||
|
* @see {GalleriaResponsiveOptions}
|
||
|
* @group Props
|
||
|
*/
|
||
|
responsiveOptions: GalleriaResponsiveOptions[] | undefined;
|
||
|
/**
|
||
|
* Whether to display navigation buttons in item section.
|
||
|
* @group Props
|
||
|
*/
|
||
|
showItemNavigators: boolean;
|
||
|
/**
|
||
|
* Whether to display navigation buttons in thumbnail container.
|
||
|
* @group Props
|
||
|
*/
|
||
|
showThumbnailNavigators: boolean;
|
||
|
/**
|
||
|
* Whether to display navigation buttons on item hover.
|
||
|
* @group Props
|
||
|
*/
|
||
|
showItemNavigatorsOnHover: boolean;
|
||
|
/**
|
||
|
* When enabled, item is changed on indicator hover.
|
||
|
* @group Props
|
||
|
*/
|
||
|
changeItemOnIndicatorHover: boolean;
|
||
|
/**
|
||
|
* Defines if scrolling would be infinite.
|
||
|
* @group Props
|
||
|
*/
|
||
|
circular: boolean;
|
||
|
/**
|
||
|
* Items are displayed with a slideshow in autoPlay mode.
|
||
|
* @group Props
|
||
|
*/
|
||
|
autoPlay: boolean;
|
||
|
/**
|
||
|
* When enabled, autorun should stop by click.
|
||
|
* @group Props
|
||
|
*/
|
||
|
shouldStopAutoplayByClick: boolean;
|
||
|
/**
|
||
|
* Time in milliseconds to scroll items.
|
||
|
* @group Props
|
||
|
*/
|
||
|
transitionInterval: number;
|
||
|
/**
|
||
|
* Whether to display thumbnail container.
|
||
|
* @group Props
|
||
|
*/
|
||
|
showThumbnails: boolean;
|
||
|
/**
|
||
|
* Position of thumbnails.
|
||
|
* @group Props
|
||
|
*/
|
||
|
thumbnailsPosition: 'bottom' | 'top' | 'left' | 'right' | undefined;
|
||
|
/**
|
||
|
* Height of the viewport in vertical thumbnail.
|
||
|
* @group Props
|
||
|
*/
|
||
|
verticalThumbnailViewPortHeight: string;
|
||
|
/**
|
||
|
* Whether to display indicator container.
|
||
|
* @group Props
|
||
|
*/
|
||
|
showIndicators: boolean;
|
||
|
/**
|
||
|
* When enabled, indicator container is displayed on item container.
|
||
|
* @group Props
|
||
|
*/
|
||
|
showIndicatorsOnItem: boolean;
|
||
|
/**
|
||
|
* Position of indicators.
|
||
|
* @group Props
|
||
|
*/
|
||
|
indicatorsPosition: 'bottom' | 'top' | 'left' | 'right' | undefined;
|
||
|
/**
|
||
|
* Base zIndex value to use in layering.
|
||
|
* @group Props
|
||
|
*/
|
||
|
baseZIndex: number;
|
||
|
/**
|
||
|
* Style class of the mask on fullscreen mode.
|
||
|
* @group Props
|
||
|
*/
|
||
|
maskClass: string | undefined;
|
||
|
/**
|
||
|
* Style class of the component on fullscreen mode. Otherwise, the 'class' property can be used.
|
||
|
* @group Props
|
||
|
*/
|
||
|
containerClass: string | undefined;
|
||
|
/**
|
||
|
* Inline style of the component on fullscreen mode. Otherwise, the 'style' property can be used.
|
||
|
* @group Props
|
||
|
*/
|
||
|
containerStyle: {
|
||
|
[klass: string]: any;
|
||
|
} | null | undefined;
|
||
|
/**
|
||
|
* Transition options of the show animation.
|
||
|
* @group Props
|
||
|
*/
|
||
|
showTransitionOptions: string;
|
||
|
/**
|
||
|
* Transition options of the hide animation.
|
||
|
* @group Props
|
||
|
*/
|
||
|
hideTransitionOptions: string;
|
||
|
/**
|
||
|
* Specifies the visibility of the mask on fullscreen mode.
|
||
|
* @group Props
|
||
|
*/
|
||
|
get visible(): boolean;
|
||
|
set visible(visible: boolean);
|
||
|
/**
|
||
|
* Callback to invoke on active index change.
|
||
|
* @param {number} number - Active index.
|
||
|
* @group Emits
|
||
|
*/
|
||
|
activeIndexChange: EventEmitter<number>;
|
||
|
/**
|
||
|
* Callback to invoke on visiblity change.
|
||
|
* @param {boolean} boolean - Visible value.
|
||
|
* @group Emits
|
||
|
*/
|
||
|
visibleChange: EventEmitter<boolean>;
|
||
|
mask: ElementRef | undefined;
|
||
|
container: ElementRef | undefined;
|
||
|
templates: QueryList<PrimeTemplate> | undefined;
|
||
|
_visible: boolean;
|
||
|
_activeIndex: number;
|
||
|
headerFacet: any;
|
||
|
footerFacet: any;
|
||
|
indicatorFacet: any;
|
||
|
captionFacet: any;
|
||
|
closeIconTemplate: TemplateRef<any> | undefined;
|
||
|
previousThumbnailIconTemplate: TemplateRef<any> | undefined;
|
||
|
nextThumbnailIconTemplate: TemplateRef<any> | undefined;
|
||
|
itemPreviousIconTemplate: TemplateRef<any> | undefined;
|
||
|
itemNextIconTemplate: TemplateRef<any> | undefined;
|
||
|
maskVisible: boolean;
|
||
|
numVisibleLimit: number;
|
||
|
constructor(document: Document, platformId: any, element: ElementRef, cd: ChangeDetectorRef, config: PrimeNGConfig);
|
||
|
ngAfterContentInit(): void;
|
||
|
ngOnChanges(simpleChanges: SimpleChanges): void;
|
||
|
onMaskHide(): void;
|
||
|
onActiveItemChange(index: number): void;
|
||
|
onAnimationStart(event: AnimationEvent): void;
|
||
|
onAnimationEnd(event: AnimationEvent): void;
|
||
|
enableModality(): void;
|
||
|
disableModality(): void;
|
||
|
ngOnDestroy(): void;
|
||
|
static ɵfac: i0.ɵɵFactoryDeclaration<Galleria, never>;
|
||
|
static ɵcmp: i0.ɵɵComponentDeclaration<Galleria, "p-galleria", never, { "activeIndex": { "alias": "activeIndex"; "required": false; }; "fullScreen": { "alias": "fullScreen"; "required": false; }; "id": { "alias": "id"; "required": false; }; "value": { "alias": "value"; "required": false; }; "numVisible": { "alias": "numVisible"; "required": false; }; "responsiveOptions": { "alias": "responsiveOptions"; "required": false; }; "showItemNavigators": { "alias": "showItemNavigators"; "required": false; }; "showThumbnailNavigators": { "alias": "showThumbnailNavigators"; "required": false; }; "showItemNavigatorsOnHover": { "alias": "showItemNavigatorsOnHover"; "required": false; }; "changeItemOnIndicatorHover": { "alias": "changeItemOnIndicatorHover"; "required": false; }; "circular": { "alias": "circular"; "required": false; }; "autoPlay": { "alias": "autoPlay"; "required": false; }; "shouldStopAutoplayByClick": { "alias": "shouldStopAutoplayByClick"; "required": false; }; "transitionInterval": { "alias": "transitionInterval"; "required": false; }; "showThumbnails": { "alias": "showThumbnails"; "required": false; }; "thumbnailsPosition": { "alias": "thumbnailsPosition"; "required": false; }; "verticalThumbnailViewPortHeight": { "alias": "verticalThumbnailViewPortHeight"; "required": false; }; "showIndicators": { "alias": "showIndicators"; "required": false; }; "showIndicatorsOnItem": { "alias": "showIndicatorsOnItem"; "required": false; }; "indicatorsPosition": { "alias": "indicatorsPosition"; "required": false; }; "baseZIndex": { "alias": "baseZIndex"; "required": false; }; "maskClass": { "alias": "maskClass"; "required": false; }; "containerClass": { "alias": "containerClass"; "required": false; }; "containerStyle": { "alias": "containerStyle"; "required": false; }; "showTransitionOptions": { "alias": "showTransitionOptions"; "required": false; }; "hideTransitionOptions": { "alias": "hideTransitionOptions"; "required": false; }; "visible": { "alias": "visible"; "required": false; }; }, { "activeIndexChange": "activeIndexChange"; "visibleChange": "visibleChange"; }, ["templates"], never, false, never>;
|
||
|
static ngAcceptInputType_fullScreen: unknown;
|
||
|
static ngAcceptInputType_numVisible: unknown;
|
||
|
static ngAcceptInputType_showItemNavigators: unknown;
|
||
|
static ngAcceptInputType_showThumbnailNavigators: unknown;
|
||
|
static ngAcceptInputType_showItemNavigatorsOnHover: unknown;
|
||
|
static ngAcceptInputType_changeItemOnIndicatorHover: unknown;
|
||
|
static ngAcceptInputType_circular: unknown;
|
||
|
static ngAcceptInputType_autoPlay: unknown;
|
||
|
static ngAcceptInputType_shouldStopAutoplayByClick: unknown;
|
||
|
static ngAcceptInputType_transitionInterval: unknown;
|
||
|
static ngAcceptInputType_showThumbnails: unknown;
|
||
|
static ngAcceptInputType_showIndicators: unknown;
|
||
|
static ngAcceptInputType_showIndicatorsOnItem: unknown;
|
||
|
static ngAcceptInputType_baseZIndex: unknown;
|
||
|
}
|
||
|
export declare class GalleriaContent implements DoCheck {
|
||
|
galleria: Galleria;
|
||
|
cd: ChangeDetectorRef;
|
||
|
private differs;
|
||
|
config: PrimeNGConfig;
|
||
|
get activeIndex(): number;
|
||
|
set activeIndex(activeIndex: number);
|
||
|
value: any[];
|
||
|
numVisible: number | undefined;
|
||
|
maskHide: EventEmitter<boolean>;
|
||
|
activeItemChange: EventEmitter<number>;
|
||
|
closeButton: ElementRef | undefined;
|
||
|
id: string;
|
||
|
_activeIndex: number;
|
||
|
slideShowActive: boolean;
|
||
|
interval: any;
|
||
|
styleClass: string | undefined;
|
||
|
private differ;
|
||
|
constructor(galleria: Galleria, cd: ChangeDetectorRef, differs: KeyValueDiffers, config: PrimeNGConfig);
|
||
|
ngDoCheck(): void;
|
||
|
galleriaClass(): string;
|
||
|
startSlideShow(): void;
|
||
|
stopSlideShow(): void;
|
||
|
getPositionClass(preClassName: string, position: string): string;
|
||
|
isVertical(): boolean;
|
||
|
onActiveIndexChange(index: number): void;
|
||
|
closeAriaLabel(): string;
|
||
|
static ɵfac: i0.ɵɵFactoryDeclaration<GalleriaContent, never>;
|
||
|
static ɵcmp: i0.ɵɵComponentDeclaration<GalleriaContent, "p-galleriaContent", never, { "activeIndex": { "alias": "activeIndex"; "required": false; }; "value": { "alias": "value"; "required": false; }; "numVisible": { "alias": "numVisible"; "required": false; }; }, { "maskHide": "maskHide"; "activeItemChange": "activeItemChange"; }, never, never, false, never>;
|
||
|
static ngAcceptInputType_numVisible: unknown;
|
||
|
}
|
||
|
export declare class GalleriaItemSlot {
|
||
|
templates: QueryList<PrimeTemplate> | undefined;
|
||
|
index: number | undefined;
|
||
|
get item(): any;
|
||
|
set item(item: any);
|
||
|
type: string | undefined;
|
||
|
contentTemplate: TemplateRef<any> | undefined;
|
||
|
context: any;
|
||
|
_item: any;
|
||
|
ngAfterContentInit(): void;
|
||
|
static ɵfac: i0.ɵɵFactoryDeclaration<GalleriaItemSlot, never>;
|
||
|
static ɵcmp: i0.ɵɵComponentDeclaration<GalleriaItemSlot, "p-galleriaItemSlot", never, { "templates": { "alias": "templates"; "required": false; }; "index": { "alias": "index"; "required": false; }; "item": { "alias": "item"; "required": false; }; "type": { "alias": "type"; "required": false; }; }, {}, never, never, false, never>;
|
||
|
static ngAcceptInputType_index: unknown;
|
||
|
}
|
||
|
export declare class GalleriaItem implements OnChanges {
|
||
|
galleria: Galleria;
|
||
|
id: string | undefined;
|
||
|
circular: boolean;
|
||
|
value: any[] | undefined;
|
||
|
showItemNavigators: boolean;
|
||
|
showIndicators: boolean;
|
||
|
slideShowActive: boolean;
|
||
|
changeItemOnIndicatorHover: boolean;
|
||
|
autoPlay: boolean;
|
||
|
templates: QueryList<PrimeTemplate> | undefined;
|
||
|
indicatorFacet: any;
|
||
|
captionFacet: any;
|
||
|
startSlideShow: EventEmitter<Event>;
|
||
|
stopSlideShow: EventEmitter<Event>;
|
||
|
onActiveIndexChange: EventEmitter<number>;
|
||
|
get activeIndex(): number;
|
||
|
set activeIndex(activeIndex: number);
|
||
|
get activeItem(): any;
|
||
|
_activeIndex: number;
|
||
|
constructor(galleria: Galleria);
|
||
|
ngOnChanges({ autoPlay }: SimpleChanges): void;
|
||
|
next(): void;
|
||
|
prev(): void;
|
||
|
stopTheSlideShow(): void;
|
||
|
navForward(e: MouseEvent): void;
|
||
|
navBackward(e: MouseEvent): void;
|
||
|
onIndicatorClick(index: number): void;
|
||
|
onIndicatorMouseEnter(index: number): void;
|
||
|
onIndicatorKeyDown(event: any, index: number): void;
|
||
|
isNavForwardDisabled(): boolean;
|
||
|
isNavBackwardDisabled(): boolean;
|
||
|
isIndicatorItemActive(index: number): boolean;
|
||
|
ariaSlideLabel(): string;
|
||
|
ariaSlideNumber(value: any): string;
|
||
|
ariaPageLabel(value: any): string;
|
||
|
static ɵfac: i0.ɵɵFactoryDeclaration<GalleriaItem, never>;
|
||
|
static ɵcmp: i0.ɵɵComponentDeclaration<GalleriaItem, "p-galleriaItem", never, { "id": { "alias": "id"; "required": false; }; "circular": { "alias": "circular"; "required": false; }; "value": { "alias": "value"; "required": false; }; "showItemNavigators": { "alias": "showItemNavigators"; "required": false; }; "showIndicators": { "alias": "showIndicators"; "required": false; }; "slideShowActive": { "alias": "slideShowActive"; "required": false; }; "changeItemOnIndicatorHover": { "alias": "changeItemOnIndicatorHover"; "required": false; }; "autoPlay": { "alias": "autoPlay"; "required": false; }; "templates": { "alias": "templates"; "required": false; }; "indicatorFacet": { "alias": "indicatorFacet"; "required": false; }; "captionFacet": { "alias": "captionFacet"; "required": false; }; "activeIndex": { "alias": "activeIndex"; "required": false; }; }, { "startSlideShow": "startSlideShow"; "stopSlideShow": "stopSlideShow"; "onActiveIndexChange": "onActiveIndexChange"; }, never, never, false, never>;
|
||
|
static ngAcceptInputType_circular: unknown;
|
||
|
static ngAcceptInputType_showItemNavigators: unknown;
|
||
|
static ngAcceptInputType_showIndicators: unknown;
|
||
|
static ngAcceptInputType_slideShowActive: unknown;
|
||
|
static ngAcceptInputType_changeItemOnIndicatorHover: unknown;
|
||
|
static ngAcceptInputType_autoPlay: unknown;
|
||
|
}
|
||
|
export declare class GalleriaThumbnails implements OnInit, AfterContentChecked, AfterViewInit, OnDestroy {
|
||
|
galleria: Galleria;
|
||
|
private document;
|
||
|
private platformId;
|
||
|
private renderer;
|
||
|
private cd;
|
||
|
containerId: string | undefined;
|
||
|
value: any[] | undefined;
|
||
|
isVertical: boolean;
|
||
|
slideShowActive: boolean;
|
||
|
circular: boolean;
|
||
|
responsiveOptions: GalleriaResponsiveOptions[] | undefined;
|
||
|
contentHeight: string;
|
||
|
showThumbnailNavigators: boolean;
|
||
|
templates: QueryList<PrimeTemplate> | undefined;
|
||
|
onActiveIndexChange: EventEmitter<number>;
|
||
|
stopSlideShow: EventEmitter<Event>;
|
||
|
itemsContainer: ElementRef | undefined;
|
||
|
get numVisible(): number;
|
||
|
set numVisible(numVisible: number);
|
||
|
get activeIndex(): number;
|
||
|
set activeIndex(activeIndex: number);
|
||
|
index: number | undefined;
|
||
|
startPos: {
|
||
|
x: number;
|
||
|
y: number;
|
||
|
} | null;
|
||
|
thumbnailsStyle: HTMLStyleElement | null;
|
||
|
sortedResponsiveOptions: GalleriaResponsiveOptions[] | null;
|
||
|
totalShiftedItems: number;
|
||
|
page: number;
|
||
|
documentResizeListener: VoidListener;
|
||
|
_numVisible: number;
|
||
|
d_numVisible: number;
|
||
|
_oldNumVisible: number;
|
||
|
_activeIndex: number;
|
||
|
_oldactiveIndex: number;
|
||
|
constructor(galleria: Galleria, document: Document, platformId: any, renderer: Renderer2, cd: ChangeDetectorRef);
|
||
|
ngOnInit(): void;
|
||
|
ngAfterContentChecked(): void;
|
||
|
ngAfterViewInit(): void;
|
||
|
createStyle(): void;
|
||
|
calculatePosition(): void;
|
||
|
getTabIndex(index: number): number;
|
||
|
navForward(e: TouchEvent | MouseEvent): void;
|
||
|
navBackward(e: TouchEvent | MouseEvent): void;
|
||
|
onItemClick(index: number): void;
|
||
|
onThumbnailKeydown(event: KeyboardEvent, index: number): void;
|
||
|
onRightKey(): void;
|
||
|
onLeftKey(): void;
|
||
|
onHomeKey(): void;
|
||
|
onEndKey(): void;
|
||
|
onTabKey(): void;
|
||
|
findFocusedIndicatorIndex(): number;
|
||
|
changedFocusedIndicator(prevInd: any, nextInd: any): void;
|
||
|
step(dir: number): void;
|
||
|
stopTheSlideShow(): void;
|
||
|
changePageOnTouch(e: TouchEvent, diff: number): void;
|
||
|
getTotalPageNumber(): number;
|
||
|
getMedianItemIndex(): number;
|
||
|
onTransitionEnd(): void;
|
||
|
onTouchEnd(e: TouchEvent): void;
|
||
|
onTouchMove(e: TouchEvent): void;
|
||
|
onTouchStart(e: TouchEvent): void;
|
||
|
isNavBackwardDisabled(): boolean;
|
||
|
isNavForwardDisabled(): boolean;
|
||
|
firstItemAciveIndex(): number;
|
||
|
lastItemActiveIndex(): number;
|
||
|
isItemActive(index: number): boolean;
|
||
|
bindDocumentListeners(): void;
|
||
|
unbindDocumentListeners(): void;
|
||
|
ngOnDestroy(): void;
|
||
|
ariaPrevButtonLabel(): string;
|
||
|
ariaNextButtonLabel(): string;
|
||
|
ariaPageLabel(value: any): string;
|
||
|
static ɵfac: i0.ɵɵFactoryDeclaration<GalleriaThumbnails, never>;
|
||
|
static ɵcmp: i0.ɵɵComponentDeclaration<GalleriaThumbnails, "p-galleriaThumbnails", never, { "containerId": { "alias": "containerId"; "required": false; }; "value": { "alias": "value"; "required": false; }; "isVertical": { "alias": "isVertical"; "required": false; }; "slideShowActive": { "alias": "slideShowActive"; "required": false; }; "circular": { "alias": "circular"; "required": false; }; "responsiveOptions": { "alias": "responsiveOptions"; "required": false; }; "contentHeight": { "alias": "contentHeight"; "required": false; }; "showThumbnailNavigators": { "alias": "showThumbnailNavigators"; "required": false; }; "templates": { "alias": "templates"; "required": false; }; "numVisible": { "alias": "numVisible"; "required": false; }; "activeIndex": { "alias": "activeIndex"; "required": false; }; }, { "onActiveIndexChange": "onActiveIndexChange"; "stopSlideShow": "stopSlideShow"; }, never, never, false, never>;
|
||
|
static ngAcceptInputType_isVertical: unknown;
|
||
|
static ngAcceptInputType_slideShowActive: unknown;
|
||
|
static ngAcceptInputType_circular: unknown;
|
||
|
}
|
||
|
export declare class GalleriaModule {
|
||
|
static ɵfac: i0.ɵɵFactoryDeclaration<GalleriaModule, never>;
|
||
|
static ɵmod: i0.ɵɵNgModuleDeclaration<GalleriaModule, [typeof Galleria, typeof GalleriaContent, typeof GalleriaItemSlot, typeof GalleriaItem, typeof GalleriaThumbnails], [typeof i1.CommonModule, typeof i2.SharedModule, typeof i3.RippleModule, typeof i4.TimesIcon, typeof i5.ChevronRightIcon, typeof i6.ChevronLeftIcon, typeof i7.WindowMaximizeIcon, typeof i8.WindowMinimizeIcon, typeof i9.FocusTrapModule], [typeof i1.CommonModule, typeof Galleria, typeof GalleriaContent, typeof GalleriaItemSlot, typeof GalleriaItem, typeof GalleriaThumbnails, typeof i2.SharedModule]>;
|
||
|
static ɵinj: i0.ɵɵInjectorDeclaration<GalleriaModule>;
|
||
|
}
|