1import{Component}from"@theme/component";import{ThemeEvents,SlideshowSelectEvent}from"@theme/events";class GRProductGallery extends Component{#controller=null;#currentIndex=0;connectedCallback(){super.connectedCallback(),this.#controller?.abort(),this.#controller=new AbortController,this.#currentIndex=this.#normalizeIndex(this.initialIndex),this.#attachEventListeners(),this.#render();const{signal}=this.#controller;this.closest(".shopify-section, dialog")?.addEventListener(ThemeEvents.variantUpdate,this.#handleVariantUpdate,{signal})}disconnectedCallback(){super.disconnectedCallback(),this.#controller?.abort()}get initialIndex(){const raw=this.dataset.initialIndex,parsed=raw==null?0:parseInt(raw,10);return Number.isNaN(parsed)?0:parsed}get slideCount(){return this.refs.desktopSlides?.length??this.refs.mobileSlideshow?.slides?.length??0}#attachEventListeners(){if(!this.#controller)return;const{signal}=this.#controller;this.refs.dotButtons?.forEach(button=>{button.addEventListener("click",this.#handleControlClick,{signal})}),this.refs.thumbnailButtons?.forEach(button=>{button.addEventListener("click",this.#handleControlClick,{signal})});const{mobileSlideshow}=this.refs;mobileSlideshow&&mobileSlideshow.addEventListener(SlideshowSelectEvent.eventName,this.#handleSlideshowSelect,{signal})}#handleVariantUpdate=event=>{const source=event.detail.data.html;if(!source)return;const newGallery=source.querySelector("gr-product-gallery");newGallery&&this.replaceWith(newGallery)};#handleControlClick=event=>{const target=event.currentTarget;if(!(target instanceof HTMLElement))return;const index=parseInt(target.dataset.index??"",10);Number.isNaN(index)||this.#setIndex(index)};#handleSlideshowSelect=event=>{const{index}=event.detail;index!==this.#currentIndex&&(this.#currentIndex=this.#normalizeIndex(index),this.#updateControls(),this.#updateDesktopSlides())};#setIndex(index){const nextIndex=this.#normalizeIndex(index);this.#currentIndex=nextIndex,this.#render();const{mobileSlideshow}=this.refs;mobileSlideshow&&mobileSlideshow.select(nextIndex)}#normalizeIndex(index){const count=this.slideCount;return count===0||index>=count?0:index<0?count-1:index}#render(){this.#updateDesktopSlides(),this.#updateControls()}#updateDesktopSlides(){this.refs.desktopSlides?.forEach((slide,index)=>{const isActive=index===this.#currentIndex;slide.style.opacity=isActive?"1":"0",slide.style.pointerEvents=isActive?"":"none",slide.setAttribute("aria-hidden",String(!isActive))})}#updateControls(){this.refs.dotButtons?.forEach((button,index)=>{const isActive=index===this.#currentIndex;button.setAttribute("aria-selected",String(isActive)),this.#setDotState(button,isActive)}),this.refs.thumbnailButtons?.forEach((button,index)=>{const isActive=index===this.#currentIndex;button.setAttribute("aria-selected",String(isActive)),this.#setThumbnailState(button,isActive)})}#setDotState(button,isActive){button.classList.toggle("bg-black-warm",isActive),button.classList.toggle("border-black-warm",!0),button.classList.toggle("bg-transparent",!isActive)}#setThumbnailState(button,isActive){button.classList.toggle("border-black-warm",isActive),button.classList.toggle("border-transparent",!isActive);const thumbnailImage=button.querySelector("img");thumbnailImage instanceof HTMLElement&&(thumbnailImage.classList.toggle("ring-2",isActive),thumbnailImage.classList.toggle("ring-white",isActive),thumbnailImage.classList.toggle("ring-offset-1",isActive),thumbnailImage.classList.toggle("ring-transparent",!isActive))}}customElements.get("gr-product-gallery")||customElements.define("gr-product-gallery",GRProductGallery); 2//# sourceMappingURL=/cdn/shop/t/410/assets/gr-product-gallery.js.map?v=9579906774590296301790179511
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.