{"version":3,"file":"primeng-carousel.mjs","sources":["../../src/carousel/style/carouselstyle.ts","../../src/carousel/carousel.ts","../../src/carousel/primeng-carousel.ts"],"sourcesContent":["import { Injectable } from '@angular/core';\nimport { style } from '@primeuix/styles/carousel';\nimport { BaseStyle } from 'primeng/base';\n\nconst classes = {\n root: ({ instance }) => [\n 'p-carousel p-component',\n {\n 'p-carousel-vertical': instance.isVertical(),\n 'p-carousel-horizontal': !instance.isVertical()\n }\n ],\n header: 'p-carousel-header',\n contentContainer: 'p-carousel-content-container',\n content: 'p-carousel-content',\n pcPrevButton: ({ instance }) => [\n 'p-carousel-prev-button',\n {\n 'p-disabled': instance.isBackwardNavDisabled()\n }\n ],\n viewport: 'p-carousel-viewport',\n itemList: 'p-carousel-item-list',\n itemClone: ({ instance, index }) => [\n 'p-carousel-item p-carousel-item-clone',\n {\n 'p-carousel-item-active': instance.totalShiftedItems * -1 === instance.value.length,\n 'p-carousel-item-start': 0 === index,\n 'p-carousel-item-end': instance.clonedItemsForStarting.length - 1 === index\n }\n ],\n item: ({ instance, index }) => [\n 'p-carousel-item',\n {\n 'p-carousel-item-active': instance.firstIndex() <= index && instance.lastIndex() >= index,\n 'p-carousel-item-start': instance.firstIndex() === index,\n 'p-carousel-item-end': instance.lastIndex() === index\n }\n ],\n pcNextButton: ({ instance }) => [\n 'p-carousel-next-button',\n {\n 'p-disabled': instance.isForwardNavDisabled()\n }\n ],\n indicatorList: ({ instance }) => ['p-carousel-indicator-list', instance.indicatorsContentClass],\n indicator: ({ instance, index }) => [\n 'p-carousel-indicator',\n {\n 'p-carousel-indicator-active': instance._page === index\n }\n ],\n indicatorButton: ({ instance }) => ['p-carousel-indicator-button', instance.indicatorStyleClass],\n footer: 'p-carousel-footer'\n};\n\n@Injectable()\nexport class CarouselStyle extends BaseStyle {\n name = 'carousel';\n\n style = style;\n\n classes = classes;\n}\n\n/**\n *\n * Carousel is a content slider featuring various customization options.\n *\n * [Live Demo](https://www.primeng.org/carousel/)\n *\n * @module carouselstyle\n *\n */\nexport enum CarouselClasses {\n /**\n * Class name of the root element\n */\n root = 'p-carousel',\n /**\n * Class name of the header element\n */\n header = 'p-carousel-header',\n /**\n * Class name of the content container element\n */\n contentContainer = 'p-carousel-content-container',\n /**\n * Class name of the content element\n */\n content = 'p-carousel-content',\n /**\n * Class name of the previous button element\n */\n pcPrevButton = 'p-carousel-prev-button',\n /**\n * Class name of the viewport element\n */\n viewport = 'p-carousel-viewport',\n /**\n * Class name of the item list element\n */\n itemList = 'p-carousel-item-list',\n /**\n * Class name of the item clone element\n */\n itemClone = 'p-carousel-item-clone',\n /**\n * Class name of the item element\n */\n item = 'p-carousel-item',\n /**\n * Class name of the next button element\n */\n pcNextButton = 'p-carousel-next-button',\n /**\n * Class name of the indicator list element\n */\n indicatorList = 'p-carousel-indicator-list',\n /**\n * Class name of the indicator element\n */\n indicator = 'p-carousel-indicator',\n /**\n * Class name of the indicator button element\n */\n indicatorButton = 'p-carousel-indicator-button',\n /**\n * Class name of the footer element\n */\n footer = 'p-carousel-footer'\n}\n\nexport interface CarouselStyle extends BaseStyle {}\n","import { CommonModule, isPlatformBrowser } from '@angular/common';\nimport {\n booleanAttribute,\n ChangeDetectionStrategy,\n Component,\n ContentChild,\n ContentChildren,\n ElementRef,\n EventEmitter,\n inject,\n Input,\n NgModule,\n NgZone,\n numberAttribute,\n Output,\n QueryList,\n SimpleChanges,\n TemplateRef,\n ViewChild,\n ViewEncapsulation\n} from '@angular/core';\nimport { addClass, find, findSingle, getAttribute, removeClass, setAttribute, uuid } from '@primeuix/utils';\nimport { Footer, Header, PrimeTemplate, SharedModule } from 'primeng/api';\nimport { BaseComponent, PARENT_INSTANCE } from 'primeng/basecomponent';\nimport { Bind, BindModule } from 'primeng/bind';\nimport { ButtonModule, ButtonProps } from 'primeng/button';\nimport { ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon } from 'primeng/icons';\nimport { CarouselItemTemplateContext, CarouselPageEvent, CarouselResponsiveOptions } from 'primeng/types/carousel';\nimport { CarouselStyle } from './style/carouselstyle';\n\n/**\n * Carousel is a content slider featuring various customization options.\n * @group Components\n */\n@Component({\n selector: 'p-carousel',\n standalone: true,\n imports: [CommonModule, ChevronRightIcon, ButtonModule, ChevronLeftIcon, ChevronDownIcon, ChevronUpIcon, SharedModule, BindModule],\n template: `\n \n \n \n
\n \n
\n
\n \n \n \n \n \n \n \n \n \n \n \n
\n
= index)\"\n [attr.aria-label]=\"ariaSlideNumber(index)\"\n [attr.aria-roledescription]=\"ariaSlideLabel()\"\n [attr.data-p-carousel-item-active]=\"firstIndex() <= index && lastIndex() >= index\"\n [attr.data-p-carousel-item-start]=\"firstIndex() === index\"\n [attr.data-p-carousel-item-end]=\"lastIndex() === index\"\n [pBind]=\"getItemPTOptions('item', index)\"\n >\n \n \n
\n \n \n
\n `,\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n providers: [CarouselStyle, { provide: PARENT_INSTANCE, useExisting: Carousel }],\n hostDirectives: [Bind],\n host: {\n '[attr.id]': 'id',\n '[attr.role]': \"'region'\",\n '[class]': \"cn(cx('root'), styleClass)\"\n }\n})\nexport class Carousel extends BaseComponent {\n componentName = 'Carousel';\n\n bindDirectiveInstance = inject(Bind, { self: true });\n\n onAfterViewChecked(): void {\n this.bindDirectiveInstance.setAttrs(this.ptm('root'));\n }\n\n /**\n * Index of the first item.\n * @defaultValue 0\n * @group Props\n */\n @Input() get page(): number {\n return this._page;\n }\n\n set page(val: number) {\n if (this.isCreated && val !== this._page) {\n if (this.autoplayInterval) {\n this.stopAutoplay();\n }\n\n if (val > this._page && val <= this.totalDots() - 1) {\n this.step(-1, val);\n } else if (val < this._page) {\n this.step(1, val);\n }\n }\n\n this._page = val;\n }\n\n /**\n * Number of items per page.\n * @defaultValue 1\n * @group Props\n */\n @Input() get numVisible(): number {\n return this._numVisible;\n }\n\n set numVisible(val: number) {\n this._numVisible = val;\n }\n\n /**\n * Number of items to scroll.\n * @defaultValue 1\n * @group Props\n */\n @Input() get numScroll(): number {\n return this._numVisible;\n }\n\n set numScroll(val: number) {\n this._numScroll = val;\n }\n\n /**\n * An array of options for responsive design.\n * @see {CarouselResponsiveOptions}\n * @group Props\n */\n @Input() responsiveOptions: CarouselResponsiveOptions[] | undefined;\n /**\n * Specifies the layout of the component.\n * @group Props\n */\n @Input() orientation: 'horizontal' | 'vertical' = 'horizontal';\n /**\n * Height of the viewport in vertical layout.\n * @group Props\n */\n @Input() verticalViewPortHeight: string = '300px';\n /**\n * Style class of main content.\n * @group Props\n */\n @Input() contentClass: string = '';\n /**\n * Style class of the indicator items.\n * @group Props\n */\n @Input() indicatorsContentClass: string = '';\n /**\n * Inline style of the indicator items.\n * @group Props\n */\n @Input() indicatorsContentStyle: { [klass: string]: any } | null | undefined;\n /**\n * Style class of the indicators.\n * @group Props\n */\n @Input() indicatorStyleClass: string = '';\n /**\n * Style of the indicators.\n * @group Props\n */\n @Input() indicatorStyle: { [klass: string]: any } | null | undefined;\n\n /**\n * An array of objects to display.\n * @defaultValue null\n * @group Props\n */\n @Input() get value(): any[] {\n return this._value as any[];\n }\n\n set value(val) {\n this._value = val;\n }\n\n /**\n * Defines if scrolling would be infinite.\n * @group Props\n */\n @Input({ transform: booleanAttribute }) circular: boolean = false;\n /**\n * Whether to display indicator container.\n * @group Props\n */\n @Input({ transform: booleanAttribute }) showIndicators: boolean = true;\n /**\n * Whether to display navigation buttons in container.\n * @group Props\n */\n @Input({ transform: booleanAttribute }) showNavigators: boolean = true;\n /**\n * Time in milliseconds to scroll items automatically.\n * @group Props\n */\n @Input({ transform: numberAttribute }) autoplayInterval: number = 0;\n /**\n * Style class of the viewport container.\n * @deprecated since v20.0.0, use `class` instead.\n * @group Props\n */\n @Input() styleClass: string | undefined;\n /**\n * Used to pass all properties of the ButtonProps to the Button component.\n * @group Props\n */\n @Input() prevButtonProps: ButtonProps = {\n severity: 'secondary',\n text: true,\n rounded: true\n };\n /**\n * Used to pass all properties of the ButtonProps to the Button component.\n * @group Props\n */\n @Input() nextButtonProps: ButtonProps = {\n severity: 'secondary',\n text: true,\n rounded: true\n };\n /**\n * Callback to invoke after scroll.\n * @param {CarouselPageEvent} event - Custom page event.\n * @group Emits\n */\n @Output() onPage: EventEmitter = new EventEmitter();\n\n @ViewChild('itemsContainer') itemsContainer: ElementRef | undefined;\n\n @ViewChild('indicatorContent') indicatorContent: ElementRef | undefined;\n\n @ContentChild(Header) headerFacet: QueryList | undefined;\n\n @ContentChild(Footer) footerFacet: QueryList