https://vinegarsyndrome.com/cdn/shop/t/202/assets/product-suggesti…?v=173906264446416811141790888484

1import{ThemeEvents}from"@theme/events";const SF_API_VERSION="2026-07",MAX_POOL=60,PAGE_SIZE=250,MAX_PAGES=3,MIN_GENRE_POOL=12,CONCURRENCY=6,isDesignMode=()=>!!window.Shopify?.designMode;class VoltageProductSuggestion extends HTMLElement{#loaded=!1;#tiers=[];#pool=[];#cursor=0;#displayed=[];#cardCache=new Map;#badges=new Map;#available=new Map;#spinning=!1;#details=null;#onToggle=null;#observer=new IntersectionObserver((entries,observer)=>{entries[0]?.isIntersecting&&(observer.disconnect(),this.#load())},{rootMargin:"0px 0px 400px 0px"});connectedCallback(){if(this.#details=this.closest("details"),isDesignMode()){this.#load();return}this.#observer.observe(this.#details||this),this.#details&&(this.#onToggle=()=>{this.#details.open&&this.#load()},this.#details.addEventListener("toggle",this.#onToggle))}disconnectedCallback(){this.#observer.disconnect(),this.#details&&this.#onToggle&&this.#details.removeEventListener("toggle",this.#onToggle)}async#load(){if(this.#loaded)return;this.#loaded=!0;const token=this.dataset.storefrontToken?.trim(),count=parseInt(this.dataset.count,10)||4;if(!token){this.#fail("Missing Storefront API token");return}try{const source=this.dataset.source;if(source==="genre")this.#tiers=await this.#genreTiers(token);else if(source==="cast")this.#tiers=await this.#castTiers(token);else if(source==="vendor")this.#tiers=await this.#vendorTiers(token);else throw new Error(`Unknown source "${source}"`);if(this.#tiers=this.#tiers.filter(t=>t.length),this.#tiers.length===0){this.#fail("No matches");return}this.#rebuildPool();const cards=await this.#collectValidCards(count);if(cards.length===0){this.#fail("No renderable cards");return}this.#displayed=cards.map(c=>c.handle),this.#renderInto(cards),this.#clearUnused(cards.length),this.#initShuffle(),this.dispatchEvent(new CustomEvent(ThemeEvents?.recommendationsLoaded||"recommendations:loaded",{bubbles:!0}))}catch(error){this.#fail(error)}}get#randomize(){return this.dataset.randomize!=="false"}#json(name,fallback=[]){try{return JSON.parse(this.dataset[name]||"null")??fallback}catch{return fallback}}async#genreTiers(token){const vs=await this.#vsGenreTiers(token);if(vs.reduce((n,t)=>n+t.length,0)>=MIN_GENRE_POOL)return vs;const seen=new Set(vs.flat()),fallback=await this.#taxonomyGenreTiers(token);return[...vs,...fallback.map(t=>t.filter(h=>!seen.has(h)))]}async#vsGenreTiers(token){const names=[...new Set(this.#json("vsGenres").filter(v=>typeof v=="string").map(v=>v.trim()).filter(Boolean))];if(names.length===0)return[];const sets=await Promise.all(names.map(value=>this.#searchByFilter(token,{productMetafield:{namespace:"custom",key:"vs_genre",value}},{genres:"vs",requireFilter:"filter.p.m.custom.vs_genre"}).catch(()=>[]))),size=x=>x.size||1/0,order=names.map((name,i)=>({g:name.toLowerCase(),size:sets[i].length,i})).sort((a,b)=>size(a)-size(b)||a.i-b.i).map(x=>x.g),current=this.dataset.productHandle,candidates=new Map;sets.forEach((rows,i)=>{const g=names[i].toLowerCase();for(const{handle,genres:gset}of rows)!handle||handle===current||(candidates.has(handle)||candidates.set(handle,new Set(gset)),candidates.get(handle).add(g))});const ranked=this.#rankByOverlap(order,candidates);return this.#debug("genre (vs_genre)",{genres:names,hits:sets.map(s=>

1s.length),candidates:candidates.size,tiers:ranked.keys}),ranked.tiers}async#taxonomyGenreTiers(token){const genres=this.#json("genres").filter(g=>g?.handle),order=[...new Set(genres.map(g=>g.handle))],gids=[...new Set(genres.map(g=>g.gid).filter(Boolean))];if(order.length===0||gids.length===0)return[];const sets=await Promise.all(gids.map(gid=>this.#searchByFilter(token,{taxonomyMetafield:{namespace:"shopify",key:"genre",value:gid}},{genres:"taxonomy"}).catch(()=>[]))),current=this.dataset.productHandle,candidates=new Map;for(const set of sets)for(const{handle,genres:gset}of set)handle&&handle!==current&&!candidates.has(handle)&&candidates.set(handle,gset);const ranked=this.#rankByOverlap(order,candidates);return this.#debug("genre (shopify.genre)",{genres:genres.map(g=>`${g.label} (${g.handle})`),seeds:gids,candidates:candidates.size,tiers:ranked.keys}),ranked.tiers}#rankByOverlap(order,candidates){const weight=g=>order.length-order.indexOf(g),byKey=new Map;for(const[handle,gset]of candidates){let overlap=0,w=0;for(const g of order)gset.has(g)&&(overlap++,w+=weight(g));if(overlap===0)continue;const key=`${overlap}:${w}`;byKey.has(key)||byKey.set(key,[]),byKey.get(key).push(handle)}const sorted=[...byKey.entries()].sort((a,b)=>{const[ao,aw]=a[0].split(":").map(Number),[bo,bw]=b[0].split(":").map(Number);return bo-ao||bw-aw});return{tiers:sorted.map(([,handles])=>handles),keys:sorted.map(([key,handles])=>`${key} \u2192 ${handles.length}`)}}async#searchByFilter(token,filter,{genres="",requireFilter=""}={}){const genreField=genres==="taxonomy"?'genre: metafield(namespace: "shopify", key: "genre") { references(first: 10) { nodes { ... on Metaobject { handle } } } }':genres==="vs"?'vsGenre: metafield(namespace: "custom", key: "vs_genre") { value }':"",query=withFilterIds=>`query Suggest($filters: [ProductFilter!], $after: String) {
2      search(query: "", first: ${PAGE_SIZE}, after: $after, types: PRODUCT, unavailableProducts: SHOW, productFilters: $filters) {
3        pageInfo { hasNextPage endCursor }
4        ${withFilterIds?"productFilters { id }":""}
5        nodes { ... on Product { handle availableForSale ${genreField} } }
6      }
7    }`,out=[];let after=null;for(let page=0;page<MAX_PAGES;page++){const check=!!requireFilter&&page===0,search=(await this.#graphql(token,query(check),{filters:[filter],after}))?.search;if(check&&!(search?.productFilters||[]).some(f=>f?.id===requireFilter))return[];for(const n of search?.nodes||[])n?.handle&&(this.#available.set(n.handle,n.availableForSale!==!1),out.push({handle:n.handle,available:n.availableForSale!==!1,genres:this.#nodeGenres(n)}));if(!search?.pageInfo?.hasNextPage)break;after=search.pageInfo.endCursor}return out}#nodeGenres(n){if(n.genre)return new Set((n.genre.references?.nodes||[]).map(r=>r.handle).filter(Boolean));if(n.vsGenre?.value)try{const list=JSON.parse(n.vsGenre.value);if(Array.isArray(list))return new Set(list.map(v=>String(v).trim().toLowerCase()).filter(Boolean))}catch{}return new Set}async#castTiers(token){const dims=[];this.dataset.enableDirectors!=="false"&&dims.push({key:"directors",role:"Director",values:this.#json("directors")}),this.dataset.enableActors!=="false"&&dims.push({key:"actors",role:"Actor",values:this.#json("actors")});const queries=[];for(const d of dims)for(const value of d.values)typeof value=="string"&&value.trim()&&queries.push({key:d.key,role:d.role,value:value.trim()});if(queries.length===0)return[];const current=this.dataset.productHandle,results=await this.#mapLimit(queries,CONCURRENCY,async q=>{try{const rows=await this.#searchByFilter(token,{productMetafield:{namespace:"custom",key:q.key,value:q.value}});return rows.some(r=>r.handle===current)?rows.filter(r=>r.handle!==current).map(r=>r.handle):[]}catch{return[]}});return this.#badges=new Map,results.forEach((handles,i)=>{const q=queries[i];for(const handle of handles)!handle||handle===current||this.#badges.has(handle)||this.#badges.set(handle,{role:q.role,person:q.value,key:q.key})}),this.#debug("cast",{queries:queries.map(q=>`${q.key}=${q.value}`),hits:results.map(r=>r.length),matches:this.#badges.size}),[[...this.#badges.keys()]]}async#vendorTiers(token){const vendor=(this.dataset.vendor||"").trim();if(!vendor)return[];const query=`query Vendor($q: String!, $first: Int!) {
8      products(first: $first, sortKey: CREATED_AT, reverse: true, query: $q) {
9        nodes { handle availableForSale }
10      }
11    }`,q=`vendor:"${vendor.replace(/"/g,'\\"')}"`,data=await this.#graphql(token,query,{q,first:MAX_POOL+1}),current=this.dataset.productHandle,nodes=(data?.products?.nodes||[]).filter(n=>n?.handle&&n.handle!==current);for(const n of nodes)this.#available.set(n.handle,n.availableForSale!==!1);const handles=nodes.map(n=>n.handle);return this.#debug("vendor",{vendor,hits:handles.length}),[handles]}async#graphql(token,query,variables){const response=await fetch(`${window.Shopify.routes.root}api/${SF_API_VERSION}/graphql.json`,{method:"POST",headers:{"Content-Type":"application/json","X-Shopify-Storefront-Access-Token":token},body:JSON.stringify({query,variables})});if(!response.ok)throw new Error(`Storefront API ${response.status}`);const json=await response.json();if(json.errors?.length)throw new Error(json.errors.map(e=>e.message).join("; "));return json.data}async#mapLimit(items,limit,fn){const out=new Array(items.length);let next=0;const worker=async()=>{for(;next<items.length;){const i=next++;out[i]=await fn(items[i],i)}};return await Promise.all(Array.from({length:Math.min(limit,items.length)},worker)),out}#rebuildPool(){const mode=this.dataset.soldOut||"last",isAvailable=h=>this.#available.get(h)!==!1,flat=[];for(const tier of this.#tiers){let items=tier.slice();mode==="hide"&&(items=items.filter(isAvailable)),this.#randomize&&this.#shuffle(items),mode==="last"&&(items=[...items.filter(isAvailable),...items.filter(h=>!isAvailable(h))]);for(const h of items){if(flat.length>=MAX_POOL)break;flat.push(h)}if(flat.length>=MAX_POOL)break}this.#pool=flat,this.#cursor=0}#shuffle(arr){for(let i=arr.length-1;i>0;i--){const j=Math.floor(Math.random()*(i+1));[arr[i],arr[j]]=[arr[j],arr[i]]}return arr}async#fetchCardHTML(handle){if(this.#cardCache.has(handle))return this.#cardCache.get(handle);const view=this.dataset.cardView||"card-voltage",root=window.Shopify.routes.root;try{const res=await fetch(`${root}products/${handle}?view=${view}`);if(!res.ok)return null;const text=await res.text(),html=new DOMParser().parseFromString(text,"text/html").querySelector("[data-voltage-card]")?.innerHTML||null;return html&&this.#cardCache.set(handle,html),html}catch{return null}}async#collectValidCards(count){const out=[],picked=new Set,want=Math.min(count,this.#pool.length);let scanned=0;for(;out.length<want&&scanned<this.#pool.length+want;){this.#cursor>=this.#pool.length&&this.#rebuildPool();const batch=[];for(;batch.length<want-out.length&&this.#cursor<this.#pool.length;){const handle=this.#pool[this.#cursor++];

