primevue 3.20.0 → 3.22.0

package/carousel/carousel.esm.js

@@ -1,6 +1,6 @@
-import { UniqueComponentId, DomHandler } from 'primevue/utils';
 import Ripple from 'primevue/ripple';
-import { resolveDirective, openBlock, createElementBlock, normalizeClass, renderSlot, createCommentVNode, createElementVNode, withDirectives, normalizeStyle, Fragment, renderList } from 'vue';
+import { DomHandler, UniqueComponentId } from 'primevue/utils';
+import { resolveDirective, openBlock, createElementBlock, normalizeClass, renderSlot, createCommentVNode, createElementVNode, withDirectives, mergeProps, normalizeStyle, Fragment, renderList } from 'vue';
 
 var script = {
     name: 'Carousel',
@@ -46,11 +46,19 @@ var script = {
         showIndicators: {
             type: Boolean,
             default: true
+        },
+        prevButtonProps: {
+            type: null,
+            default: null
+        },
+        nextButtonProps: {
+            type: null,
+            default: null
         }
     },
+    isRemainingItemsAdded: false,
     data() {
         return {
-            id: UniqueComponentId(),
             remainingItems: 0,
             d_numVisible: this.numVisible,
             d_numScroll: this.numScroll,
@@ -64,7 +72,6 @@ var script = {
             swipeThreshold: 20
         };
     },
-    isRemainingItemsAdded: false,
     watch: {
         page(newValue) {
             this.d_page = newValue;
@@ -87,6 +94,7 @@ var script = {
     mounted() {
         let stateChanged = false;
 
+        this.$el.setAttribute(this.attributeSelector, '');
         this.createStyle();
         this.calculatePosition();
 
@@ -358,6 +366,81 @@ var script = {
                 }
             }
         },
+        onIndicatorKeydown(event) {
+            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;
+            }
+        },
+        onRightKey() {
+            const indicators = [...DomHandler.find(this.$refs.indicatorContent, '.p-carousel-indicator')];
+            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 indicators = [...DomHandler.find(this.$refs.indicatorContent, '.p-carousel-indicator')];
+            const activeIndex = this.findFocusedIndicatorIndex();
+
+            this.changedFocusedIndicator(activeIndex, indicators.length - 1);
+        },
+        onTabKey() {
+            const indicators = [...DomHandler.find(this.$refs.indicatorContent, '.p-carousel-indicator')];
+            const highlightedIndex = indicators.findIndex((ind) => DomHandler.hasClass(ind, 'p-highlight'));
+
+            const activeIndicator = DomHandler.findSingle(this.$refs.indicatorContent, '.p-carousel-indicator > button[tabindex="0"]');
+            const activeIndex = indicators.findIndex((ind) => ind === activeIndicator.parentElement);
+
+            indicators[activeIndex].children[0].tabIndex = '-1';
+            indicators[highlightedIndex].children[0].tabIndex = '0';
+        },
+        findFocusedIndicatorIndex() {
+            const indicators = [...DomHandler.find(this.$refs.indicatorContent, '.p-carousel-indicator')];
+            const activeIndicator = DomHandler.findSingle(this.$refs.indicatorContent, '.p-carousel-indicator > button[tabindex="0"]');
+
+            return indicators.findIndex((ind) => ind === activeIndicator.parentElement);
+        },
+        changedFocusedIndicator(prevInd, nextInd) {
+            const indicators = [...DomHandler.find(this.$refs.indicatorContent, '.p-carousel-indicator')];
+
+            indicators[prevInd].children[0].tabIndex = '-1';
+            indicators[nextInd].children[0].tabIndex = '0';
+            indicators[nextInd].children[0].focus();
+        },
         bindDocumentListeners() {
             if (!this.documentResizeListener) {
                 this.documentResizeListener = (e) => {
@@ -395,10 +478,10 @@ var script = {
             }
 
             let innerHTML = `
-            #${this.id} .p-carousel-item {
-                flex: 1 0 ${100 / this.d_numVisible}%
-            }
-        `;
+                .p-carousel[${this.attributeSelector}] .p-carousel-item {
+                    flex: 1 0 ${100 / this.d_numVisible}%
+                }
+            `;
 
             if (this.responsiveOptions) {
                 let _responsiveOptions = [...this.responsiveOptions];
@@ -421,12 +504,12 @@ var script = {
                     let res = _responsiveOptions[i];
 
                     innerHTML += `
-                    @media screen and (max-width: ${res.breakpoint}) {
-                        #${this.id} .p-carousel-item {
-                            flex: 1 0 ${100 / res.numVisible}%
+                        @media screen and (max-width: ${res.breakpoint}) {
+                            .p-carousel[${this.attributeSelector}] .p-carousel-item {
+                                flex: 1 0 ${100 / res.numVisible}%
+                            }
                         }
-                    }
-                `;
+                    `;
                 }
             }
 
@@ -446,6 +529,12 @@ var script = {
         },
         lastIndex() {
             return this.firstIndex() + this.d_numVisible - 1;
+        },
+        ariaSlideNumber(value) {
+            return this.$primevue.config.locale.aria ? this.$primevue.config.locale.aria.slideNumber.replace(/{slideNumber}/g, value) : undefined;
+        },
+        ariaPageLabel(value) {
+            return this.$primevue.config.locale.aria ? this.$primevue.config.locale.aria.pageLabel.replace(/{page}/g, value) : undefined;
         }
     },
     computed: {
@@ -466,6 +555,18 @@ var script = {
         },
         indicatorsContentClasses() {
             return ['p-carousel-indicators p-reset', this.indicatorsContentClass];
+        },
+        ariaSlideLabel() {
+            return this.$primevue.config.locale.aria ? this.$primevue.config.locale.aria.slide : undefined;
+        },
+        ariaPrevButtonLabel() {
+            return this.$primevue.config.locale.aria ? this.$primevue.config.locale.aria.prevPageLabel : undefined;
+        },
+        ariaNextButtonLabel() {
+            return this.$primevue.config.locale.aria ? this.$primevue.config.locale.aria.nextPageLabel : undefined;
+        },
+        attributeSelector() {
+            return UniqueComponentId();
         }
     },
     directives: {
@@ -473,15 +574,16 @@ var script = {
     }
 };
 
-const _hoisted_1 = ["id"];
-const _hoisted_2 = {
+const _hoisted_1 = {
   key: 0,
   class: "p-carousel-header"
 };
-const _hoisted_3 = ["disabled"];
-const _hoisted_4 = ["disabled"];
-const _hoisted_5 = ["onClick"];
-const _hoisted_6 = {
+const _hoisted_2 = ["aria-live"];
+const _hoisted_3 = ["disabled", "aria-label"];
+const _hoisted_4 = ["aria-hidden", "aria-label", "aria-roledescription"];
+const _hoisted_5 = ["disabled", "aria-label"];
+const _hoisted_6 = ["tabindex", "aria-label", "aria-current", "onClick"];
+const _hoisted_7 = {
   key: 1,
   class: "p-carousel-footer"
 };
@@ -490,11 +592,11 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
   const _directive_ripple = resolveDirective("ripple");
 
   return (openBlock(), createElementBlock("div", {
-    id: $data.id,
-    class: normalizeClass(['p-carousel p-component', { 'p-carousel-vertical': $options.isVertical(), 'p-carousel-horizontal': !$options.isVertical() }])
+    class: normalizeClass(['p-carousel p-component', { 'p-carousel-vertical': $options.isVertical(), 'p-carousel-horizontal': !$options.isVertical() }]),
+    role: "region"
   }, [
     (_ctx.$slots.header)
-      ? (openBlock(), createElementBlock("div", _hoisted_2, [
+      ? (openBlock(), createElementBlock("div", _hoisted_1, [
           renderSlot(_ctx.$slots, "header")
         ]))
       : createCommentVNode("", true),
@@ -502,20 +604,22 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
       class: normalizeClass($options.contentClasses)
     }, [
       createElementVNode("div", {
-        class: normalizeClass($options.containerClasses)
+        class: normalizeClass($options.containerClasses),
+        "aria-live": $data.allowAutoplay ? 'polite' : 'off'
       }, [
         ($props.showNavigators)
-          ? withDirectives((openBlock(), createElementBlock("button", {
+          ? withDirectives((openBlock(), createElementBlock("button", mergeProps({
               key: 0,
-              class: normalizeClass(['p-carousel-prev p-link', { 'p-disabled': $options.backwardIsDisabled }]),
+              type: "button",
+              class: ['p-carousel-prev p-link', { 'p-disabled': $options.backwardIsDisabled }],
               disabled: $options.backwardIsDisabled,
-              onClick: _cache[0] || (_cache[0] = (...args) => ($options.navBackward && $options.navBackward(...args))),
-              type: "button"
-            }, [
+              "aria-label": $options.ariaPrevButtonLabel,
+              onClick: _cache[0] || (_cache[0] = (...args) => ($options.navBackward && $options.navBackward(...args)))
+            }, $props.prevButtonProps), [
               createElementVNode("span", {
                 class: normalizeClass(['p-carousel-prev-icon pi', { 'pi-chevron-left': !$options.isVertical(), 'pi-chevron-up': $options.isVertical() }])
               }, null, 2)
-            ], 10, _hoisted_3)), [
+            ], 16, _hoisted_3)), [
               [_directive_ripple]
             ])
           : createCommentVNode("", true),
@@ -550,13 +654,17 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
             (openBlock(true), createElementBlock(Fragment, null, renderList($props.value, (item, index) => {
               return (openBlock(), createElementBlock("div", {
                 key: index,
-                class: normalizeClass(['p-carousel-item', { 'p-carousel-item-active': $options.firstIndex() <= index && $options.lastIndex() >= index, 'p-carousel-item-start': $options.firstIndex() === index, 'p-carousel-item-end': $options.lastIndex() === index }])
+                class: normalizeClass(['p-carousel-item', { 'p-carousel-item-active': $options.firstIndex() <= index && $options.lastIndex() >= index, 'p-carousel-item-start': $options.firstIndex() === index, 'p-carousel-item-end': $options.lastIndex() === index }]),
+                role: "group",
+                "aria-hidden": $options.firstIndex() > index || $options.lastIndex() < index ? true : undefined,
+                "aria-label": $options.ariaSlideNumber(index),
+                "aria-roledescription": $options.ariaSlideLabel
               }, [
                 renderSlot(_ctx.$slots, "item", {
                   data: item,
                   index: index
                 })
-              ], 2))
+              ], 10, _hoisted_4))
             }), 128)),
             ($options.isCircular())
               ? (openBlock(true), createElementBlock(Fragment, { key: 1 }, renderList($props.value.slice(0, $data.d_numVisible), (item, index) => {
@@ -574,25 +682,28 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
           ], 544)
         ], 36),
         ($props.showNavigators)
-          ? withDirectives((openBlock(), createElementBlock("button", {
+          ? withDirectives((openBlock(), createElementBlock("button", mergeProps({
               key: 1,
-              class: normalizeClass(['p-carousel-next p-link', { 'p-disabled': $options.forwardIsDisabled }]),
+              type: "button",
+              class: ['p-carousel-next p-link', { 'p-disabled': $options.forwardIsDisabled }],
               disabled: $options.forwardIsDisabled,
-              onClick: _cache[5] || (_cache[5] = (...args) => ($options.navForward && $options.navForward(...args))),
-              type: "button"
-            }, [
+              "aria-label": $options.ariaNextButtonLabel,
+              onClick: _cache[5] || (_cache[5] = (...args) => ($options.navForward && $options.navForward(...args)))
+            }, $props.nextButtonProps), [
               createElementVNode("span", {
                 class: normalizeClass(['p-carousel-prev-icon pi', { 'pi-chevron-right': !$options.isVertical(), 'pi-chevron-down': $options.isVertical() }])
               }, null, 2)
-            ], 10, _hoisted_4)), [
+            ], 16, _hoisted_5)), [
               [_directive_ripple]
             ])
           : createCommentVNode("", true)
-      ], 2),
+      ], 10, _hoisted_2),
       ($options.totalIndicators >= 0 && $props.showIndicators)
         ? (openBlock(), createElementBlock("ul", {
             key: 0,
-            class: normalizeClass($options.indicatorsContentClasses)
+            ref: "indicatorContent",
+            class: normalizeClass($options.indicatorsContentClasses),
+            onKeydown: _cache[6] || (_cache[6] = (...args) => ($options.onIndicatorKeydown && $options.onIndicatorKeydown(...args)))
           }, [
             (openBlock(true), createElementBlock(Fragment, null, renderList($options.totalIndicators, (indicator, i) => {
               return (openBlock(), createElementBlock("li", {
@@ -601,20 +712,23 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
               }, [
                 createElementVNode("button", {
                   class: "p-link",
-                  onClick: $event => ($options.onIndicatorClick($event, i)),
-                  type: "button"
-                }, null, 8, _hoisted_5)
+                  type: "button",
+                  tabindex: $data.d_page === i ? '0' : '-1',
+                  "aria-label": $options.ariaPageLabel(i + 1),
+                  "aria-current": $data.d_page === i ? 'page' : undefined,
+                  onClick: $event => ($options.onIndicatorClick($event, i))
+                }, null, 8, _hoisted_6)
               ], 2))
             }), 128))
-          ], 2))
+          ], 34))
         : createCommentVNode("", true)
     ], 2),
     (_ctx.$slots.footer)
-      ? (openBlock(), createElementBlock("div", _hoisted_6, [
+      ? (openBlock(), createElementBlock("div", _hoisted_7, [
           renderSlot(_ctx.$slots, "footer")
         ]))
       : createCommentVNode("", true)
-  ], 10, _hoisted_1))
+  ], 2))
 }
 
 function styleInject(css, ref) {
@@ -644,7 +758,7 @@ function styleInject(css, ref) {
   }
 }
 
