@tofandel/vue3-carousel/dist/carousel.min.js

A simple carousel component for Vue 3

/**
 * Vue 3 Carousel 0.14.4
 * (c) 2025
 * @license MIT
 */
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("vue")):"function"==typeof define&&define.amd?define(["exports","vue"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).VueCarousel={},e.Vue)}(this,(function(e,t){"use strict";const i=["viewport","carousel"],a={"bottom-to-top":"btt","left-to-right":"ltr","right-to-left":"rtl","top-to-bottom":"ttb"},n=["ltr","left-to-right","rtl","right-to-left","ttb","top-to-bottom","btt","bottom-to-top"],l={ariaGallery:"Gallery",ariaNavigateToPage:"Navigate to page {slideNumber}",ariaNavigateToSlide:"Navigate to slide {slideNumber}",ariaNextSlide:"Navigate to next slide",ariaPreviousSlide:"Navigate to previous slide",iconArrowDown:"Arrow pointing downwards",iconArrowLeft:"Arrow pointing to the left",iconArrowRight:"Arrow pointing to the right",iconArrowUp:"Arrow pointing upwards",itemXofY:"Item {currentSlide} of {slidesCount}"},o=Object.values(a),r=["slide","fade"],u=["center","start","end","center-even","center-odd"],s={autoplay:0,breakpointMode:i[0],breakpoints:void 0,dir:n[0],enabled:!0,gap:0,height:"auto",i18n:l,ignoreAnimations:!1,itemsToScroll:1,itemsToShow:1,modelValue:0,mouseDrag:!0,pauseAutoplayOnHover:!1,preventExcessiveDragging:!1,slideEffect:r[0],snapAlign:u[0],touchDrag:!0,transition:300,wrapAround:!1},d=Symbol("carousel"),c=e=>{const i=t.shallowReactive([]),a=e=>{void 0!==e?i.slice(e).forEach(((t,i)=>{var a;null===(a=t.exposed)||void 0===a||a.setIndex(e+i)})):i.forEach(((e,t)=>{var i;null===(i=e.exposed)||void 0===i||i.setIndex(t)}))};return{cleanup:()=>{i.splice(0,i.length)},getSlides:()=>i,registerSlide:(t,n)=>{if(!t)return;if(t.props.isClone)return;const l=null!=n?n:i.length;i.splice(l,0,t),a(l),e("slide-registered",{slide:t,index:l})},unregisterSlide:t=>{const n=i.indexOf(t);-1!==n&&(e("slide-unregistered",{slide:t,index:n}),i.splice(n,1),a(n))}}};function v({slides:e,position:i,toShow:a}){const n=[],l="before"===i,o=l?-a:0,r=l?0:a;if(e.length<=0)return n;for(let a=o;a<r;a++){const o={index:l?a:a+e.length,isClone:!0,id:void 0,key:`clone-${i}-${a}`},r=e[(a%e.length+e.length)%e.length].vnode,u=t.cloneVNode(r,o);u.el=null,n.push(u)}return n}function p(e){if(!(e.el&&e.el instanceof Element))return;const t=e.el.querySelectorAll('a[href], button, input, textarea, select, details, [tabindex]:not([tabindex="-1"])');for(const e of t)e instanceof HTMLElement&&!e.hasAttribute("disabled")&&"true"!==e.getAttribute("aria-hidden")&&e.setAttribute("tabindex","-1")}function m({val:e,max:t,min:i}){return t<i?e:Math.min(Math.max(e,isNaN(i)?e:i),isNaN(t)?e:t)}function g(e){let t=1,i=1;return e.forEach((e=>{const a=function(e){const{transform:t}=window.getComputedStyle(e);return t.split(/[(,)]/).slice(1,-1).map((e=>parseFloat(e)))}(e);6===a.length&&(t/=a[0],i/=a[3])})),{widthMultiplier:t,heightMultiplier:i}}function f({slideSize:e,viewportSize:t,align:i,itemsToShow:a}){return void 0!==a?function(e,t){switch(e){case"start":default:return 0;case"center":case"center-odd":return(t-1)/2;case"center-even":return(t-2)/2;case"end":return t-1}}(i,a):void 0!==e&&void 0!==t?function(e,t,i){switch(e){case"start":default:return 0;case"center":case"center-odd":return(i-t)/2;case"center-even":return i/2-t;case"end":return i-t}}(i,e,t):0}function h(e="",t={}){return Object.entries(t).reduce(((e,[t,i])=>e.replace(`{${t}}`,String(i))),e)}function w({val:e,max:t,min:i=0}){const a=t-i+1;return((e-i)%a+a)%a+i}function b(e,t=0){let i=!1,a=0,n=null;function l(...l){if(i)return;i=!0;const o=()=>{n=requestAnimationFrame((n=>{n-a>t?(a=n,e(...l),i=!1):o()}))};o()}return l.cancel=()=>{n&&(cancelAnimationFrame(n),n=null,i=!1)},l}function S(e,t="px"){if(null!=e&&""!==e)return"number"==typeof e||parseFloat(e).toString()===e?`${e}${t}`:e}const y=t.defineComponent({name:"CarouselAria",setup(){const e=t.inject(d);return e?()=>t.h("div",{class:["carousel__liveregion","carousel__sr-only"],"aria-live":"polite","aria-atomic":"true"},h(e.config.i18n.itemXofY,{currentSlide:e.currentSlide+1,slidesCount:e.slidesCount})):()=>""}}),x={autoplay:{default:s.autoplay,type:Number},breakpoints:{default:s.breakpoints,type:Object},breakpointMode:{default:s.breakpointMode,validator:e=>i.includes(e)},enabled:{default:s.enabled,type:Boolean},gap:{default:s.gap,type:Number},height:{default:s.height,type:[Number,String]},ignoreAnimations:{default:!1,type:[Array,Boolean,String]},itemsToScroll:{default:s.itemsToScroll,type:Number},itemsToShow:{default:s.itemsToShow,type:[Number,String]},i18n:{default:s.i18n,type:Object},modelValue:{default:void 0,type:Number},mouseDrag:{default:s.mouseDrag,type:Boolean},touchDrag:{default:s.touchDrag,type:Boolean},pauseAutoplayOnHover:{default:s.pauseAutoplayOnHover,type:Boolean},preventExcessiveDragging:{default:!1,type:Boolean,validator:(e,t)=>(e&&t.wrapAround&&console.warn('[vue3-carousel]: "preventExcessiveDragging" cannot be used with wrapAround. The setting will be ignored.'),!0)},snapAlign:{default:s.snapAlign,validator:e=>u.includes(e)},slideEffect:{type:String,default:s.slideEffect,validator:e=>r.includes(e)},transition:{default:s.transition,type:Number},dir:{type:String,default:s.dir,validator(e,t){if(!n.includes(e))return!1;return!["ttb","btt"].includes(e in a?a[e]:e)||t.height&&"auto"!==t.height||console.warn(`[vue3-carousel]: The dir "${e}" is not supported with height "auto".`),!0}},wrapAround:{default:s.wrapAround,type:Boolean},clamp:{type:Boolean}},A=t.defineComponent({name:"VueCarousel",props:x,emits:["before-init","drag","init","loop","slide-end","slide-registered","slide-start","slide-unregistered","update:modelValue"],setup(e,{slots:i,emit:n,expose:l}){var o;const r=c(n),u=r.getSlides(),p=t.computed((()=>u.length)),h=t.ref(null),x=t.ref(null),A=t.ref(0),T=t.computed((()=>{return Object.assign(Object.assign(Object.assign({},s),(t=e,i=["breakpoints","modelValue"],Object.keys(t).filter((e=>!i.includes(e))).reduce(((e,i)=>(e[i]=t[i],e)),{}))),{i18n:Object.assign(Object.assign({},s.i18n),e.i18n)});var t,i})),N=t.shallowReactive(Object.assign({},T.value)),_=t.ref(null!==(o=e.modelValue)&&void 0!==o?o:0),C=t.ref(_.value);t.watch(_,(e=>C.value=e));const O=t.ref(0),E=t.computed((()=>Math.ceil((p.value-1)/2))),M=t.computed((()=>p.value-1)),L=t.computed((()=>0));let I=null,D=null,R=null;const k=t.computed((()=>A.value+N.gap)),j=t.computed((()=>{const e=N.dir||"ltr";return e in a?a[e]:e})),B=t.computed((()=>["rtl","btt"].includes(j.value))),z=t.computed((()=>["ttb","btt"].includes(j.value))),P=t.computed((()=>"auto"===N.itemsToShow)),V=t.computed((()=>z.value?"height":"width"));function F(){var t;if(!J.value)return;const i=("carousel"===T.value.breakpointMode?null===(t=h.value)||void 0===t?void 0:t.getBoundingClientRect().width:"undefined"!=typeof window?window.innerWidth:0)||0,a=Object.keys(e.breakpoints||{}).map((e=>Number(e))).sort(((e,t)=>+t-+e)),n={};a.some((t=>i>=t&&(Object.assign(n,e.breakpoints[t]),n.i18n&&Object.assign(n.i18n,T.value.i18n,e.breakpoints[t].i18n),!0))),Object.assign(N,T.value,n),P.value||(N.itemsToShow=m({val:Number(N.itemsToShow),max:e.clamp?p.value:1/0,min:1}))}const U=b((()=>{F(),q(),G()})),$=t.shallowReactive(new Set),X=t.ref([]);const Y=t.ref({width:0,height:0});function G(){if(!x.value)return;const e=g($);if(function({widthMultiplier:e,heightMultiplier:t}){var i;const a=(null===(i=x.value)||void 0===i?void 0:i.getBoundingClientRect())||{width:0,height:0};Y.value={width:a.width*e,height:a.height*t}}(e),function({widthMultiplier:e,heightMultiplier:t}){X.value=u.map((i=>{var a;const n=null===(a=i.exposed)||void 0===a?void 0:a.getBoundingRect();return{width:n.width*e,height:n.height*t}}))}(e),P.value)A.value=0===(t=X.value.map((e=>e[V.value]))).length?0:t.reduce(((e,t)=>e+t),0)/t.length;else{const e=Number(N.itemsToShow),t=(e-1)*N.gap;A.value=(Y.value[V.value]-t)/e}var t}function q(){!N.wrapAround&&p.value>0&&(_.value=m({val:_.value,max:M.value,min:L.value}))}const H=t.computed((()=>"string"==typeof e.ignoreAnimations?e.ignoreAnimations.split(","):Array.isArray(e.ignoreAnimations)?e.ignoreAnimations:!e.ignoreAnimations&&[]));let W;t.watchEffect((()=>q())),t.watchEffect((()=>{G()}));const K=e=>{const t=e.target;if(!(!(null==t?void 0:t.contains(h.value))||Array.isArray(H.value)&&H.value.includes(e.animationName)||($.add(t),W))){const e=()=>{W=requestAnimationFrame((()=>{G(),e()}))};e()}},Z=e=>{const t=e.target;t&&$.delete(t),W&&0===$.size&&(cancelAnimationFrame(W),G())},J=t.ref(!1);"undefined"!=typeof document&&t.watchEffect((()=>{J.value&&!1!==H.value?(document.addEventListener("animationstart",K),document.addEventListener("animationend",Z)):(document.removeEventListener("animationstart",K),document.removeEventListener("animationend",Z))})),t.onMounted((()=>{J.value=!0,F(),ve(),h.value&&(R=new ResizeObserver(U),R.observe(h.value)),n("init")})),t.onBeforeUnmount((()=>{J.value=!1,r.cleanup(),D&&clearTimeout(D),W&&cancelAnimationFrame(W),I&&clearInterval(I),R&&(R.disconnect(),R=null),"undefined"!=typeof document&&ue(),h.value&&(h.value.removeEventListener("transitionend",G),h.value.removeEventListener("animationiteration",G))}));let Q=!1;const ee={x:0,y:0},te=t.reactive({x:0,y:0}),ie=t.ref(!1),ae=t.ref(!1),ne=()=>{ie.value=!0},le=()=>{ie.value=!1},oe=b((e=>{if(!e.ctrlKey)switch(e.key){case"ArrowLeft":case"ArrowUp":z.value===e.key.endsWith("Up")&&(B.value?he(!0):we(!0));break;case"ArrowRight":case"ArrowDown":z.value===e.key.endsWith("Down")&&(B.value?we(!0):he(!0))}}),200),re=()=>{document.addEventListener("keydown",oe)},ue=()=>{document.removeEventListener("keydown",oe)};function se(e){const t=e.target.tagName;if(["INPUT","TEXTAREA","SELECT"].includes(t)||ge.value)return;if(Q="touchstart"===e.type,!Q&&(e.preventDefault(),0!==e.button))return;ee.x="touches"in e?e.touches[0].clientX:e.clientX,ee.y="touches"in e?e.touches[0].clientY:e.clientY;const i=Q?"touchmove":"mousemove",a=Q?"touchend":"mouseup";document.addEventListener(i,de,{passive:!1}),document.addEventListener(a,ce,{passive:!0})}const de=b((e=>{ae.value=!0;const t="touches"in e?e.touches[0].clientX:e.clientX,i="touches"in e?e.touches[0].clientY:e.clientY;te.x=t-ee.x,te.y=i-ee.y;const a=function(e){const{isVertical:t,isReversed:i,dragged:a,effectiveSlideSize:n}=e,l=t?a.y:a.x;if(0===l)return 0;const o=Math.round(l/n);return i?o:-o}({isVertical:z.value,isReversed:B.value,dragged:te,effectiveSlideSize:k.value});C.value=N.wrapAround?_.value+a:m({val:_.value+a,max:M.value,min:L.value}),n("drag",{deltaX:te.x,deltaY:te.y})}));function ce(){if(de.cancel(),C.value!==_.value&&!Q){const e=t=>{t.preventDefault(),window.removeEventListener("click",e)};window.addEventListener("click",e)}fe(C.value),te.x=0,te.y=0,ae.value=!1;const e=Q?"touchmove":"mousemove",t=Q?"touchend":"mouseup";document.removeEventListener(e,de),document.removeEventListener(t,ce)}function ve(){!N.autoplay||N.autoplay<=0||(I=setInterval((()=>{N.pauseAutoplayOnHover&&ie.value||he()}),N.autoplay))}function pe(){I&&(clearInterval(I),I=null)}function me(){pe(),ve()}const ge=t.ref(!1);function fe(e,t=!1){if(!t&&ge.value)return;let i=e,a=e;O.value=_.value,N.wrapAround?a=w({val:i,max:M.value,min:L.value}):i=m({val:i,max:M.value,min:L.value}),n("slide-start",{slidingToIndex:e,currentSlideIndex:_.value,prevSlideIndex:O.value,slidesCount:p.value}),pe(),ge.value=!0,_.value=i,a!==i&&be.pause(),n("update:modelValue",a);D=setTimeout((()=>{N.wrapAround&&a!==i&&(be.resume(),_.value=a,n("loop",{currentSlideIndex:_.value,slidingToIndex:e})),n("slide-end",{currentSlideIndex:_.value,prevSlideIndex:O.value,slidesCount:p.value}),ge.value=!1,me()}),N.transition)}function he(e=!1){fe(_.value+N.itemsToScroll,e)}function we(e=!1){fe(_.value-N.itemsToScroll,e)}t.watch((()=>[T.value,e.breakpoints]),(()=>F()),{deep:!0}),t.watch((()=>e.autoplay),(()=>me()));const be=t.watch((()=>e.modelValue),(e=>{e!==_.value&&fe(Number(e),!0)}));n("before-init");const Se=t.computed((()=>{if(!N.wrapAround)return{before:0,after:0};if(P.value)return{before:u.length,after:u.length};const e=Number(N.itemsToShow),t=Math.ceil(e+(N.itemsToScroll-1)),i=t-C.value,a=t-(p.value-(C.value+1));return{before:Math.max(0,i),after:Math.max(0,a)}})),ye=t.computed((()=>Se.value.before?P.value?-1*X.value.slice(-1*Se.value.before).reduce(((e,t)=>e+t[V.value]+N.gap),0):Se.value.before*k.value*-1:0)),xe=t.computed((()=>{var e;if(P.value){const t=(_.value%u.length+u.length)%u.length;return f({slideSize:null===(e=X.value[t])||void 0===e?void 0:e[V.value],viewportSize:Y.value[V.value],align:N.snapAlign})}return f({align:N.snapAlign,itemsToShow:+N.itemsToShow})})),Ae=t.computed((()=>{let e=0;if(P.value){if(e=_.value<0?-1*X.value.slice(_.value).reduce(((e,t)=>e+t[V.value]+N.gap),0):X.value.slice(0,_.value).reduce(((e,t)=>e+t[V.value]+N.gap),0),e-=xe.value,!N.wrapAround){e=m({val:e,max:X.value.reduce(((e,t)=>e+t[V.value]+N.gap),0)-Y.value[V.value]-N.gap,min:0})}}else{let t=_.value-xe.value;N.wrapAround||(t=m({val:t,max:p.value-+N.itemsToShow,min:0})),e=t*k.value}return e*(B.value?1:-1)})),Te=t.computed((()=>{var e,t;if(!P.value){const e=_.value-xe.value;return N.wrapAround?{min:Math.floor(e),max:Math.ceil(e+Number(N.itemsToShow)-1)}:{min:Math.floor(m({val:e,max:p.value-Number(N.itemsToShow),min:0})),max:Math.ceil(m({val:e+Number(N.itemsToShow)-1,max:p.value-1,min:0}))}}let i=0;{let t=0,a=0-Se.value.before;const n=Math.abs(Ae.value+ye.value);for(;t<=n;){const i=(a%u.length+u.length)%u.length;t+=(null===(e=X.value[i])||void 0===e?void 0:e[V.value])+N.gap,a++}i=a-1}let a=0;{let e=i,n=0;for(n=e<0?X.value.slice(0,e).reduce(((e,t)=>e+t[V.value]+N.gap),0)-Math.abs(Ae.value+ye.value):X.value.slice(0,e).reduce(((e,t)=>e+t[V.value]+N.gap),0)-Math.abs(Ae.value);n<Y.value[V.value];){const i=(e%u.length+u.length)%u.length;n+=(null===(t=X.value[i])||void 0===t?void 0:t[V.value])+N.gap,e++}a=e-1}return{min:Math.floor(i),max:Math.ceil(a)}})),Ne=t.computed((()=>{if("fade"===N.slideEffect)return;const e=z.value?"Y":"X",t=z.value?te.y:te.x;let i=Ae.value+t;if(!N.wrapAround&&N.preventExcessiveDragging){let e=0;e=P.value?X.value.reduce(((e,t)=>e+t[V.value]),0):(p.value-Number(N.itemsToShow))*k.value;i=m({val:i,min:B.value?0:-1*e,max:B.value?e:0})}return`translate${e}(${i}px)`})),_e=t.computed((()=>({"--vc-transition-duration":ge.value?S(N.transition,"ms"):void 0,"--vc-slide-gap":S(N.gap),"--vc-carousel-height":S(N.height),"--vc-cloned-offset":S(ye.value)}))),Ce={slideTo:fe,next:he,prev:we},Oe=t.reactive({activeSlide:C,config:N,currentSlide:_,isSliding:ge,isVertical:z,maxSlide:M,minSlide:L,nav:Ce,normalizedDir:j,slideRegistry:r,slideSize:A,slides:u,slidesCount:p,viewport:x,visibleRange:Te});t.provide(d,Oe);const Ee=t.reactive({config:N,currentSlide:_,maxSlide:M,middleSlide:E,minSlide:L,slideSize:A,slidesCount:p});return l(t.reactive(Object.assign({data:Ee,next:he,prev:we,restartCarousel:function(){F(),q(),G(),me()},slideTo:fe,updateBreakpointsConfig:F,updateSlideSize:G,updateSlidesData:q},t.toRefs(Oe)))),()=>{var e;const a=i.default||i.slides,n=(null==a?void 0:a(Ee))||[],{before:l,after:o}=Se.value,r=[...v({slides:u,position:"before",toShow:l}),...n,...v({slides:u,position:"after",toShow:o})];if(!N.enabled||!r.length)return t.h("section",{ref:h,class:["carousel","is-disabled"]},r);const s=(null===(e=i.addons)||void 0===e?void 0:e.call(i,Ee))||[],d=t.h("ol",{class:"carousel__track",style:{transform:Ne.value},onMousedownCapture:N.mouseDrag?se:null,onTouchstartPassiveCapture:N.touchDrag?se:null},r),c=t.h("div",{class:"carousel__viewport",ref:x},d);return t.h("section",{ref:h,class:["carousel",`is-${j.value}`,`is-effect-${N.slideEffect}`,{"is-vertical":z.value,"is-sliding":ge.value,"is-dragging":ae.value,"is-hover":ie.value}],dir:j.value,style:_e.value,"aria-label":N.i18n.ariaGallery,tabindex:"0",onFocus:re,onBlur:ue,onMouseenter:ne,onMouseleave:le},[c,s,t.h(y)])}}});var T;!function(e){e.arrowDown="arrowDown",e.arrowLeft="arrowLeft",e.arrowRight="arrowRight",e.arrowUp="arrowUp"}(T||(T={}));const N=e=>`icon${e.charAt(0).toUpperCase()+e.slice(1)}`,_={arrowDown:"M7.41 8.59L12 13.17l4.59-4.58L18 10l-6 6-6-6 1.41-1.41z",arrowLeft:"M15.41 16.59L10.83 12l4.58-4.59L14 6l-6 6 6 6 1.41-1.41z",arrowRight:"M8.59 16.59L13.17 12 8.59 7.41 10 6l6 6-6 6-1.41-1.41z",arrowUp:"M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"};const C=e=>e&&e in T,O=t.defineComponent({props:{name:{type:String,required:!0,validator:C},title:{type:String,default:e=>e.name?s.i18n[N(e.name)]:""}},setup(e){const i=t.inject(d,null);return()=>{const a=e.name;if(!a||!C(a))return;const n=_[a],l=t.h("path",{d:n}),o=(null==i?void 0:i.config.i18n[N(a)])||e.title,r=t.h("title",o);return t.h("svg",{class:"carousel__icon",viewBox:"0 0 24 24",role:"img","aria-label":o},[r,l])}}}),E=t.defineComponent({name:"CarouselNavigation",inheritAttrs:!1,props:{carousel:{type:Object}},setup(e,{slots:i,attrs:a}){let n=t.inject(d,null);const{next:l,prev:o}=i,r=t.computed((()=>!n.config.wrapAround&&n.currentSlide<=n.minSlide)),u=t.computed((()=>!n.config.wrapAround&&n.currentSlide>=n.maxSlide));return()=>{if(e.carousel&&(n=e.carousel),!n)return console.warn("[vue3-carousel]: A carousel component must be provided for the navigation component to display"),"";const{i18n:i}=n.config;return[t.h("button",Object.assign(Object.assign({type:"button",disabled:r.value,"aria-label":i.ariaPreviousSlide,title:i.ariaPreviousSlide,onClick:n.nav.prev},a),{class:["carousel__prev",{"carousel__prev--disabled":r.value},a.class]}),(null==o?void 0:o())||t.h(O,{name:{btt:"arrowDown",ltr:"arrowLeft",rtl:"arrowRight",ttb:"arrowUp"}[n.normalizedDir]})),t.h("button",Object.assign(Object.assign({type:"button",disabled:u.value,"aria-label":i.ariaNextSlide,title:i.ariaNextSlide,onClick:n.nav.next},a),{class:["carousel__next",{"carousel__next--disabled":u.value},a.class]}),(null==l?void 0:l())||t.h(O,{name:{btt:"arrowUp",ltr:"arrowRight",rtl:"arrowLeft",ttb:"arrowDown"}[n.normalizedDir]}))]}}}),M=t.defineComponent({name:"CarouselPagination",props:{disableOnClick:{type:Boolean},paginateByItemsToShow:{type:Boolean},carousel:{type:Object}},setup(e){let i=t.inject(d,null);const a=t.computed((()=>i.config.itemsToShow)),n=t.computed((()=>f({align:i.config.snapAlign,itemsToShow:a.value}))),l=t.computed((()=>e.paginateByItemsToShow&&a.value>1)),o=t.computed((()=>Math.ceil((i.activeSlide-n.value)/a.value))),r=t.computed((()=>Math.ceil(i.slidesCount/a.value))),u=e=>w(l.value?{val:o.value,max:r.value-1,min:0}:{val:i.activeSlide,max:i.maxSlide,min:i.minSlide})===e;return()=>{var a,o;if(e.carousel&&(i=e.carousel),!i)return console.warn("[vue3-carousel]: A carousel component must be provided for the pagination component to display"),"";const s=[];for(let d=l.value?0:i.minSlide;d<=(l.value?r.value-1:i.maxSlide);d++){const r=h(i.config.i18n[l.value?"ariaNavigateToPage":"ariaNavigateToSlide"],{slideNumber:d+1}),c=u(d),v=t.h("button",{type:"button",class:{"carousel__pagination-button":!0,"carousel__pagination-button--active":c},"aria-label":r,"aria-pressed":c,"aria-controls":null===(o=null===(a=i.slides[d])||void 0===a?void 0:a.exposed)||void 0===o?void 0:o.id,title:r,disabled:e.disableOnClick,onClick:()=>i.nav.slideTo(l.value?Math.floor(d*+i.config.itemsToShow+n.value):d)}),p=t.h("li",{class:"carousel__pagination-item",key:d},v);s.push(p)}return t.h("ol",{class:"carousel__pagination"},s)}}}),L=t.defineComponent({name:"CarouselSlide",props:{id:{type:String,default:e=>e.isClone?void 0:t.useId()},index:{type:Number,default:void 0},isClone:{type:Boolean,default:!1}},setup(e,{attrs:i,slots:a,expose:n}){const l=t.inject(d);if(t.provide(d,void 0),!l)return()=>"";const o=t.ref(e.index),r=t.getCurrentInstance();n({id:e.id,setIndex:e=>{o.value=e},getBoundingRect:()=>{const e=r.vnode.el;return e?e.getBoundingClientRect():{width:0,height:0}}});const u=t.computed((()=>o.value===l.activeSlide)),s=t.computed((()=>o.value===l.activeSlide-1)),c=t.computed((()=>o.value===l.activeSlide+1)),v=t.computed((()=>o.value>=l.visibleRange.min&&o.value<=l.visibleRange.max)),m=t.computed((()=>{if("auto"===l.config.itemsToShow)return;const e=l.config.itemsToShow,t=l.config.gap>0&&e>1?`calc(${100/e}% - ${l.config.gap*(e-1)/e}px)`:100/e+"%";return l.isVertical?{height:t}:{width:t}}));return l.slideRegistry.registerSlide(r,e.index),t.onUnmounted((()=>{l.slideRegistry.unregisterSlide(r)})),e.isClone&&(t.onMounted((()=>{p(r.vnode)})),t.onUpdated((()=>{p(r.vnode)}))),()=>{var n,r;return l.config.enabled?t.h("li",{style:[i.style,Object.assign({},m.value)],class:{carousel__slide:!0,"carousel__slide--clone":e.isClone,"carousel__slide--visible":v.value,"carousel__slide--active":u.value,"carousel__slide--prev":s.value,"carousel__slide--next":c.value,"carousel__slide--sliding":l.isSliding},onFocusin:()=>{l.viewport&&(l.viewport.scrollLeft=0),l.nav.slideTo(o.value)},id:e.isClone?void 0:e.id,"aria-hidden":e.isClone||void 0},null===(r=a.default)||void 0===r?void 0:r.call(a,{currentIndex:o.value,isActive:u.value,isClone:e.isClone,isPrev:s.value,isNext:c.value,isSliding:l.isSliding,isVisible:v.value})):null===(n=a.default)||void 0===n?void 0:n.call(a)}}});e.BREAKPOINT_MODE_OPTIONS=i,e.Carousel=A,e.DEFAULT_CONFIG=s,e.DIR_MAP=a,e.DIR_OPTIONS=n,e.I18N_DEFAULT_CONFIG=l,e.Icon=O,e.NORMALIZED_DIR_OPTIONS=o,e.Navigation=E,e.Pagination=M,e.SLIDE_EFFECTS=r,e.SNAP_ALIGN_OPTIONS=u,e.Slide=L,e.createSlideRegistry=c,e.icons=_,e.injectCarousel=d}));
//# sourceMappingURL=carousel.min.js.map