@ussebastian/kitdigital/dist/js/CarouselV2.js

Kit Digital de la Universidad San Sebastián

/*! @ussebastian/kitdigital v0.21.0 | MIT (c) Asimov Consultores SpA - 2025 */
import{E as t}from"./embla-carousel.esm.js";const e={active:!0,breakpoints:{},delay:4e3,jump:!1,playOnInit:!0,stopOnFocusIn:!0,stopOnInteraction:!0,stopOnMouseEnter:!1,stopOnLastSnap:!1,rootNode:null};function s(t={}){let i,n,o,a=!1,r=!0,l=!1,h=0;function c(){if(o)return;if(!r)return;a||n.emit("autoplay:play");const{ownerWindow:t}=n.internalEngine();t.clearInterval(h),h=t.setInterval(y,i.delay),a=!0}function u(){if(o)return;a&&n.emit("autoplay:stop");const{ownerWindow:t}=n.internalEngine();t.clearInterval(h),h=0,a=!1}function d(){if(p())return r=a,u();r&&c()}function p(){const{ownerDocument:t}=n.internalEngine();return"hidden"===t.visibilityState}function g(t){void 0!==t&&(l=t),r=!0,c()}function y(){const{index:t}=n.internalEngine(),e=t.clone().add(1).get(),s=n.scrollSnapList().length-1;i.stopOnLastSnap&&e===s&&u(),n.canScrollNext()?n.scrollNext(l):n.scrollTo(0,l)}return{name:"autoplay",options:t,init:function(a,h){n=a;const{mergeOptions:g,optionsAtMedia:y}=h,b=g(e,s.globalOptions),v=g(b,t);if(i=y(v),n.scrollSnapList().length<=1)return;l=i.jump,o=!1;const{eventStore:f,ownerDocument:m}=n.internalEngine(),A=n.rootNode(),I=i.rootNode&&i.rootNode(A)||A,S=n.containerNode();n.on("pointerDown",u),i.stopOnInteraction||n.on("pointerUp",c),i.stopOnMouseEnter&&(f.add(I,"mouseenter",(()=>{r=!1,u()})),i.stopOnInteraction||f.add(I,"mouseleave",(()=>{r=!0,c()}))),i.stopOnFocusIn&&(f.add(S,"focusin",u),i.stopOnInteraction||f.add(S,"focusout",c)),f.add(m,"visibilitychange",d),i.playOnInit&&!p()&&c()},destroy:function(){n.off("pointerDown",u).off("pointerUp",c),u(),o=!0,a=!1},play:g,stop:function(){a&&u()},reset:function(){a&&g()},isPlaying:function(){return a}}}s.globalOptions=void 0;const i={active:!0,breakpoints:{},snapped:"is-snapped",inView:"is-in-view",draggable:"is-draggable",dragging:"is-dragging"};function n(t,e){if(!t||!e)return;const{classList:s}=t;s.contains(e)&&s.remove(e)}function o(t,e){if(!t||!e)return;const{classList:s}=t;s.contains(e)||s.add(e)}function a(t={}){let e,s,r,l;const h=["select"],c=["pointerDown","pointerUp"],u=["slidesInView"];function d(t,s){"pointerDown"===s?o(r,e.dragging):n(r,e.dragging)}function p(t,e){const i=s.containerNode().querySelectorAll(`.${e}`);var a;(a=i,Array.from(a)).forEach((t=>n(t,e))),t.forEach((t=>o(l[t],e)))}function g(){const{slideRegistry:t}=s.internalEngine();p(t[s.selectedScrollSnap()],e.snapped)}function y(){p(s.slidesInView(),e.inView)}return{name:"classNames",options:t,init:function(n,p){s=n;const{mergeOptions:b,optionsAtMedia:v}=p,f=b(i,a.globalOptions),m=b(f,t);e=v(m),r=s.rootNode(),l=s.slideNodes(),!!s.internalEngine().options.watchDrag&&o(r,e.draggable),e.dragging&&c.forEach((t=>s.on(t,d))),e.snapped&&(h.forEach((t=>s.on(t,g))),g()),e.inView&&(u.forEach((t=>s.on(t,y))),y())},destroy:function(){n(r,e.draggable),c.forEach((t=>s.off(t,d))),h.forEach((t=>s.off(t,g))),u.forEach((t=>s.off(t,y))),l.forEach((t=>n(t,e.snapped)))}}}a.globalOptions=void 0;class r{constructor(t,e){this.key=e,this.isCarouselActive=!1,this.element=t,this.baseClass="uss-carousel-v2",this.emblaApi=null,this.autoplayOnInit=!0,this.autoplayDelay=2e4,this.jumpInsteadOfScroll=!1,this.carouselLoop=!1,this.progress=0,this.progressIndicatorType="stripe",this.wasPausedByVisibilityChange=!1,this.rootNode=this.element,this.controlsContainer=this.findElement("controls"),this.viewportNode=this.findElement("viewport"),this.prevBtn=this.findElement("prev"),this.nextBtn=this.findElement("next"),this.playBtn=this.findElement("play"),this.shortcutNode=this.findElement("shortcuts"),this.skipNavButton=this.findElement("skip-navigation"),this.shortcutButtons=[],this.autoplayInstance=null,this.slideNodes=[],this.slideContainer=null,this.whiteContrast=!0,this.whenProgressIsOver100=[],this.everyProgressUpdate=[],this.focusableSelectors=["a[href]","button","[tabindex]:not([tabindex='-1'])","input","select","textarea"],this.carouselType=null,this.mouseEnterTimeout=null,this.slidesToScroll=1,this.carouselOffset=0,this.handleSetupInput()}getSlideToScroll(){const t=this.viewportNode.offsetWidth,e=this.slideNodes[0].offsetWidth;return Math.floor((t-this.carouselOffset)/e)}getCarouselOffset(){if(!this.controlsContainer)throw new Error("controlsContainer is not defined.");let t=this.controlsContainer.getBoundingClientRect().left,e=this.controlsContainer.parentElement;for(;e&&!e.classList.contains("container");){if("HTML"===e.nodeName){e=null;break}e=e.parentElement}if(e){t-=e.getBoundingClientRect().left}this.carouselOffset=t}handleSetupInput(){this.carouselType=this.element.dataset.ucCarouselType||"hero"}canAutoplay(t){return!["cards"].includes(this.carouselType)&&t}setupEmbla(){this.emblaApi=t(this.viewportNode,{loop:this.carouselLoop,slidesToScroll:this.slidesToScroll},[s({playOnInit:this.canAutoplay(this.autoplayOnInit),delay:31536e8,jump:!0}),a({snapped:`${this.baseClass}__slide--snapped`,inView:"",draggable:"",dragging:""})]),this.autoplayInstance=this.emblaApi.plugins().autoplay,this.slideNodes=this.emblaApi.slideNodes(),this.slideContainer=this.emblaApi.containerNode(),this.whenProgressIsOver100.push((()=>{this.emblaApi.canScrollNext()?this.emblaApi.scrollNext(this.jumpInsteadOfScroll):this.emblaApi.scrollTo(0,this.jumpInsteadOfScroll)}))}mount(){this.setupEmbla(),this.setupEventListeners(),this.getCarouselOffset()}addElements(){["cards"].includes(this.carouselType)&&this.addOffset(),this.addShortcutButtons(),this.addSkipNavButton(),this.addProgressIndicator(),this.addIcons(),this.announceSlide()}postInitialization(){this.addElements(),this.setupProgressHandler(),this.onChangeSlide(),this.ARIA_rootNode(),this.ARIA_slides(),this.ARIA_navigationControls(),this.ARIA_shortcuts(),this.reduceMotionGuard()}onReinit(){this.getCarouselOffset(),["cards"].includes(this.carouselType)&&this.addOffset()}onChangeSlide(){this.announceSlide(),this.updateSlidesTabIndexes(),this.toggleNavigationButtonsState(),this.toggleActiveShortcutButton(),this.toggleSkipNavButtonVisibility(),this.progress=0,this.progressIndicator&&this.progressIndicator.style.setProperty("--progress",`${this.progress}%`),this.toggleActiveShortcutButton()}setupProgressHandler(){this.interval=setInterval((()=>{!1!==this.autoplayInstance.isPlaying()?(this.progress+=.1,this.everyProgressUpdate.map((t=>t())),this.progress>=100&&this.whenProgressIsOver100.map((t=>t()))):clearInterval(this.interval)}),this.autoplayDelay/1e3)}announceSlide(){const t=this.emblaApi.selectedScrollSnap();let e=this.rootNode.querySelector(`.${this.baseClass}__slide-announcer`);e||(e=document.createElement("label"),e.classList.add(`${this.baseClass}__slide-announcer`),e.classList.add("uss-sr-only"),e.setAttribute("aria-live",this.autoplayOnInit?"off":"polite"),this.rootNode.appendChild(e)),e.innerHTML=`Diapositiva ${t+1} de ${this.slideNodes.length}:`}updateSlidesTabIndexes(){const t=this.emblaApi.selectedScrollSnap();this.emblaApi.slideNodes().forEach(((e,s)=>{const i=s===t;e.querySelectorAll(this.focusableSelectors.join(",")).forEach((t=>{t.setAttribute("tabindex",i?"0":"-1")}))}))}toggleAutoplay(){this.autoplayInstance.isPlaying()?this.autoplayInstance.stop():this.autoplayInstance.play()}toggleNavigationButtonsState(){this.prevBtn.disabled=!this.emblaApi.canScrollPrev(),this.nextBtn.disabled=!this.emblaApi.canScrollNext()}toggleActiveShortcutButton(){const t=this.emblaApi.selectedScrollSnap();this.shortcutButtons.forEach(((e,s)=>{s===t?(e.classList.add(`${this.baseClass}__shortcut--active`),e.setAttribute("aria-disabled","true"),e.removeAttribute("tabindex")):(e.classList.remove(`${this.baseClass}__shortcut--active`),e.removeAttribute("aria-disabled"),e.setAttribute("tabindex","-1"))}))}toggleAutoplayOnVisibilityChange(){this.wasPausedByVisibilityChange=!1,document.addEventListener("visibilitychange",(()=>{"hidden"===document.visibilityState?this.autoplayInstance.isPlaying()&&(this.autoplayInstance.stop(),this.wasPausedByVisibilityChange=!0):"visible"===document.visibilityState&&!this.autoplayInstance.isPlaying()&&this.wasPausedByVisibilityChange&&(this.autoplayInstance.play(),this.wasPausedByVisibilityChange=!1)}))}toggleSkipNavButtonVisibility(){const t=this.emblaApi.selectedScrollSnap();this.emblaApi.slideNodes()[t].querySelector(this.focusableSelectors.join(","))?(this.skipNavButton.setAttribute("tabindex","0"),this.skipNavButton.setAttribute("aria-hidden","false")):(this.skipNavButton.setAttribute("tabindex","-1"),this.skipNavButton.setAttribute("aria-hidden","true"))}addIcons(){const t=this.whiteContrast?"uss-icon--color-white icon-background--white":"";this.prevBtn&&(this.prevBtn.innerHTML=`<i class='uss-icon ri-arrow-left-s-line ${t} '></i>`),this.nextBtn&&(this.nextBtn.innerHTML=`<i class='uss-icon ri-arrow-right-s-line ${t} '></i>`),this.playBtn&&(this.playBtn.innerHTML=this.autoplayInstance.isPlaying()?"<i class='uss-icon icon-color--white'>pause</i>":"<i class='uss-icon icon-color--white'>play_arrow</i>",this.playBtn.setAttribute("aria-label",this.autoplayInstance.isPlaying()?"Pausar reproducción automática":"Reproducción automática"))}addOffset(){this.carouselOffset&&this.viewportNode&&this.viewportNode.style.setProperty("--carousel-offset",`${this.carouselOffset}px`)}addShortcutButtons(){this.shortcutNode&&(this.shortcutNode.innerHTML="",this.emblaApi.scrollSnapList().forEach(((t,e)=>{const s=this.createShortcutButton(e+1);this.shortcutButtons[e]=s})),this.shortcutButtons.forEach(((t,e)=>{this.attachShortcutButtonEvents(t,e),this.shortcutNode.appendChild(t)})),this.toggleActiveShortcutButton())}createShortcutButton(t){let e;t<10&&(e=`0${t}`);const s=this.createElement("shortcut","button");return s.setAttribute("type","button"),s.style.setProperty("--slide-index",`"${e}"`),s}canHaveProgressIndicator(){return!["cards"].includes(this.carouselType)}addProgressIndicator(){this.canHaveProgressIndicator()&&(this.progressIndicator=this.createElement(`progress-indicator--${this.progressIndicatorType}`),this.everyProgressUpdate.push((()=>{const t="circle"===this.progressIndicatorType?0:2;this.progressIndicator.style.setProperty("--progress",`${Number(this.progress).toFixed(t)}%`)})),this.rootNode.appendChild(this.progressIndicator))}addSkipNavButton(){this.skipNavButton.setAttribute("tabindex","-1"),this.skipNavButton.setAttribute("aria-hidden","true"),this.skipNavButton.innerHTML="Saltar al contenido de la diapositiva",this.skipNavButton.addEventListener("keydown",(t=>{this.handleSkipNavButtonKeyDown(t)}))}setupEventListeners(){this.emblaEventListeners(),this.clickEventListeners(),this.hoverEventListeners()}emblaEventListeners(){this.emblaApi.on("init",this.postInitialization.bind(this)),this.emblaApi.on("reInit",this.onReinit.bind(this)),this.emblaApi.on("select",this.onChangeSlide.bind(this)),this.emblaApi.on("destroy",this.cleanup.bind(this)),this.emblaApi.on("autoplay:play",(()=>{this.setupProgressHandler(),this.playBtn&&(this.playBtn.innerHTML="<i class='uss-icon icon-color--white'>pause</i>",this.playBtn.setAttribute("aria-label","Pausar reproducción automática"))})),this.emblaApi.on("autoplay:stop",(()=>{this.playBtn&&(this.playBtn.innerHTML="<i class='uss-icon icon-color--white'>play_arrow</i>",this.playBtn.setAttribute("aria-label","Reproducción automática"))})),this.emblaApi.on("resize",(()=>{setTimeout((()=>{this.setupProgressHandler()}),1e3),["cards"].includes(this.carouselType)&&(this.slidesToScroll=this.getSlideToScroll(),this.emblaApi.reInit())}))}clickEventListeners(){this.prevBtn&&this.prevBtn.addEventListener("click",(()=>{this.emblaApi.scrollPrev(this.jumpInsteadOfScroll),this.autoplayInstance.stop()})),this.nextBtn&&this.nextBtn.addEventListener("click",(()=>{this.emblaApi.scrollNext(this.jumpInsteadOfScroll),this.autoplayInstance.stop()})),this.playBtn&&this.playBtn.addEventListener("click",(()=>{this.toggleAutoplay()}))}hoverEventListeners(){const t=t=>{t.addEventListener("mouseenter",(()=>{const t=this.autoplayInstance.isPlaying();this.mouseEnterTimeout=setTimeout((()=>{t&&(this.viewportNode.setAttribute("data-uss-stopped-by-hover","true"),this.autoplayInstance&&this.autoplayInstance.stop())}),1e3)}))},e=t=>{t.addEventListener("mouseleave",(()=>{clearTimeout(this.mouseEnterTimeout);if(this.viewportNode.getAttribute("data-uss-stopped-by-hover")){if(!this.autoplayInstance)return;this.autoplayInstance.play(),this.viewportNode.removeAttribute("data-uss-stopped-by-hover")}}))};[this.viewportNode].forEach((s=>{t(s),e(s)}))}handleSkipNavButtonKeyDown(t){if("Enter"===t.key||" "===t.key){t.preventDefault();const e=this.emblaApi.selectedScrollSnap(),s=this.emblaApi.slideNodes()[e],i=s.querySelector(this.focusableSelectors.join(","));i?i.focus():s.focus()}}setShortcutFocus(t){const e=this.shortcutButtons[t];e&&e.focus()}attachShortcutButtonEvents(t,e){t.addEventListener("click",(()=>{this.emblaApi.scrollTo(e,this.jumpInsteadOfScroll),this.autoplayInstance.stop()})),t.addEventListener("keydown",(t=>{if("ArrowLeft"===t.key||"ArrowUp"===t.key){t.preventDefault();const s=0===e?this.shortcutButtons.length-1:e-1;this.setShortcutFocus(s)}if("ArrowRight"===t.key||"ArrowDown"===t.key){t.preventDefault();const s=e===this.shortcutButtons.length-1?0:e+1;this.setShortcutFocus(s)}}))}ARIA_rootNode(){this.rootNode.setAttribute("role","region"),this.rootNode.setAttribute("aria-roledescription","carousel")}ARIA_navigationControls(){this.prevBtn.setAttribute("aria-label","diapositiva anterior"),this.nextBtn.setAttribute("aria-label","diapositiva siguiente")}ARIA_slides(){this.slideContainer.setAttribute("aria-atomic","false"),this.slideNodes.forEach((t=>{t.setAttribute("role","group"),t.setAttribute("aria-roledescription","slide")})),this.slideNodes.forEach(((t,e)=>{const s=this.getSlideId(t,e);s?t.setAttribute("aria-labelledby",s):t.setAttribute("aria-label",`Diapositiva ${e+1} de ${this.slideNodes.length}`)}))}ARIA_shortcuts(){if(!this.shortcutNode)return;this.shortcutNode.setAttribute("role","group"),this.shortcutNode.setAttribute("aria-label","Elige una diapositiva para mostrar");this.shortcutNode.querySelectorAll("button").forEach(((t,e)=>{const s=this.slideNodes[e],i=this.getSlideId(s,e);i?t.setAttribute("aria-labelledby",i):t.setAttribute("aria-label",`Diapositiva ${e+1} de ${this.slideNodes.length}`)}))}reduceMotionGuard(){window.matchMedia("(prefers-reduced-motion: reduce)").matches&&setTimeout((()=>{const t=this.emblaApi?.plugins()?.autoplay?.isPlaying();t&&(this.jumpInsteadOfScroll=!0,this.autoplayInstance.stop(),this.progress=0,this.progressIndicator.style.setProperty("--progress",`${this.progress}%`))}),10)}findElement(t){return this.rootNode.querySelector(`.${this.baseClass}__${t}`)}createElement(t,e="div"){const s=document.createElement(e);return s.classList.add(`${this.baseClass}__${t}`),s}cleanup(){this.prevBtn&&this.prevBtn.removeEventListener("click",this.handlePrevButtonClick),this.nextBtn&&this.nextBtn.removeEventListener("click",this.handleNextButtonClick),this.playBtn&&this.playBtn.removeEventListener("click",this.onPlayBtnClick),this.skipNavButton&&this.skipNavButton.removeEventListener("keydown",this.handleSkipNavButtonKeyDown),this.rootNode=null,this.viewportNode=null,this.prevBtn=null,this.nextBtn=null,this.playBtn=null,this.shortcutNode=null,this.skipNavButton=null,this.shortcutButtons=[],this.autoplayInstance=null,this.slideNodes=[],this.slideContainer=null,this.whenProgressIsOver100=[],this.everyProgressUpdate=[],this.progressIndicator=null}getSlideId(t){const e=t.getAttribute("aria-labelledby");return e||null}}export{r as CarouselV2};