11scanned++,picked.has(handle)||(picked.add(handle),batch.push(handle))}if(batch.length===0)continue;const results=await Promise.all(batch.map(async handle=>({handle,html:await this.#fetchCardHTML(handle)})));for(const r of results)r.html&&out.length<want&&out.push(r)}return out}#renderInto(cards){const slots=this.querySelectorAll("[data-vps-slot]");slots.forEach(slot=>slot.classList.remove("is-loading")),cards.forEach((card,index)=>{const slot=slots[index];!slot||!card.html||(slot.innerHTML=card.html,this.#decorateCard(slot,card.handle))})}#decorateCard(scope,handle){const badge=this.#badges.get(handle);if(!badge)return;const media=scope.querySelector(".product-card__media");if(!media||media.querySelector(".vps-badge"))return;const a=document.createElement("a");a.className="vps-badge",a.href=`${window.Shopify.routes.root}collections/results?filter.p.m.custom.${badge.key}=${encodeURIComponent(badge.person)}`;const role=document.createElement("span");role.className="vps-badge__role",role.textContent=`${badge.role}:`;const name=document.createElement("span");name.className="vps-badge__name",name.textContent=badge.person,a.append(role," ",name),media.appendChild(a)}#clearUnused(usedCount){const slots=this.querySelectorAll("[data-vps-slot]");let removed=!1;slots.forEach((slot,index)=>{index>=usedCount&&(slot.remove(),removed=!0)}),removed&&this.querySelector("carousel-slider")?.swiperInstance?.update?.()}#initShuffle(){if(this.dataset.shuffle!=="true")return;const control=this.querySelector("[data-vps-shuffle]");if(control){if(this.#pool.length<=this.#displayed.length){control.remove();return}new VoltageShuffleSlider(control,()=>this.#shuffleCards())}}#posterPool(){const urls=new Set;return this.querySelectorAll("[data-vps-slot] img").forEach(img=>{const u=img.currentSrc||img.src;u&&urls.add(u)}),this.#cardCache.forEach(html=>{const m=html.match(/<img[^>]+src=["']([^"']+)["']/i);m&&urls.add(m[1])}),[...urls]}async#shuffleCards(){if(!this.#spinning){this.#spinning=!0;try{const count=this.#displayed.length||parseInt(this.dataset.count,10)||4,slots=[...this.querySelectorAll("[data-vps-slot]")],reduce=window.matchMedia("(prefers-reduced-motion: reduce)").matches,collectPromise=this.#collectValidCards(count),startedAt=performance.now(),reels=reduce?[]:this.#startReels(slots),cards=await collectPromise,prepared=slots.map((slot,i)=>cards[i]?.html?this.#prepareSlot(slot,cards[i]):null);if(reduce||reels.length===0){for(const item of prepared)item&&await item.ready;prepared.forEach((item,i)=>item&&this.#revealSlot(item,reels[i]))}else{const elapsed=performance.now()-startedAt;elapsed<700&&await this.#wait(700-elapsed),await Promise.all(slots.map(async(slot,i)=>{const item=prepared[i],reel=reels[i];if(await this.#wait(i*320),item&&await item.ready,reel){const poster=item?this.#cardPoster(item.newCard):null;await this.#landReel(reel,poster)}item?this.#revealSlot(item,reel):reel?.el.remove()}))}this.#displayed=slots.map((_s,i)=>cards[i]?.handle??this.#displayed[i]),this.querySelector("carousel-slider")?.swiperInstance?.update?.()}finally{this.#spinning=!1}}}#startReels(slots){const posters=this.#posterPool();return slots.map(slot=>{const media=slot.querySelector(".product-card__media"),content=slot.querySelector(".product-card__content");content&&content.classList.add("vps-info-dim");const mediaRect=media?.getBoundingClientRect();if(!media||!mediaRect?.height||posters.length===0)return slot.classList.add("vps-dim"),null;const slotRect=slot.getBoundingClientRect(),height=mediaRect.height,loopCells=6,reel=document.createElement("div");reel.className="vps-reel",reel.style.top=`${mediaRect.top-slotRect.top}px`,reel.style.left=`${mediaRect.left-slotRect.left}px`,reel.style.width=`${mediaRect.width}px`,reel.style.height=`${height}px`,reel.style.borderRadius=getComputedStyle(media).borderRadius,reel.style.setProperty("--cell-h",`${height}px`),reel.style.setProperty("--loop-cells",String(loopCells));const PAD=16,strip=document.createElement("div");strip.className="vps-reel__strip",strip.style.width=`${mediaRect.width+PAD*2}px`,strip.style.marginLeft=`${-PAD}px`,strip.style.filter="blur(7px)";const run=Array.from({length:loopCells},()=>posters[Math.floor(Math.random()*posters.length)]);for(const url of[...run,...run])strip.appendChild(this.#reelCell(url));return reel.appendChild(strip),slot.appendChild(reel),reel.classList.add("is-cruising"),{el:reel,strip,height,loopCells}})}

11#reelCell(url){const cell=document.createElement("div");return cell.className="vps-reel__cell",url&&(cell.style.backgroundImage=`url("${url}")`),cell}#cardPoster(card){const img=card?.querySelector(".product-card__media img");if(!img)return null;if(img.currentSrc||img.src)return img.currentSrc||img.src;const candidates=(img.getAttribute("srcset")||img.dataset.srcset||"").split(",").map(c=>c.trim().split(/\s+/)[0]).filter(Boolean);return candidates[candidates.length-1]||null}#landReel(reel,poster){const{el,strip,height,loopCells}=reel,posters=this.#posterPool(),currentY=new DOMMatrixReadOnly(getComputedStyle(strip).transform).m42;el.classList.remove("is-cruising"),strip.style.animation="none",strip.style.transform=`translateY(${currentY}px)`;const runway=5;for(let i=0;i<runway;i++)strip.appendChild(this.#reelCell(posters[Math.floor(Math.random()*posters.length)]));const finalIndex=strip.children.length;strip.appendChild(this.#reelCell(poster||posters[Math.floor(Math.random()*posters.length)])),strip.appendChild(this.#reelCell(posters[Math.floor(Math.random()*posters.length)])),strip.offsetHeight;const cells=(finalIndex*height+currentY)/height,duration=Math.round(900+cells*45);return strip.style.transition=`transform ${duration}ms cubic-bezier(0.16, 0.9, 0.24, 1.06), filter ${Math.round(duration*.45)}ms ease-out ${Math.round(duration*.5)}ms`,strip.style.transform=`translateY(${-finalIndex*height}px)`,strip.style.filter="blur(0px)",new Promise(resolve=>{let done=!1;const finish=()=>{done||(done=!0,resolve())};strip.addEventListener("transitionend",e=>e.propertyName==="transform"&&finish(),{once:!1}),setTimeout(finish,duration+250)})}#imageReady(card){const img=card.querySelector(".product-card__media img");return!img||img.complete&&img.naturalWidth>0?Promise.resolve():new Promise(resolve=>{let settled=!1;const finish=()=>{settled||(settled=!0,resolve())};img.addEventListener("load",finish,{once:!0}),img.addEventListener("error",finish,{once:!0}),setTimeout(finish,1500)})}#prepareSlot(slot,card){const reel=slot.querySelector(".vps-reel"),oldCard=[...slot.children].find(el=>!el.classList.contains("vps-reel"))||null,tmp=document.createElement("div");tmp.innerHTML=card.html;const newCard=tmp.firstElementChild;if(!newCard)return null;oldCard?oldCard.replaceWith(newCard):slot.insertBefore(newCard,reel||null),slot.classList.remove("vps-dim"),this.#decorateCard(newCard,card.handle);const content=newCard.querySelector(".product-card__content");return content&&content.classList.add("vps-info-dim"),newCard.querySelectorAll(".image-zoom-reveal").forEach(wrapper=>{wrapper.classList.add("loaded","in-view"),wrapper.querySelectorAll(".media__image").forEach(img=>{img.style.transition="none"})}),{reel,newCard,ready:this.#imageReady(newCard)}}#revealSlot({newCard},reel){setTimeout(()=>{newCard.querySelectorAll(".image-zoom-reveal .media__image").forEach(img=>{img.style.transition=""})},400);const content=newCard.querySelector(".product-card__content");content&&setTimeout(()=>{content.classList.add("vps-info-reveal"),content.classList.remove("vps-info-dim"),setTimeout(()=>content.classList.remove("vps-info-reveal"),450)},60);const el=reel?.el;el&&(el.classList.add("is-settling"),setTimeout(()=>el.remove(),260))}#wait(ms){return new Promise(resolve=>setTimeout(resolve,ms))}#fail(reason){if(this.querySelectorAll("[data-vps-slot]").forEach(s=>s.classList.remove("is-loading")),reason!=="No matches"&&reason!=="No renderable cards"&&console.warn(`[voltage-product-suggestion:${this.dataset.source}]`,reason?.message||reason),isDesignMode()){this.querySelectorAll("[data-vps-slot]").forEach(s=>s.hidden=!0);const shuffle=this.querySelector("[data-vps-shuffle]");shuffle&&(shuffle.hidden=!0);const label={genre:"genre",cast:"cast",vendor:"vendor"}[this.dataset.source]||"matching",note=document.createElement("p");note.className="text-body-sm color-subtext m-0 vps-editor-note",note.textContent=`\u26A1 No ${label} matches for this product \u2014 this card hides itself on the storefront. Preview another product to see it populated.`,this.prepend(note);return}this.#details?(this.#details.open=!1,this.#details.classList.remove("is-open"),this.#details.hidden=!0):this.hidden=!0,reflowSection(this)}#debug(source,info){if(isDesignMode()||this.hasAttribute("data-debug")){console.groupCollapsed(`[voltage-product-suggestion:${source}] diagnostics`);for(const[k,v]of Object.entries(info))console.log(`${k}:`,v);console.groupEnd()}}}function reflowSection(el){const accordion=el.closest("accordion-component");if(!accordion)return;const visible=[...accordion.querySelectorAll("details.product-suggestion__card")].filter(d=>!d.hidden);if(visible.forEach((d,i)=>{const n=d.querySelector(".product-suggestion__card-number");n&&(n.textContent=String(i+1))}),visible.length===0){const section=accordion.closest(".shopify-section")||accordion.closest(".product-suggestion");section&&(section.hidden=!0);return}if(!visible.some(d=>d.open)){const item=visible[0],summary=item.querySelector("summary"),content=item.querySelector(".accordion__content");typeof accordion.toggleOpen=="function"&&summary&&content?accordion.toggleOpen({willOpen:!0,item,summary,content}):(item.open=!0,item.classList.add("is-open"))}}class VoltageShuffleSlider{#root;#knob;#fill;#onTrigger;#pad=5;#fillTail=20;#dragging=!1;#busy=!1;#startX=0;#x=0;constructor(root,onTrigger){this.#root=root.querySelector(".vps-slider")||root,this.#knob=root.querySelector("[data-vps-knob]"),this.#fill=root.querySelector("[data-vps-fill]"),this.#onTrigger=onTrigger,this.#knob&&(this.#knob.addEventListener("pointerdown",this.#onDown),this.#root.addEventListener("keydown",this.#onKey

11))}#maxX(){return Math.max(0,this.#root.clientWidth-this.#knob.clientWidth-this.#pad*2)}#paint(){this.#knob.style.transform=`translateX(${this.#x}px)`,this.#fill&&(this.#fill.style.width=`${this.#x+this.#knob.clientWidth+this.#fillTail}px`)}#onDown=event=>{this.#busy||(this.#dragging=!0,this.#startX=event.clientX-this.#x,this.#knob.setPointerCapture?.(event.pointerId),this.#root.classList.add("is-grabbing"),window.addEventListener("pointermove",this.#onMove),window.addEventListener("pointerup",this.#onUp))};#lastT=0;#lastX=0;#boost=0;#peak=0;#onMove=event=>{if(!this.#dragging)return;this.#x=Math.max(0,Math.min(this.#maxX(),event.clientX-this.#startX));const now=event.timeStamp||performance.now();if(this.#lastT){const v=Math.abs(event.clientX-this.#lastX)/Math.max(1,now-this.#lastT),target=Math.min(1,v/.6);this.#boost=target>this.#boost?Math.max(target,this.#boost+(target-this.#boost)*.5):this.#boost+(target-this.#boost)*.35,this.#peak=Math.max(this.#peak,this.#boost),this.#root.style.setProperty("--vps-boost",this.#boost.toFixed(3))}this.#lastT=now,this.#lastX=event.clientX,this.#paint(),this.#scheduleDecay()};#decayRaf=0;#scheduleDecay(){if(this.#decayRaf)return;const tick=()=>{if(this.#decayRaf=0,!this.#dragging)return;performance.now()-this.#lastT>60&&this.#boost>.01&&(this.#boost*=.85,this.#root.style.setProperty("--vps-boost",this.#boost.toFixed(3))),this.#decayRaf=requestAnimationFrame(tick)};this.#decayRaf=requestAnimationFrame(tick)}#onUp=()=>{this.#dragging&&(this.#dragging=!1,this.#lastT=0,this.#boost=0,this.#root.style.removeProperty("--vps-boost"),this.#root.style.setProperty("--vps-snap",this.#peak.toFixed(3)),this.#snap=this.#peak,this.#peak=0,this.#root.classList.remove("is-grabbing"),window.removeEventListener("pointermove",this.#onMove),window.removeEventListener("pointerup",this.#onUp),this.#x>=this.#maxX()*.85?this.#fire():this.#reset())};#onKey=event=>{(event.key==="Enter"||event.key===" ")&&(event.preventDefault(),this.#busy||this.#fire())};#reset(){this.#x=0,this.#root.classList.add("is-snapping"),this.#knob.style.transform="translateX(0)",this.#fill&&(this.#fill.style.width=""),setTimeout(()=>this.#root.classList.remove("is-snapping"),300)}#snap=0;#click(){this.#root.classList.remove("is-clicked"),this.#root.offsetWidth,this.#root.classList.add("is-clicked"),setTimeout(()=>{this.#root.classList.remove("is-clicked"),this.#root.style.removeProperty("--vps-snap")},420);try{navigator.vibrate&&navigator.vibrate(Math.round(12+20*this.#snap))}catch{}this.#snap=0}async#fire(){this.#busy=!0,this.#root.classList.add("is-busy"),this.#x=this.#maxX(),this.#paint(),this.#click(),setTimeout(()=>this.#reset(),260);try{await this.#onTrigger()}finally{this.#busy=!1,this.#root.classList.remove("is-busy")}}}customElements.get("voltage-product-suggestion")||customElements.define("voltage-product-suggestion",VoltageProductSuggestion),window.addEventListener("click",event=>{event.target instanceof Element&&event.target.closest(".product-suggestion__card-badge a[href]")&&event.stopPropagation()},!0);
12//# sourceMappingURL=/cdn/shop/t/202/assets/product-suggestion-voltage.js.map?v=173906264446416811141790888484