-var css_248z = "\n.p-carousel {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-orient: vertical;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: column;\n            flex-direction: column;\n}\n.p-carousel-content {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-orient: vertical;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: column;\n            flex-direction: column;\n    overflow: auto;\n}\n.p-carousel-prev,\n.p-carousel-next {\n    -ms-flex-item-align: center;\n        align-self: center;\n    -webkit-box-flex: 0;\n        -ms-flex-positive: 0;\n            flex-grow: 0;\n    -ms-flex-negative: 0;\n        flex-shrink: 0;\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-pack: center;\n        -ms-flex-pack: center;\n            justify-content: center;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    overflow: hidden;\n    position: relative;\n}\n.p-carousel-container {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-orient: horizontal;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: row;\n            flex-direction: row;\n}\n.p-carousel-items-content {\n    overflow: hidden;\n    width: 100%;\n}\n.p-carousel-items-container {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-orient: horizontal;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: row;\n            flex-direction: row;\n}\n.p-carousel-indicators {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-orient: horizontal;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: row;\n            flex-direction: row;\n    -webkit-box-pack: center;\n        -ms-flex-pack: center;\n            justify-content: center;\n    -ms-flex-wrap: wrap;\n        flex-wrap: wrap;\n}\n.p-carousel-indicator > button {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    -webkit-box-pack: center;\n        -ms-flex-pack: center;\n            justify-content: center;\n}\n\n/* Vertical */\n.p-carousel-vertical .p-carousel-container {\n    -webkit-box-orient: vertical;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: column;\n            flex-direction: column;\n}\n.p-carousel-vertical .p-carousel-items-container {\n    -webkit-box-orient: vertical;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: column;\n            flex-direction: column;\n    height: 100%;\n}\n\n/* Keyboard Support */\n.p-items-hidden .p-carousel-item {\n    visibility: hidden;\n}\n.p-items-hidden .p-carousel-item.p-carousel-item-active {\n    visibility: visible;\n}\n";
+var css_248z = "\n.p-carousel {\n    display: flex;\n    flex-direction: column;\n}\n.p-carousel-content {\n    display: flex;\n    flex-direction: column;\n    overflow: auto;\n}\n.p-carousel-prev,\n.p-carousel-next {\n    align-self: center;\n    flex-grow: 0;\n    flex-shrink: 0;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    overflow: hidden;\n    position: relative;\n}\n.p-carousel-container {\n    display: flex;\n    flex-direction: row;\n}\n.p-carousel-items-content {\n    overflow: hidden;\n    width: 100%;\n}\n.p-carousel-items-container {\n    display: flex;\n    flex-direction: row;\n}\n.p-carousel-indicators {\n    display: flex;\n    flex-direction: row;\n    justify-content: center;\n    flex-wrap: wrap;\n}\n.p-carousel-indicator > button {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n}\n\n/* Vertical */\n.p-carousel-vertical .p-carousel-container {\n    flex-direction: column;\n}\n.p-carousel-vertical .p-carousel-items-container {\n    flex-direction: column;\n    height: 100%;\n}\n\n/* Keyboard Support */\n.p-items-hidden .p-carousel-item {\n    visibility: hidden;\n}\n.p-items-hidden .p-carousel-item.p-carousel-item-active {\n    visibility: visible;\n}\n";
 styleInject(css_248z);
 
 script.render = render;

