UNPKG

ng-smooth-carousel

Version:

A smooth, customizable carousel component for Angular 14 applications

237 lines (236 loc) 7.65 kB
import { TemplateRef, ElementRef, AfterViewInit, OnDestroy, ChangeDetectorRef, OnInit, NgZone, OnChanges, SimpleChanges } from '@angular/core'; import { CarouselConfig } from './carousel-config.interface'; import * as i0 from "@angular/core"; /** * NgSmoothCarousel Component * * A carousel/slider component for Angular applications with smooth scrolling capabilities. * Supports both horizontal and vertical orientations, custom navigation styling, * and multiple configuration options. */ export declare class CarouselComponent implements OnInit, AfterViewInit, OnDestroy, OnChanges { private readonly cdr; private readonly ngZone; items: any[]; config: CarouselConfig; itemTemplate: TemplateRef<any>; emptyStateTemplate: TemplateRef<any>; trackElement: ElementRef<HTMLElement>; wrapperElement: ElementRef<HTMLElement>; searchInput: ElementRef<HTMLInputElement>; private currentTranslate; private currentIndex; private destroy$; private autoplayInterval?; private itemWidths; private itemHeights; private containerWidth; private containerHeight; private intersectionObserver; private resizeObserver; private visibilityChangeTimeout; private initialized; private readonly scrollSizeMap; showPrevButton: boolean; showNextButton: boolean; searchQuery: string; isSearchModalOpen: boolean; filteredItems: any[]; constructor(cdr: ChangeDetectorRef, ngZone: NgZone); /** * @description Initialize component on init */ ngOnInit(): void; /** * @description Handle changes to inputs */ ngOnChanges(changes: SimpleChanges): void; /** * @description Convert time string to milliseconds */ private parseTimeToMs; /** * @description Setup autoplay functionality if enabled */ private setupAutoplay; /** * @description Initialize component after view is initialized */ ngAfterViewInit(): void; /** * @description Clean up resources on component destruction */ ngOnDestroy(): void; /** * @description Whether carousel orientation is vertical */ get isVertical(): boolean; /** * @description Get container styles based on configuration */ get containerStyles(): Record<string, string>; /** * @description Get track styles including transform property for translation */ get trackStyles(): Record<string, string>; /** * @description Initialize carousel state */ private initializeCarousel; private setupResizeListener; private setupIntersectionObserver; private setupResizeObserver; private updateContainerWidth; /** * @description Check if content overflows and update button visibility */ private checkOverflow; private calculateItemWidths; /** * @description Calculate scroll amount based on configuration */ private getScrollAmount; /** * @description Navigate to previous item */ previous(): void; /** * @description Navigate to next item */ next(): void; /** * @description Get button shape styles based on configuration */ private getButtonShapeStyles; /** * @description Get styles for next button */ get nextButtonStyles(): Record<string, any>; /** * @description Get styles for previous button */ get prevButtonStyles(): Record<string, any>; /** * @description Get styles for search button * @deprecated COMING SOON - Search functionality will be available in future releases */ /** * @description Get individual item styling */ getItemStyle(index: number): Record<string, string>; /** * @description Content padding for the carousel */ get contentPadding(): string; /** * @description Animation duration for scrolling */ get animationDuration(): string; /** * @description Animation timing function */ get animationTiming(): string; /** * @description Whether search functionality is enabled * @deprecated COMING SOON - Search functionality will be available in future releases */ /** * @description Placeholder text for search input * @deprecated COMING SOON - Search functionality will be available in future releases */ /** * @description Title for search modal * @deprecated COMING SOON - Search functionality will be available in future releases */ /** * @description Styles for search modal * @deprecated COMING SOON - Search functionality will be available in future releases */ /** * @description Toggle search modal visibility * @deprecated COMING SOON - Search functionality will be available in future releases */ /** * @description Close search modal * @deprecated COMING SOON - Search functionality will be available in future releases */ /** * @description Apply search filter to items * @deprecated COMING SOON - Search functionality will be available in future releases */ /** * @description Handle clicks outside search modal * @deprecated COMING SOON - Search functionality will be available in future releases */ /** * @description Reset search and show all items * @deprecated COMING SOON - Search functionality will be available in future releases */ /** * @description Get navigation icons based on configuration */ private getNavigationIcons; /** * @description Previous button icon */ get prevIcon(): string; /** * @description Next button icon */ get nextIcon(): string; /** * @description Search button icon * @deprecated COMING SOON - Search functionality will be available in future releases */ /** * @description Next button icon styles */ get nextIconStyles(): Record<string, string>; /** * @description Previous button icon styles */ get prevIconStyles(): Record<string, string>; /** * @description Search button icon styles * @deprecated COMING SOON - Search functionality will be available in future releases */ /** * @description Whether navigation buttons should be shown */ get showNavigation(): boolean; /** * @description Get styles for empty state container */ getEmptyStateContainerStyle(): Record<string, string>; /** * @description Determines if carousel contains items */ hasItems(): boolean; /** * @description Default CTA position (fixed to bottom-right) * @deprecated Will be removed in future versions */ get ctaPosition(): string; /** * @description Get class for navigation controls container */ getNavControlsClass(): string; /** * @description Get styles for navigation controls container */ getNavControlsStyle(): Record<string, string>; /** * @description Calculate position styles for navigation buttons */ private getButtonPositionStyle; /** * @description Get full styles for previous button */ getPrevButtonFullStyles(): Record<string, any>; /** * @description Get full styles for next button */ getNextButtonFullStyles(): Record<string, any>; static ɵfac: i0.ɵɵFactoryDeclaration<CarouselComponent, never>; static ɵcmp: i0.ɵɵComponentDeclaration<CarouselComponent, "nsc", never, { "items": "items"; "config": "config"; }, {}, ["itemTemplate", "emptyStateTemplate"], never, false>; }