package/carousel/carousel.esm.min.js

@@ -1 +1 @@
-import{UniqueComponentId as t,DomHandler as e}from"primevue/utils";import i from"primevue/ripple";import{resolveDirective as s,openBlock as n,createElementBlock as l,normalizeClass as a,renderSlot as o,createCommentVNode as r,createElementVNode as d,withDirectives as c,normalizeStyle as h,Fragment as u,renderList as m}from"vue";var p={name:"Carousel",emits:["update:page"],props:{value:null,page:{type:Number,default:0},numVisible:{type:Number,default:1},numScroll:{type:Number,default:1},responsiveOptions:Array,orientation:{type:String,default:"horizontal"},verticalViewPortHeight:{type:String,default:"300px"},contentClass:String,containerClass:String,indicatorsContentClass:String,circular:{type:Boolean,default:!1},autoplayInterval:{type:Number,default:0},showNavigators:{type:Boolean,default:!0},showIndicators:{type:Boolean,default:!0}},data(){return{id:t(),remainingItems:0,d_numVisible:this.numVisible,d_numScroll:this.numScroll,d_oldNumScroll:0,d_oldNumVisible:0,d_oldValue:null,d_page:this.page,totalShiftedItems:this.page*this.numScroll*-1,allowAutoplay:!!this.autoplayInterval,d_circular:this.circular||this.allowAutoplay,swipeThreshold:20}},isRemainingItemsAdded:!1,watch:{page(t){this.d_page=t},circular(t){this.d_circular=t},numVisible(t,e){this.d_numVisible=t,this.d_oldNumVisible=e},numScroll(t,e){this.d_oldNumScroll=e,this.d_numScroll=t},value(t){this.d_oldValue=t}},mounted(){let t=!1;if(this.createStyle(),this.calculatePosition(),this.responsiveOptions&&this.bindDocumentListeners(),this.isCircular()){let e=this.totalShiftedItems;0===this.d_page?e=-1*this.d_numVisible:0===e&&(e=-1*this.value.length,this.remainingItems>0&&(this.isRemainingItemsAdded=!0)),e!==this.totalShiftedItems&&(this.totalShiftedItems=e,t=!0)}!t&&this.isAutoplay()&&this.startAutoplay()},updated(){const t=this.isCircular();let e=!1,i=this.totalShiftedItems;if(this.autoplayInterval&&this.stopAutoplay(),this.d_oldNumScroll!==this.d_numScroll||this.d_oldNumVisible!==this.d_numVisible||this.d_oldValue.length!==this.value.length){this.remainingItems=(this.value.length-this.d_numVisible)%this.d_numScroll;let s=this.d_page;0!==this.totalIndicators&&s>=this.totalIndicators&&(s=this.totalIndicators-1,this.$emit("update:page",s),this.d_page=s,e=!0),i=s*this.d_numScroll*-1,t&&(i-=this.d_numVisible),s===this.totalIndicators-1&&this.remainingItems>0?(i+=-1*this.remainingItems+this.d_numScroll,this.isRemainingItemsAdded=!0):this.isRemainingItemsAdded=!1,i!==this.totalShiftedItems&&(this.totalShiftedItems=i,e=!0),this.d_oldNumScroll=this.d_numScroll,this.d_oldNumVisible=this.d_numVisible,this.d_oldValue=this.value,this.$refs.itemsContainer.style.transform=this.isVertical()?`translate3d(0, ${i*(100/this.d_numVisible)}%, 0)`:`translate3d(${i*(100/this.d_numVisible)}%, 0, 0)`}t&&(0===this.d_page?i=-1*this.d_numVisible:0===i&&(i=-1*this.value.length,this.remainingItems>0&&(this.isRemainingItemsAdded=!0)),i!==this.totalShiftedItems&&(this.totalShiftedItems=i,e=!0)),!e&&this.isAutoplay()&&this.startAutoplay()},beforeUnmount(){this.responsiveOptions&&this.unbindDocumentListeners(),this.autoplayInterval&&this.stopAutoplay()},methods:{step(t,i){let s=this.totalShiftedItems;const n=this.isCircular();if(null!=i)s=this.d_numScroll*i*-1,n&&(s-=this.d_numVisible),this.isRemainingItemsAdded=!1;else{s+=this.d_numScroll*t,this.isRemainingItemsAdded&&(s+=this.remainingItems-this.d_numScroll*t,this.isRemainingItemsAdded=!1);let e=n?s+this.d_numVisible:s;i=Math.abs(Math.floor(e/this.d_numScroll))}n&&this.d_page===this.totalIndicators-1&&-1===t?(s=-1*(this.value.length+this.d_numVisible),i=0):n&&0===this.d_page&&1===t?(s=0,i=this.totalIndicators-1):i===this.totalIndicators-1&&this.remainingItems>0&&(s+=-1*this.remainingItems-this.d_numScroll*t,this.isRemainingItemsAdded=!0),this.$refs.itemsContainer&&(e.removeClass(this.$refs.itemsContainer,"p-items-hidden"),this.$refs.itemsContainer.style.transform=this.isVertical()?`translate3d(0, ${s*(100/this.d_numVisible)}%, 0)`:`translate3d(${s*(100/this.d_numVisible)}%, 0, 0)`,this.$refs.itemsContainer.style.transition="transform 500ms ease 0s"),this.totalShiftedItems=s,this.$emit("update:page",i),this.d_page=i},calculatePosition(){if(this.$refs.itemsContainer&&this.responsiveOptions){let t=window.innerWidth,e={numVisible:this.numVisible,numScroll:this.numScroll};for(let i=0;i<this.responsiveOptions.length;i++){let s=this.responsiveOptions[i];parseInt(s.breakpoint,10)>=t&&(e=s)}if(this.d_numScroll!==e.numScroll){let t=this.d_page;t=parseInt(t*this.d_numScroll/e.numScroll),this.totalShiftedItems=e.numScroll*t*-1,this.isCircular()&&(this.totalShiftedItems-=e.numVisible),this.d_numScroll=e.numScroll,this.$emit("update:page",t),this.d_page=t}this.d_numVisible!==e.numVisible&&(this.d_numVisible=e.numVisible)}},navBackward(t,e){(this.d_circular||0!==this.d_page)&&this.step(1,e),this.allowAutoplay=!1,t.cancelable&&t.preventDefault()},navForward(t,e){(this.d_circular||this.d_page<this.totalIndicators-1)&&this.step(-1,e),this.allowAutoplay=!1,t.cancelable&&t.preventDefault()},onIndicatorClick(t,e){let i=this.d_page;e>i?this.navForward(t,e):e<i&&this.navBackward(t,e)},onTransitionEnd(){this.$refs.itemsContainer&&(e.addClass(this.$refs.itemsContainer,"p-items-hidden"),this.$refs.itemsContainer.style.transition="",0!==this.d_page&&this.d_page!==this.totalIndicators-1||!this.isCircular()||(this.$refs.itemsContainer.style.transform=this.isVertical()?`translate3d(0, ${this.totalShiftedItems*(100/this.d_numVisible)}%, 0)`:`translate3d(${this.totalShiftedItems*(100/this.d_numVisible)}%, 0, 0)`))},onTouchStart(t){let e=t.changedTouches[0];this.startPos={x:e.pageX,y:e.pageY}},onTouchMove(t){t.cancelable&&t.preventDefault()},onTouchEnd(t){let e=t.changedTouches[0];this.isVertical()?this.changePageOnTouch(t,e.pageY-this.startPos.y):this.changePageOnTouch(t,e.pageX-this.startPos.x)},changePageOnTouch(t,e){Math.abs(e)>this.swipeThreshold&&(e<0?this.navForward(t):this.navBackward(t))},bindDocumentListeners(){this.documentResizeListener||(this.documentResizeListener=t=>{this.calculatePosition(t)},window.addEventListener("resize",this.documentResizeListener))},unbindDocumentListeners(){this.documentResizeListener&&(window.removeEventListener("resize",this.documentResizeListener),this.documentResizeListener=null)},startAutoplay(){this.interval=setInterval((()=>{this.d_page===this.totalIndicators-1?this.step(-1,0):this.step(-1,this.d_page+1)}),this.autoplayInterval)},stopAutoplay(){this.interval&&clearInterval(this.interval)},createStyle(){this.carouselStyle||(this.carouselStyle=document.createElement("style"),this.carouselStyle.type="text/css",document.body.appendChild(this.carouselStyle));let t=`\n            #${this.id} .p-carousel-item {\n                flex: 1 0 ${100/this.d_numVisible}%\n            }\n        `;if(this.responsiveOptions){let e=[...this.responsiveOptions];e.sort(((t,e)=>{const i=t.breakpoint,s=e.breakpoint;let n=null;return n=null==i&&null!=s?-1:null!=i&&null==s?1:null==i&&null==s?0:"string"==typeof i&&"string"==typeof s?i.localeCompare(s,void 0,{numeric:!0}):i<s?-1:i>s?1:0,-1*n}));for(let i=0;i<e.length;i++){let s=e[i];t+=`\n                    @media screen and (max-width: ${s.breakpoint}) {\n                        #${this.id} .p-carousel-item {\n                            flex: 1 0 ${100/s.numVisible}%\n                        }\n                    }\n                `}}this.carouselStyle.innerHTML=t},isVertical(){return"vertical"===this.orientation},isCircular(){return this.value&&this.d_circular&&this.value.length>=this.d_numVisible},isAutoplay(){return this.autoplayInterval&&this.allowAutoplay},firstIndex(){return this.isCircular()?-1*(this.totalShiftedItems+this.d_numVisible):-1*this.totalShiftedItems},lastIndex(){return this.firstIndex()+this.d_numVisible-1}},computed:{totalIndicators(){return this.value?Math.max(Math.ceil((this.value.length-this.d_numVisible)/this.d_numScroll)+1,0):0},backwardIsDisabled(){return this.value&&(!this.circular||this.value.length<this.d_numVisible)&&0===this.d_page},forwardIsDisabled(){return this.value&&(!this.circular||this.value.length<this.d_numVisible)&&(this.d_page===this.totalIndicators-1||0===this.totalIndicators)},containerClasses(){return["p-carousel-container",this.containerClass]},contentClasses(){return["p-carousel-content ",this.contentClass]},indicatorsContentClasses(){return["p-carousel-indicators p-reset",this.indicatorsContentClass]}},directives:{ripple:i}};const b=["id"],f={key:0,class:"p-carousel-header"},v=["disabled"],g=["disabled"],x=["onClick"],y={key:1,class:"p-carousel-footer"};!function(t,e){void 0===e&&(e={});var i=e.insertAt;if(t&&"undefined"!=typeof document){var s=document.head||document.getElementsByTagName("head")[0],n=document.createElement("style");n.type="text/css","top"===i&&s.firstChild?s.insertBefore(n,s.firstChild):s.appendChild(n),n.styleSheet?n.styleSheet.cssText=t:n.appendChild(document.createTextNode(t))}}("\n.p-carousel {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-orient: vertical;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: column;\n            flex-direction: column;\n}\n.p-carousel-content {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-orient: vertical;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: column;\n            flex-direction: column;\n    overflow: auto;\n}\n.p-carousel-prev,\n.p-carousel-next {\n    -ms-flex-item-align: center;\n        align-self: center;\n    -webkit-box-flex: 0;\n        -ms-flex-positive: 0;\n            flex-grow: 0;\n    -ms-flex-negative: 0;\n        flex-shrink: 0;\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-pack: center;\n        -ms-flex-pack: center;\n            justify-content: center;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    overflow: hidden;\n    position: relative;\n}\n.p-carousel-container {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-orient: horizontal;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: row;\n            flex-direction: row;\n}\n.p-carousel-items-content {\n    overflow: hidden;\n    width: 100%;\n}\n.p-carousel-items-container {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-orient: horizontal;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: row;\n            flex-direction: row;\n}\n.p-carousel-indicators {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-orient: horizontal;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: row;\n            flex-direction: row;\n    -webkit-box-pack: center;\n        -ms-flex-pack: center;\n            justify-content: center;\n    -ms-flex-wrap: wrap;\n        flex-wrap: wrap;\n}\n.p-carousel-indicator > button {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    -webkit-box-pack: center;\n        -ms-flex-pack: center;\n            justify-content: center;\n}\n\n/* Vertical */\n.p-carousel-vertical .p-carousel-container {\n    -webkit-box-orient: vertical;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: column;\n            flex-direction: column;\n}\n.p-carousel-vertical .p-carousel-items-container {\n    -webkit-box-orient: vertical;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: column;\n            flex-direction: column;\n    height: 100%;\n}\n\n/* Keyboard Support */\n.p-items-hidden .p-carousel-item {\n    visibility: hidden;\n}\n.p-items-hidden .p-carousel-item.p-carousel-item-active {\n    visibility: visible;\n}\n"),p.render=function(t,e,i,p,_,w){const I=s("ripple");return n(),l("div",{id:_.id,class:a(["p-carousel p-component",{"p-carousel-vertical":w.isVertical(),"p-carousel-horizontal":!w.isVertical()}])},[t.$slots.header?(n(),l("div",f,[o(t.$slots,"header")])):r("",!0),d("div",{class:a(w.contentClasses)},[d("div",{class:a(w.containerClasses)},[i.showNavigators?c((n(),l("button",{key:0,class:a(["p-carousel-prev p-link",{"p-disabled":w.backwardIsDisabled}]),disabled:w.backwardIsDisabled,onClick:e[0]||(e[0]=(...t)=>w.navBackward&&w.navBackward(...t)),type:"button"},[d("span",{class:a(["p-carousel-prev-icon pi",{"pi-chevron-left":!w.isVertical(),"pi-chevron-up":w.isVertical()}])},null,2)],10,v)),[[I]]):r("",!0),d("div",{class:"p-carousel-items-content",style:h([{height:w.isVertical()?i.verticalViewPortHeight:"auto"}]),onTouchend:e[2]||(e[2]=(...t)=>w.onTouchEnd&&w.onTouchEnd(...t)),onTouchstart:e[3]||(e[3]=(...t)=>w.onTouchStart&&w.onTouchStart(...t)),onTouchmove:e[4]||(e[4]=(...t)=>w.onTouchMove&&w.onTouchMove(...t))},[d("div",{ref:"itemsContainer",class:"p-carousel-items-container",onTransitionend:e[1]||(e[1]=(...t)=>w.onTransitionEnd&&w.onTransitionEnd(...t))},[w.isCircular()?(n(!0),l(u,{key:0},m(i.value.slice(-1*_.d_numVisible),((e,s)=>(n(),l("div",{key:s+"_scloned",class:a(["p-carousel-item p-carousel-item-cloned",{"p-carousel-item-active":-1*_.totalShiftedItems===i.value.length+_.d_numVisible,"p-carousel-item-start":0===s,"p-carousel-item-end":i.value.slice(-1*_.d_numVisible).length-1===s}])},[o(t.$slots,"item",{data:e,index:s})],2)))),128)):r("",!0),(n(!0),l(u,null,m(i.value,((e,i)=>(n(),l("div",{key:i,class:a(["p-carousel-item",{"p-carousel-item-active":w.firstIndex()<=i&&w.lastIndex()>=i,"p-carousel-item-start":w.firstIndex()===i,"p-carousel-item-end":w.lastIndex()===i}])},[o(t.$slots,"item",{data:e,index:i})],2)))),128)),w.isCircular()?(n(!0),l(u,{key:1},m(i.value.slice(0,_.d_numVisible),((e,s)=>(n(),l("div",{key:s+"_fcloned",class:a(["p-carousel-item p-carousel-item-cloned",{"p-carousel-item-active":0===_.totalShiftedItems,"p-carousel-item-start":0===s,"p-carousel-item-end":i.value.slice(0,_.d_numVisible).length-1===s}])},[o(t.$slots,"item",{data:e,index:s})],2)))),128)):r("",!0)],544)],36),i.showNavigators?c((n(),l("button",{key:1,class:a(["p-carousel-next p-link",{"p-disabled":w.forwardIsDisabled}]),disabled:w.forwardIsDisabled,onClick:e[5]||(e[5]=(...t)=>w.navForward&&w.navForward(...t)),type:"button"},[d("span",{class:a(["p-carousel-prev-icon pi",{"pi-chevron-right":!w.isVertical(),"pi-chevron-down":w.isVertical()}])},null,2)],10,g)),[[I]]):r("",!0)],2),w.totalIndicators>=0&&i.showIndicators?(n(),l("ul",{key:0,class:a(w.indicatorsContentClasses)},[(n(!0),l(u,null,m(w.totalIndicators,((t,e)=>(n(),l("li",{key:"p-carousel-indicator-"+e.toString(),class:a(["p-carousel-indicator",{"p-highlight":_.d_page===e}])},[d("button",{class:"p-link",onClick:t=>w.onIndicatorClick(t,e),type:"button"},null,8,x)],2)))),128))],2)):r("",!0)],2),t.$slots.footer?(n(),l("div",y,[o(t.$slots,"footer")])):r("",!0)],10,b)};export{p as default};
+import t from"primevue/ripple";import{DomHandler as e,UniqueComponentId as i}from"primevue/utils";import{resolveDirective as s,openBlock as n,createElementBlock as a,normalizeClass as l,renderSlot as r,createCommentVNode as o,createElementVNode as d,withDirectives as c,mergeProps as h,normalizeStyle as u,Fragment as p,renderList as m}from"vue";var f={name:"Carousel",emits:["update:page"],props:{value:null,page:{type:Number,default:0},numVisible:{type:Number,default:1},numScroll:{type:Number,default:1},responsiveOptions:Array,orientation:{type:String,default:"horizontal"},verticalViewPortHeight:{type:String,default:"300px"},contentClass:String,containerClass:String,indicatorsContentClass:String,circular:{type:Boolean,default:!1},autoplayInterval:{type:Number,default:0},showNavigators:{type:Boolean,default:!0},showIndicators:{type:Boolean,default:!0},prevButtonProps:{type:null,default:null},nextButtonProps:{type:null,default:null}},isRemainingItemsAdded:!1,data(){return{remainingItems:0,d_numVisible:this.numVisible,d_numScroll:this.numScroll,d_oldNumScroll:0,d_oldNumVisible:0,d_oldValue:null,d_page:this.page,totalShiftedItems:this.page*this.numScroll*-1,allowAutoplay:!!this.autoplayInterval,d_circular:this.circular||this.allowAutoplay,swipeThreshold:20}},watch:{page(t){this.d_page=t},circular(t){this.d_circular=t},numVisible(t,e){this.d_numVisible=t,this.d_oldNumVisible=e},numScroll(t,e){this.d_oldNumScroll=e,this.d_numScroll=t},value(t){this.d_oldValue=t}},mounted(){let t=!1;if(this.$el.setAttribute(this.attributeSelector,""),this.createStyle(),this.calculatePosition(),this.responsiveOptions&&this.bindDocumentListeners(),this.isCircular()){let e=this.totalShiftedItems;0===this.d_page?e=-1*this.d_numVisible:0===e&&(e=-1*this.value.length,this.remainingItems>0&&(this.isRemainingItemsAdded=!0)),e!==this.totalShiftedItems&&(this.totalShiftedItems=e,t=!0)}!t&&this.isAutoplay()&&this.startAutoplay()},updated(){const t=this.isCircular();let e=!1,i=this.totalShiftedItems;if(this.autoplayInterval&&this.stopAutoplay(),this.d_oldNumScroll!==this.d_numScroll||this.d_oldNumVisible!==this.d_numVisible||this.d_oldValue.length!==this.value.length){this.remainingItems=(this.value.length-this.d_numVisible)%this.d_numScroll;let s=this.d_page;0!==this.totalIndicators&&s>=this.totalIndicators&&(s=this.totalIndicators-1,this.$emit("update:page",s),this.d_page=s,e=!0),i=s*this.d_numScroll*-1,t&&(i-=this.d_numVisible),s===this.totalIndicators-1&&this.remainingItems>0?(i+=-1*this.remainingItems+this.d_numScroll,this.isRemainingItemsAdded=!0):this.isRemainingItemsAdded=!1,i!==this.totalShiftedItems&&(this.totalShiftedItems=i,e=!0),this.d_oldNumScroll=this.d_numScroll,this.d_oldNumVisible=this.d_numVisible,this.d_oldValue=this.value,this.$refs.itemsContainer.style.transform=this.isVertical()?`translate3d(0, ${i*(100/this.d_numVisible)}%, 0)`:`translate3d(${i*(100/this.d_numVisible)}%, 0, 0)`}t&&(0===this.d_page?i=-1*this.d_numVisible:0===i&&(i=-1*this.value.length,this.remainingItems>0&&(this.isRemainingItemsAdded=!0)),i!==this.totalShiftedItems&&(this.totalShiftedItems=i,e=!0)),!e&&this.isAutoplay()&&this.startAutoplay()},beforeUnmount(){this.responsiveOptions&&this.unbindDocumentListeners(),this.autoplayInterval&&this.stopAutoplay()},methods:{step(t,i){let s=this.totalShiftedItems;const n=this.isCircular();if(null!=i)s=this.d_numScroll*i*-1,n&&(s-=this.d_numVisible),this.isRemainingItemsAdded=!1;else{s+=this.d_numScroll*t,this.isRemainingItemsAdded&&(s+=this.remainingItems-this.d_numScroll*t,this.isRemainingItemsAdded=!1);let e=n?s+this.d_numVisible:s;i=Math.abs(Math.floor(e/this.d_numScroll))}n&&this.d_page===this.totalIndicators-1&&-1===t?(s=-1*(this.value.length+this.d_numVisible),i=0):n&&0===this.d_page&&1===t?(s=0,i=this.totalIndicators-1):i===this.totalIndicators-1&&this.remainingItems>0&&(s+=-1*this.remainingItems-this.d_numScroll*t,this.isRemainingItemsAdded=!0),this.$refs.itemsContainer&&(e.removeClass(this.$refs.itemsContainer,"p-items-hidden"),this.$refs.itemsContainer.style.transform=this.isVertical()?`translate3d(0, ${s*(100/this.d_numVisible)}%, 0)`:`translate3d(${s*(100/this.d_numVisible)}%, 0, 0)`,this.$refs.itemsContainer.style.transition="transform 500ms ease 0s"),this.totalShiftedItems=s,this.$emit("update:page",i),this.d_page=i},calculatePosition(){if(this.$refs.itemsContainer&&this.responsiveOptions){let t=window.innerWidth,e={numVisible:this.numVisible,numScroll:this.numScroll};for(let i=0;i<this.responsiveOptions.length;i++){let s=this.responsiveOptions[i];parseInt(s.breakpoint,10)>=t&&(e=s)}if(this.d_numScroll!==e.numScroll){let t=this.d_page;t=parseInt(t*this.d_numScroll/e.numScroll),this.totalShiftedItems=e.numScroll*t*-1,this.isCircular()&&(this.totalShiftedItems-=e.numVisible),this.d_numScroll=e.numScroll,this.$emit("update:page",t),this.d_page=t}this.d_numVisible!==e.numVisible&&(this.d_numVisible=e.numVisible)}},navBackward(t,e){(this.d_circular||0!==this.d_page)&&this.step(1,e),this.allowAutoplay=!1,t.cancelable&&t.preventDefault()},navForward(t,e){(this.d_circular||this.d_page<this.totalIndicators-1)&&this.step(-1,e),this.allowAutoplay=!1,t.cancelable&&t.preventDefault()},onIndicatorClick(t,e){let i=this.d_page;e>i?this.navForward(t,e):e<i&&this.navBackward(t,e)},onTransitionEnd(){this.$refs.itemsContainer&&(e.addClass(this.$refs.itemsContainer,"p-items-hidden"),this.$refs.itemsContainer.style.transition="",0!==this.d_page&&this.d_page!==this.totalIndicators-1||!this.isCircular()||(this.$refs.itemsContainer.style.transform=this.isVertical()?`translate3d(0, ${this.totalShiftedItems*(100/this.d_numVisible)}%, 0)`:`translate3d(${this.totalShiftedItems*(100/this.d_numVisible)}%, 0, 0)`))},onTouchStart(t){let e=t.changedTouches[0];this.startPos={x:e.pageX,y:e.pageY}},onTouchMove(t){t.cancelable&&t.preventDefault()},onTouchEnd(t){let e=t.changedTouches[0];this.isVertical()?this.changePageOnTouch(t,e.pageY-this.startPos.y):this.changePageOnTouch(t,e.pageX-this.startPos.x)},changePageOnTouch(t,e){Math.abs(e)>this.swipeThreshold&&(e<0?this.navForward(t):this.navBackward(t))},onIndicatorKeydown(t){switch(t.code){case"ArrowRight":this.onRightKey();break;case"ArrowLeft":this.onLeftKey();break;case"Home":this.onHomeKey(),t.preventDefault();break;case"End":this.onEndKey(),t.preventDefault();break;case"ArrowUp":case"ArrowDown":t.preventDefault();break;case"Tab":this.onTabKey()}},onRightKey(){const t=[...e.find(this.$refs.indicatorContent,".p-carousel-indicator")],i=this.findFocusedIndicatorIndex();this.changedFocusedIndicator(i,i+1===t.length?t.length-1:i+1)},onLeftKey(){const t=this.findFocusedIndicatorIndex();this.changedFocusedIndicator(t,t-1<=0?0:t-1)},onHomeKey(){const t=this.findFocusedIndicatorIndex();this.changedFocusedIndicator(t,0)},onEndKey(){const t=[...e.find(this.$refs.indicatorContent,".p-carousel-indicator")],i=this.findFocusedIndicatorIndex();this.changedFocusedIndicator(i,t.length-1)},onTabKey(){const t=[...e.find(this.$refs.indicatorContent,".p-carousel-indicator")],i=t.findIndex((t=>e.hasClass(t,"p-highlight"))),s=e.findSingle(this.$refs.indicatorContent,'.p-carousel-indicator > button[tabindex="0"]'),n=t.findIndex((t=>t===s.parentElement));t[n].children[0].tabIndex="-1",t[i].children[0].tabIndex="0"},findFocusedIndicatorIndex(){const t=[...e.find(this.$refs.indicatorContent,".p-carousel-indicator")],i=e.findSingle(this.$refs.indicatorContent,'.p-carousel-indicator > button[tabindex="0"]');return t.findIndex((t=>t===i.parentElement))},changedFocusedIndicator(t,i){const s=[...e.find(this.$refs.indicatorContent,".p-carousel-indicator")];s[t].children[0].tabIndex="-1",s[i].children[0].tabIndex="0",s[i].children[0].focus()},bindDocumentListeners(){this.documentResizeListener||(this.documentResizeListener=t=>{this.calculatePosition(t)},window.addEventListener("resize",this.documentResizeListener))},unbindDocumentListeners(){this.documentResizeListener&&(window.removeEventListener("resize",this.documentResizeListener),this.documentResizeListener=null)},startAutoplay(){this.interval=setInterval((()=>{this.d_page===this.totalIndicators-1?this.step(-1,0):this.step(-1,this.d_page+1)}),this.autoplayInterval)},stopAutoplay(){this.interval&&clearInterval(this.interval)},createStyle(){this.carouselStyle||(this.carouselStyle=document.createElement("style"),this.carouselStyle.type="text/css",document.body.appendChild(this.carouselStyle));let t=`\n                .p-carousel[${this.attributeSelector}] .p-carousel-item {\n                    flex: 1 0 ${100/this.d_numVisible}%\n                }\n            `;if(this.responsiveOptions){let e=[...this.responsiveOptions];e.sort(((t,e)=>{const i=t.breakpoint,s=e.breakpoint;let n=null;return n=null==i&&null!=s?-1:null!=i&&null==s?1:null==i&&null==s?0:"string"==typeof i&&"string"==typeof s?i.localeCompare(s,void 0,{numeric:!0}):i<s?-1:i>s?1:0,-1*n}));for(let i=0;i<e.length;i++){let s=e[i];t+=`\n                        @media screen and (max-width: ${s.breakpoint}) {\n                            .p-carousel[${this.attributeSelector}] .p-carousel-item {\n                                flex: 1 0 ${100/s.numVisible}%\n                            }\n                        }\n                    `}}this.carouselStyle.innerHTML=t},isVertical(){return"vertical"===this.orientation},isCircular(){return this.value&&this.d_circular&&this.value.length>=this.d_numVisible},isAutoplay(){return this.autoplayInterval&&this.allowAutoplay},firstIndex(){return this.isCircular()?-1*(this.totalShiftedItems+this.d_numVisible):-1*this.totalShiftedItems},lastIndex(){return this.firstIndex()+this.d_numVisible-1},ariaSlideNumber(t){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.slideNumber.replace(/{slideNumber}/g,t):void 0},ariaPageLabel(t){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.pageLabel.replace(/{page}/g,t):void 0}},computed:{totalIndicators(){return this.value?Math.max(Math.ceil((this.value.length-this.d_numVisible)/this.d_numScroll)+1,0):0},backwardIsDisabled(){return this.value&&(!this.circular||this.value.length<this.d_numVisible)&&0===this.d_page},forwardIsDisabled(){return this.value&&(!this.circular||this.value.length<this.d_numVisible)&&(this.d_page===this.totalIndicators-1||0===this.totalIndicators)},containerClasses(){return["p-carousel-container",this.containerClass]},contentClasses(){return["p-carousel-content ",this.contentClass]},indicatorsContentClasses(){return["p-carousel-indicators p-reset",this.indicatorsContentClass]},ariaSlideLabel(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.slide:void 0},ariaPrevButtonLabel(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.prevPageLabel:void 0},ariaNextButtonLabel(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.nextPageLabel:void 0},attributeSelector:()=>i()},directives:{ripple:t}};const g={key:0,class:"p-carousel-header"},v=["aria-live"],b=["disabled","aria-label"],I=["aria-hidden","aria-label","aria-roledescription"],y=["disabled","aria-label"],_=["tabindex","aria-label","aria-current","onClick"],S={key:1,class:"p-carousel-footer"};!function(t,e){void 0===e&&(e={});var i=e.insertAt;if(t&&"undefined"!=typeof document){var s=document.head||document.getElementsByTagName("head")[0],n=document.createElement("style");n.type="text/css","top"===i&&s.firstChild?s.insertBefore(n,s.firstChild):s.appendChild(n),n.styleSheet?n.styleSheet.cssText=t:n.appendChild(document.createTextNode(t))}}("\n.p-carousel {\n    display: flex;\n    flex-direction: column;\n}\n.p-carousel-content {\n    display: flex;\n    flex-direction: column;\n    overflow: auto;\n}\n.p-carousel-prev,\n.p-carousel-next {\n    align-self: center;\n    flex-grow: 0;\n    flex-shrink: 0;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    overflow: hidden;\n    position: relative;\n}\n.p-carousel-container {\n    display: flex;\n    flex-direction: row;\n}\n.p-carousel-items-content {\n    overflow: hidden;\n    width: 100%;\n}\n.p-carousel-items-container {\n    display: flex;\n    flex-direction: row;\n}\n.p-carousel-indicators {\n    display: flex;\n    flex-direction: row;\n    justify-content: center;\n    flex-wrap: wrap;\n}\n.p-carousel-indicator > button {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n}\n\n/* Vertical */\n.p-carousel-vertical .p-carousel-container {\n    flex-direction: column;\n}\n.p-carousel-vertical .p-carousel-items-container {\n    flex-direction: column;\n    height: 100%;\n}\n\n/* Keyboard Support */\n.p-items-hidden .p-carousel-item {\n    visibility: hidden;\n}\n.p-items-hidden .p-carousel-item.p-carousel-item-active {\n    visibility: visible;\n}\n"),f.render=function(t,e,i,f,x,V){const w=s("ripple");return n(),a("div",{class:l(["p-carousel p-component",{"p-carousel-vertical":V.isVertical(),"p-carousel-horizontal":!V.isVertical()}]),role:"region"},[t.$slots.header?(n(),a("div",g,[r(t.$slots,"header")])):o("",!0),d("div",{class:l(V.contentClasses)},[d("div",{class:l(V.containerClasses),"aria-live":x.allowAutoplay?"polite":"off"},[i.showNavigators?c((n(),a("button",h({key:0,type:"button",class:["p-carousel-prev p-link",{"p-disabled":V.backwardIsDisabled}],disabled:V.backwardIsDisabled,"aria-label":V.ariaPrevButtonLabel,onClick:e[0]||(e[0]=(...t)=>V.navBackward&&V.navBackward(...t))},i.prevButtonProps),[d("span",{class:l(["p-carousel-prev-icon pi",{"pi-chevron-left":!V.isVertical(),"pi-chevron-up":V.isVertical()}])},null,2)],16,b)),[[w]]):o("",!0),d("div",{class:"p-carousel-items-content",style:u([{height:V.isVertical()?i.verticalViewPortHeight:"auto"}]),onTouchend:e[2]||(e[2]=(...t)=>V.onTouchEnd&&V.onTouchEnd(...t)),onTouchstart:e[3]||(e[3]=(...t)=>V.onTouchStart&&V.onTouchStart(...t)),onTouchmove:e[4]||(e[4]=(...t)=>V.onTouchMove&&V.onTouchMove(...t))},[d("div",{ref:"itemsContainer",class:"p-carousel-items-container",onTransitionend:e[1]||(e[1]=(...t)=>V.onTransitionEnd&&V.onTransitionEnd(...t))},[V.isCircular()?(n(!0),a(p,{key:0},m(i.value.slice(-1*x.d_numVisible),((e,s)=>(n(),a("div",{key:s+"_scloned",class:l(["p-carousel-item p-carousel-item-cloned",{"p-carousel-item-active":-1*x.totalShiftedItems===i.value.length+x.d_numVisible,"p-carousel-item-start":0===s,"p-carousel-item-end":i.value.slice(-1*x.d_numVisible).length-1===s}])},[r(t.$slots,"item",{data:e,index:s})],2)))),128)):o("",!0),(n(!0),a(p,null,m(i.value,((e,i)=>(n(),a("div",{key:i,class:l(["p-carousel-item",{"p-carousel-item-active":V.firstIndex()<=i&&V.lastIndex()>=i,"p-carousel-item-start":V.firstIndex()===i,"p-carousel-item-end":V.lastIndex()===i}]),role:"group","aria-hidden":V.firstIndex()>i||V.lastIndex()<i||void 0,"aria-label":V.ariaSlideNumber(i),"aria-roledescription":V.ariaSlideLabel},[r(t.$slots,"item",{data:e,index:i})],10,I)))),128)),V.isCircular()?(n(!0),a(p,{key:1},m(i.value.slice(0,x.d_numVisible),((e,s)=>(n(),a("div",{key:s+"_fcloned",class:l(["p-carousel-item p-carousel-item-cloned",{"p-carousel-item-active":0===x.totalShiftedItems,"p-carousel-item-start":0===s,"p-carousel-item-end":i.value.slice(0,x.d_numVisible).length-1===s}])},[r(t.$slots,"item",{data:e,index:s})],2)))),128)):o("",!0)],544)],36),i.showNavigators?c((n(),a("button",h({key:1,type:"button",class:["p-carousel-next p-link",{"p-disabled":V.forwardIsDisabled}],disabled:V.forwardIsDisabled,"aria-label":V.ariaNextButtonLabel,onClick:e[5]||(e[5]=(...t)=>V.navForward&&V.navForward(...t))},i.nextButtonProps),[d("span",{class:l(["p-carousel-prev-icon pi",{"pi-chevron-right":!V.isVertical(),"pi-chevron-down":V.isVertical()}])},null,2)],16,y)),[[w]]):o("",!0)],10,v),V.totalIndicators>=0&&i.showIndicators?(n(),a("ul",{key:0,ref:"indicatorContent",class:l(V.indicatorsContentClasses),onKeydown:e[6]||(e[6]=(...t)=>V.onIndicatorKeydown&&V.onIndicatorKeydown(...t))},[(n(!0),a(p,null,m(V.totalIndicators,((t,e)=>(n(),a("li",{key:"p-carousel-indicator-"+e.toString(),class:l(["p-carousel-indicator",{"p-highlight":x.d_page===e}])},[d("button",{class:"p-link",type:"button",tabindex:x.d_page===e?"0":"-1","aria-label":V.ariaPageLabel(e+1),"aria-current":x.d_page===e?"page":void 0,onClick:t=>V.onIndicatorClick(t,e)},null,8,_)],2)))),128))],34)):o("",!0)],2),t.$slots.footer?(n(),a("div",S,[r(t.$slots,"footer")])):o("",!0)],2)};export{f as default};