1const html = document.documentElement 2 , getDir = html.getAttribute("dir") 3 , isRTL = "rtl" == getDir 4 , adnmEvts = { 5 select: "shopify:block:select", 6 deselect: "shopify:block:deselect", 7 seSelect: "shopify:section:select", 8 seDeselect: "shopify:section:deselect", 9 seLoad: "shopify:section:load", 10 seUnload: "shopify:section:unload", 11 seReorder: "shopify:section:reorder" 12}; 13var $4 = (t,e=document)=>e.querySelector(t) 14 , $id4 = t=>document.getElementById(t) 15 , $$4 = (t,e=document)=>[...e.querySelectorAll(t)] 16 , checkObj = (t,e,i,n=!0)=>{ 17 if (n ? !e.has(t) : e.has(t)) 18 throw TypeError("Cannot " + i) 19} 20 , fnCheck = (t,e,i)=>(checkObj(t, e, "access private method"), 21i) 22 , collectableAdd = (t,e,i)=>{ 23 checkObj(t, e, "Cannot add the same private member more than once", !1), 24 e instanceof WeakSet ? e.add(t) : e.set(t, i) 25} 26 , collectableSet = (t,e,i,n)=>(checkObj(t, e, "write to private field"), 27n ? n.call(t, i) : e.set(t, i), 28i) 29 , collectableGet = (t,e,i)=>(checkObj(t, e, "read from private field"), 30i ? i.call(t) : e.get(t)) 31 , getterAdd = (t,e,i,n=!1)=>{ 32 !n && t.has(e) || (t instanceof WeakSet ? t.add(e) : t.set(e, i)) 33} 34 , getterGet = (t,e,i)=>{ 35 if (!t.has(e)) { 36 if (!i) 37 return !1; 38 getterAdd(t, e, i, !0) 39 } 40 return t.get(e) 41} 42 , getterRunFn = (t,e,i)=>{ 43 if (!t.has(e)) 44 throw TypeError(t + "no exist"); 45 return i 46} 47 , getterDelete = (t,e)=>{ 48 t.has(e) && t.delete(e) 49} 50 , _thu = { 51 nvt: 1 52}; 53function formatMoney(t, e="") { 54 "string" == typeof t && (t = t.replace(".", "")); 55 const i = /\{\{\s*(\w+)\s*\}\}/ 56 , n = e || window.themeHDN.settings.moneyFormat; 57 function s(t, e) { 58 return null == t || t != t ? e : t 59 } 60 function r(t, e, i, n) { 61 if (e = s(e, 2), 62 i = s(i, ","), 63 n = s(n, "."), 64 isNaN(t) || null == t) 65 return 0; 66 let r = (t = (t / 100).toFixed(e)).split("."); 67 return r[0].replace(/(\d)(?=(\d\d\d)+(?!\d))/g, "$1" + i) + (r[1] ? n + r[1] : "") 68 } 69 let a = ""; 70 switch (n.match(i)[1]) { 71 case "amount": 72 a = r(t, 2); 73 break; 74 case "amount_no_decimals": 75 a = r(t, 0); 76 break; 77 case "amount_with_space_separator": 78 a = r(t, 2, " ", "."); 79 break; 80 case "amount_with_comma_separator": 81 a = r(t, 2, ".", ","); 82 break; 83 case "amount_with_apostrophe_separator": 84 a = r(t, 2, "'", "."); 85 break; 86 case "amount_no_decimals_with_comma_separator": 87 a = r(t, 0, ".", ","); 88 break; 89 case "amount_no_decimals_with_space_separator": 90 a = r(t, 0, " "); 91 break; 92 case "amount_no_decimals_with_apostrophe_separator": 93 a = r(t, 0, "'") 94 } 95 return n.indexOf("with_comma_separator"), 96 n.replace(i, a) 97} 98function throttle(t) { 99 let e, i = null; 100 const n = (...n)=>{ 101 var s; 102 e = n, 103 null === i && (i = requestAnimationFrame((s = this, 104 ()=>{ 105 i = null, 106 t.apply(s, e) 107 } 108 ))) 109 } 110 ; 111 return n.cancel = ()=>{ 112 cancelAnimationFrame(i), 113 i = null 114 } 115 , 116 n 117} 118function debounce(t, e) { 119 let i; 120 return (...n)=>{ 121 clearTimeout(i), 122 i = setTimeout((()=>t.apply(this, n)), e) 123 } 124} 125function waitForEvent(t, e) { 126 return new Promise((i=>{ 127 const n = s=>{ 128 s.target === t && (t.removeEventListener(e, n), 129 i(s)) 130 } 131 ; 132 t.addEventListener(e, n) 133 } 134 )) 135} 136function getUID(t="hdt") { 137 do { 138 t += crypto.randomUUID ? crypto.randomUUID() : ~~(1e6 * Math.random()) 139 } while ($id4(t)); 140 return t 141} 142function _matchMedia(t, e) { 143 switch (t) { 144 case "phone": 145 return window.matchMedia("screen and (max-width: 767px)").matches; 146 case "tablet": 147 return window.matchMedia("screen and (min-width: 768px) and (max-width: 1149px)").matches; 148 case "supports-hover": 149 return window.matchMedia("screen and (hover: hover) and (pointer: fine)").matches; 150 case "motion": 151 return window.matchMedia("(prefers-reduced-motion: no-preference)").matches; 152 case "motion-reduce": 153 return window.matchMedia("(prefers-reduced-motion: reduce)").matches; 154 default: 155 return window.matchMedia(t).onchange = e 156 } 157} 158function createImg(t) { 159 const e = new Image(t.width,t.height) 160 , i = t.attrs || {}; 161 for (const t in i) 162 e.setAttribute(t, i[t]); 163 return e.alt = t.alt || "", 164 e.src = t.src, 165 e.srcset = renderSrcset(t.src, JSON.parse(t.attrs["data-widths"])), 166 t.onload && e.addEventListener("load", (function() { 167 const t = e.parentElement; 168 t && (t.removeAttribute("loading"), 169 t.setAttribute("loaded", "")) 170 } 171 ), { 172 once: !0 173 }), 174 e 175}
176function renderSrcset(t, e) { 177 let i = new URL(t.startsWith("//") ? `https:${t}` : t) 178 , n = parseInt(i.searchParams.get("width") || e[e.length - 1]); 179 return e.filter((t=>t <= n)).map((t=>(i.searchParams.set("width", t.toString()), 180 `${i.href} ${t}w`))).join(", ") 181} 182function isFunction(t) { 183 return "function" == typeof t 184} 185var _cachedFetch = new Map; 186async function cachedFetch(t, e="", i) { 187 const n = t + e; 188 if (_cachedFetch.has(n)) 189 return Promise.resolve(new Response(new Blob([_cachedFetch.get(n)]))); 190 const s = await fetch(t, i); 191 if (200 === s.status) { 192 const t = s.headers.get("Content-Type"); 193 (t && t.match(/text\//i) || t.match(/application\/json/i)) && s.clone().text().then((t=>{ 194 _cachedFetch.set(n, t) 195 } 196 )) 197 } 198 return s 199} 200function visibilitychangeFn(t) { 201 if (!t.observes) 202 return; 203 document.addEventListener("visibilitychange", (()=>{ 204 "visible" === document.visibilityState ? isFunction(t.play) && t.observes.isInview && t.play() : isFunction(t.pause) && t.pause() 205 } 206 )) 207} 208const FixFristClick = ()=>{ 209 document.removeEventListener("touchstart", FixFristClick) 210} 211; 212var _config2, _userConfig2, _mouseTrack, mouseTrack_fn, _mouseCompare, mouseCompare_fn, _mouseenterHandler, mouseenterHandler_fn, _mouseleaveHandler, mouseleaveHandler_fn, _handleHover, handleHover_fn, _defaultOptions2, _timeoutId, _onEnter, _onExit, _elem2, _keyid; 213document.addEventListener("touchstart", FixFristClick); 214class HoverIntent { 215 constructor(t, e, i) { 216 const n = { 217 key: i || t 218 }; 219 this.keyid_ = n, 220 getterAdd(_keyid, n, n), 221 getterAdd(_elem2, n, t), 222 getterAdd(_userConfig2, n, e), 223 getterAdd(_mouseTrack, n, mouseTrack_fn.bind(this)), 224 getterAdd(_mouseCompare, n), 225 getterAdd(_handleHover, n), 226 getterAdd(_mouseenterHandler, n), 227 getterAdd(_mouseleaveHandler, n), 228 getterAdd(_timeoutId, n, void 0), 229 getterAdd(_onEnter, n), 230 getterAdd(_onExit, n), 231 getterGet(_elem2, n).isActive = !1, 232 getterGet(_elem2, n)?.addEventListener("mouseenter", getterRunFn(_handleHover, n, handleHover_fn).bind(this, n)), 233 getterGet(_elem2, n)?.addEventListener("mouseleave", getterRunFn(_handleHover, n, handleHover_fn).bind(this, n)) 234 } 235 get config() { 236 return getterGet(_config2, getterGet(_keyid, this.keyid_), Object.assign(getterGet(_defaultOptions2, _thu), getterGet(_userConfig2, getterGet(_keyid, this.keyid_)))) 237 } 238} 239_keyid = new WeakMap, 240_config2 = new WeakMap, 241_userConfig2 = new WeakMap, 242_mouseTrack = new WeakMap, 243_mouseCompare = new WeakSet, 244_mouseenterHandler = new WeakSet, 245_mouseleaveHandler = new WeakSet, 246_handleHover = new WeakSet, 247_defaultOptions2 = new Map, 248getterAdd(_defaultOptions2, _thu, { 249 exitDelay: 0, 250 interval: 100, 251 sensitivity: 6 252}), 253_timeoutId = new WeakMap, 254_elem2 = new WeakMap, 255_onEnter = new WeakSet, 256_onExit = new WeakSet, 257mouseTrack_fn = function(t) { 258 this.cX = t.pageX, 259 this.cY = t.pageY 260} 261, 262mouseCompare_fn = function(t, e) { 263 if (Math.sqrt((this.prevX - this.cX) * (this.prevX - this.cX) + (this.prevY - this.cY) * (this.prevY - this.cY)) < this.config.sensitivity) 264 return t?.removeEventListener("mousemove", getterGet(_mouseTrack, e)), 265 getterDelete(_timeoutId, e), 266 t.isActive && (this.config.onExit(t), 267 t.isActive = !1), 268 t.isActive = !0, 269 this.ev.pageX = this.cX, 270 this.ev.pageY = this.cY, 271 delete this.prevX, 272 delete this.prevY, 273 this.config.onEnter(t); 274 this.prevX = this.cX, 275 this.prevY = this.cY, 276 getterAdd(_timeoutId, e, setTimeout((()=>{ 277 getterRunFn(_mouseCompare, e, mouseCompare_fn).call(this, t, e) 278 } 279 ), this.config.interval), !0) 280} 281, 282mouseenterHandler_fn = function(t, e) { 283 t.isActive || (this.prevX = this.ev.pageX, 284 this.prevY = this.ev.pageY, 285 t?.removeEventListener("mousemove", getterGet(_mouseTrack, e)), 286 t?.addEventListener("mousemove", getterGet(_mouseTrack, e, mouseTrack_fn.bind(this))), 287 getterAdd(_timeoutId, e, setTimeout((()=>{ 288 getterRunFn(_mouseCompare, e, mouseCompare_fn).call(this, t, e) 289 } 290 ), this.config.interval), !0)) 291} 292, 293mouseleaveHandler_fn = function(t, e) { 294 t.isActive && (t?.removeEventListener("mousemove", getterGet(_mouseTrack, e)), 295 getterAdd(_timeoutId, e, setTimeout((()=>{ 296 this.config.onExit(t), 297 t.isActive = !1 298 } 299 ), this.config.exitDelay), !0)) 300} 301, 302handleHover_fn = function(t, e) { 303 this.ev = Object.assign({}, e), 304 getterAdd(_timeoutId, t, clearTimeout(getterGet(_timeoutId, t)), !0), 305 getterRunFn("mouseenter" === e.type ? _mouseenterHandler : _mouseleaveHandler, t, "mouseenter" === e.type ? mouseenterHandler_fn : mouseleaveHandler_fn).call(this, getterGet(_elem2, t), t) 306} 307; 308import {Carousel, ClassNames, AutoHeight, navUICenter, Autoplay, navHandlers, dotHandlers, FocusTrap, Delegate, animate, scroll, timeline, inView, stagger} from "vendor"; 309Carousel.globalOptions = { 310 direction: getDir 311}; 312var _delegate1, _control_ui, control_ui_fn, _control_slider, control_slider_fn, _control_items, _slider_api, _options_slider, _toggle_slider_ready, toggle_slider_ready_fn, _destroy_slider, destroy_slider_fn, _on_select_slider, on_select_slider_fn, _slideshow_animate, slideshow_animate_fn, _slider_classes = { 313 noSlides: "is-no-slides", 314 prepared: "is--prepared", 315 enabled: "is--enabled" 316}, _slider_defaults = { 317 loop: !1,
318 align: "start", 319 containScroll: "trimSnaps", 320 skipSnaps: !0, 321 watchSlides: !1, 322 watchDrag: !0, 323 slidesToScroll: "auto", 324 inViewThreshold: .5, 325 classNames: !0, 326 autoHeight: !1, 327 autoPlay: 0, 328 pauseOnHover: !1, 329 navUI: !1, 330 navUICenter: !1, 331 dotUI: !1, 332 controlUI: !1, 333 a11ySlide: !0, 334 a11yKeyBoard: !0, 335 a11yControls: !0, 336 inView: "is-in-view" 337}; 338class Slider extends HTMLElement { 339 constructor() { 340 super(), 341 getterAdd(_control_ui, this), 342 getterAdd(_delegate1, this, new Delegate(document.body)), 343 getterAdd(_toggle_slider_ready, this), 344 getterAdd(_destroy_slider, this), 345 getterAdd(_on_select_slider, this), 346 getterAdd(_control_slider, this), 347 getterAdd(_options_slider, this, Object.assign({}, _slider_defaults, JSON.parse(this.getAttribute("config") || "{}"))), 348 getterAdd(_control_items, this, $$4(`[hdt-slider-controls][aria-controls="${this.id}"] > button`)), 349 "onlyTypeImage" == getterGet(_options_slider, this).watchDrag ? getterGet(_options_slider, this).watchDrag = (t,e)=>{ 350 const i = e.target.closest("[data-media-type]"); 351 return !i || "image" == i.getAttribute("data-media-type") 352 } 353 : "smart" == getterGet(_options_slider, this).watchDrag && (getterGet(_options_slider, this).watchDrag = (t,e)=>t.internalEngine().slideLooper.canLoop()), 354 this.id || (this.id = getUID()) 355 } 356 scrollToTarget(t, e) { 357 getterGet(_slider_api, this).scrollTo(getterGet(_slider_api, this).slideNodes().indexOf(t), e || !_matchMedia("motion")) 358 } 359 scrollToIndex(t, e) { 360 getterGet(_slider_api, this).scrollTo(parseInt(t), e || !_matchMedia("motion")) 361 } 362 get isActive() { 363 return getterGet(_slider_api, this).internalEngine().options.active 364 } 365 reInit() { 366 getterGet(_slider_api, this).reInit() 367 } 368 connectedCallback() { 369 const t = []; 370 if (getterGet(_options_slider, this).classNames && t.push(ClassNames({ 371 inView: "is-in-view" 372 })), 373 getterGet(_options_slider, this).autoHeight && t.push(AutoHeight()), 374 getterGet(_options_slider, this).navUI && getterGet(_options_slider, this).navUICenter && t.push(navUICenter()), 375 getterGet(_options_slider, this).autoPlay) { 376 const e = { 377 delay: getterGet(_options_slider, this).autoPlay, 378 stopOnInteraction: !1, 379 stopOnMouseEnter: getterGet(_options_slider, this).pauseOnHover 380 }; 381 t.push(Autoplay(e)) 382 } 383 if (getterAdd(_slider_api, this, Carousel($4(".hdt-slider__viewport", this) || this, getterGet(_options_slider, this), t)), 384 getterGet(_slider_api, this).on("init", getterRunFn(_toggle_slider_ready, this, toggle_slider_ready_fn).bind(this)).on("resize", getterRunFn(_toggle_slider_ready, this, toggle_slider_ready_fn).bind(this)).on("reInit", getterRunFn(_toggle_slider_ready, this, toggle_slider_ready_fn).bind(this)).on("select", getterRunFn(_on_select_slider, this, on_select_slider_fn).bind(this)).on("destroy", getterRunFn(_destroy_slider, this, destroy_slider_fn).bind(this)), 385 getterGet(_options_slider, this).navUI) { 386 const t = $$4(`button[name="next"][aria-controls="${this.id}"]`); 387 $$4(`button[name="previous"][aria-controls="${this.id}"]`).forEach(((e,i)=>{ 388 if (e && t[i]) { 389 const n = navHandlers(getterGet(_slider_api, this), e, t[i]); 390 getterGet(_slider_api, this).on("destroy", n) 391 } 392 } 393 )) 394 } 395 getterGet(_options_slider, this).dotUI && $$4(`[hdt-slider-dots][aria-controls="${this.id}"]`).forEach((t=>{ 396 if (t) { 397 const e = dotHandlers(getterGet(_slider_api, this), t); 398 getterGet(_slider_api, this).on("destroy", e) 399 } 400 } 401 )), 402 getterGet(_options_slider, this).controlUI && getterGet(_control_items, this).length > 0 && (getterGet(_delegate1, this).on("click", `[hdt-slider-control
402s][aria-controls="${this.id}"] > button`, getterRunFn(_control_slider, this, control_slider_fn).bind(this)), 403 getterGet(_slider_api, this).on("init", getterRunFn(_control_ui, this, control_ui_fn).bind(this)).on("reInit", getterRunFn(_control_ui, this, control_ui_fn).bind(this)).on("select", getterRunFn(_control_ui, this, control_ui_fn).bind(this)).on("destroy", getterRunFn(_control_ui, this, control_ui_fn).bind(this))), 404 Shopify.designMode && this.addEventListener(adnmEvts.select, (t=>{ 405 getterGet(_slider_api, this).scrollTo(getterGet(_slider_api, this).slideNodes().indexOf(t.target), t.detail.load) 406 } 407 )) 408 } 409 disconnectedCallback() { 410 getterGet(_slider_api, this).destroy() 411 } 412} 413_slider_api = new WeakMap, 414_options_slider = new WeakMap, 415_delegate1 = new WeakMap, 416_control_items = new WeakMap, 417_toggle_slider_ready = new WeakSet, 418toggle_slider_ready_fn = function(t, e) { 419 const i = "resize" === e 420 , n = i ? "remove" : "add" 421 , s = this.hasAttribute("isfade"); 422 this.classList[n](_slider_classes.enabled), 423 i && s && (clearTimeout(this.timeout), 424 this.timeout = setTimeout((()=>{ 425 t.reInit() 426 } 427 ), 4)), 428 !i && s && (t.internalEngine().translate.toggleActive(!1), 429 t.internalEngine().translate.clear()) 430} 431, 432_destroy_slider = new WeakSet, 433destroy_slider_fn = function() { 434 this.classList.remove(_slider_classes.enabled), 435 getterGet(_delegate1, this).off() 436} 437, 438_control_ui = new WeakSet, 439control_ui_fn = function(t) { 440 if (!this.isActive) 441 return; 442 const e = t.selectedScrollSnap(); 443 getterGet(_control_items, this).forEach((t=>t.setAttribute("aria-current", t.value == e))) 444} 445, 446_control_slider = new WeakSet, 447control_slider_fn = function(t, e) { 448 "true" !== e.getAttribute("aria-current") && this.scrollToIndex(e.value) 449} 450, 451_on_select_slider = new WeakSet, 452on_select_slider_fn = function(t, e) { 453 this.dispatchEvent(new CustomEvent(`${e}:slide`,{ 454 bubbles: !1, 455 detail: { 456 sliderApi: t, 457 eventName: e 458 } 459 })) 460} 461; 462class SlideShow extends Slider { 463 constructor() { 464 super(), 465 getterAdd(_slideshow_animate, this) 466 } 467 connectedCallback() { 468 super.connectedCallback(), 469 getterGet(_slider_api, this).on("init", getterRunFn(_slideshow_animate, this, slideshow_animate_fn).bind(this)), 470 getterGet(_slider_api, this).on("reInit", getterRunFn(_slideshow_animate, this, slideshow_animate_fn).bind(this)), 471 getterGet(_slider_api, this).on("select", getterRunFn(_slideshow_animate, this, slideshow_animate_fn).bind(this)), 472 getterGet(_slider_api, this).on("destroy", getterRunFn(_slideshow_animate, this, slideshow_animate_fn).bind(this)) 473 } 474 isVisible(t) { 475 return t.offsetWidth > 0 || t.offsetHeight > 0 476 } 477} 478_slideshow_animate = new WeakSet, 479slideshow_animate_fn = function(t) { 480 const e = t.selectedScrollSnap() 481 , i = t.previousScrollSnap() 482 , n = $$4("[reval]", t.slideNodes()[e]) 483 , s = $$4("[reval]", t.slideNodes()[i]) 484 , r = n.filter((t=>this.isVisible(t))) 485 , a = s.filter((t=>this.isVisible(t))); 486 0 != r.length && (animate(r, { 487 opacity: [0, 1], 488 transform: ["translateY(150px)", "translateY(0)"] 489 }, { 490 duration: .25, 491 easing: "ease", 492 delay: stagger(.15, { 493 start: .4, 494 easing: [0, .87, .58, 1] 495 }) 496 }), 497 a.length > 0 && e != i && animate(a, { 498 opacity: [1, 0], 499 transform: ["translateY(0)", "translateY(25px)"] 500 }, { 501 duration: .15, 502 easing: "ease", 503 delay: stagger(.1, { 504 start: .4, 505 easing: [0, .87, .58, 1] 506 }) 507 })) 508} 509; 510var _slider_sync_select, slider_sync_select_fn, _slider_sync_control_select, slider_sync_control_select_fn, _slider_sync_control = new WeakMap; 511class SliderSync extends Slider { 512 constructor() { 513 super(), 514 getterAdd(_slider_sync_control, this, $id4(this.getAttribute("aria-controls"))), 515 getterAdd(_slider_sync_select, this), 516 getterAdd(_slider_sync_control_select, this) 517 } 518 connectedCallback() { 519 super.connectedCallback(), 520 getterGet(_slider_api, getterGet(_slider_sync_control, this)) && (getterGet(_slider_api, getterGet(_slider_sync_control, this)).on("select", getterRunFn(_slider_sync_control_select, this, slider_sync_control_select_fn).bind(this)), 521 getterGet(_slider_api, this).on("select", getterRunFn(_slider_sync_select, this, slider_sync_select_fn).bind(this)), 522 getterGet(_slider_api, getterGet(_slider_sync_control, this)).on("destroy", (()=>{ 523 getterGet(_slider_api, this).off("select", getterRunFn(_slider_sync_select, this, slider_sync_select_fn).bind(this)) 524 } 525 )), 526 getterGet(_slider_api, this).on("destroy", (()=>{ 527 getterGet(_slider_api, getterGet(_slider_sync_control, this)).off("select", getterRunFn(_slider_sync_control_select, this, slider_sync_control_select_fn).bind(this)) 528 } 529 ))) 530 } 531} 532_slider_sync_select = new WeakSet, 533slider_sync_select_fn = function(t) { 534 getterGet(_slider_api, getterGet(_slider_sync_control, this)).selectedScrollSnap() != t.selectedScrollSnap() && getterGet(_slider_api, getterGet(_slider_sync_control, this)).scrollTo(t.selectedScrollSnap()) 535} 536, 537_slider_sync_control_select = new WeakSet, 538slider_sync_control_select_fn = function(t) { 539 getterGet(_slider_api, this).selectedScrollSnap() != t.selectedScrollSnap() && getterGet(_slider_api, this).scrollTo(t.selectedScrollSnap()) 540} 541; 542var _add_thumb_btns_click_handlers, add_thumb_btns_click_handlers_fn, _add_toggle_thumb_btns_active, add_toggle_thumb_btns_active_fn, _slider_thumbs_control = new WeakMap; 543class SlideThumb extends Slider { 544 connectedCallback() { 545 if (getterAdd(_slider_thumbs_control, this, $id4(this.getAttribute("aria-controls"))), 546 this.hasAttribute("stagger") && animate($$4("[reval]", this), { 547 opacity: [0, 1], 548 transform: ["scale(.5) rotate(90deg) skew(15deg)", "scale(1) rotate(0deg) skew(0deg)"] 549 }, { 550 duration: .2, 551 delay: stagger(.3, { 552 easing: "ease-out" 553 }) 554 }).finished.then((()=>{ 555 this.classList.add("stagger-finished") 556 } 557 )), 558 !getterGet(_slider_thumbs_control, this)) 559 return; 560 super.connectedCallback(); 561 const t = getterGet(_slider_api, getterGet(_slider_thumbs_control, this)) 562 , e = getterGet(_slider_api, this);
563 _matchMedia("phone") || _matchMedia("tablet") || e.containerNode().style.setProperty("max-height", `${t.slideNodes()[t.selectedScrollSnap()].clientHeight + 10}px`), 564 getterAdd(_add_thumb_btns_click_handlers, this), 565 getterAdd(_add_toggle_thumb_btns_active, this); 566 const i = getterRunFn(_add_thumb_btns_click_handlers, this, add_thumb_btns_click_handlers_fn).call(this, t, e) 567 , n = getterRunFn(_add_toggle_thumb_btns_active, this, add_toggle_thumb_btns_active_fn).call(this, t, e); 568 t.on("destroy", i).on("destroy", n), 569 e.on("destroy", i).on("destroy", n) 570 } 571} 572_add_thumb_btns_click_handlers = new WeakSet, 573add_thumb_btns_click_handlers_fn = function(t, e) { 574 return $$4(".hdt-slider__slide", this).forEach((i=>{ 575 i.addEventListener("click", (()=>{ 576 const n = e.slideNodes().indexOf(i); 577 n > -1 && t.scrollTo(n) 578 } 579 ), !1) 580 } 581 )), 582 ()=>{ 583 $$4(".hdt-slider__slide", this).forEach((i=>{ 584 i.addEventListener("click", (()=>{ 585 const n = e.slideNodes().indexOf(i); 586 n > -1 && t.scrollTo(n) 587 } 588 ), !1) 589 } 590 )) 591 } 592} 593, 594_add_toggle_thumb_btns_active = new WeakSet, 595add_toggle_thumb_btns_active_fn = function(t, e) { 596 const i = ()=>{ 597 e.scrollTo(t.selectedScrollSnap()), 598 $4(".is-thumb-selected", this)?.classList.remove("is-thumb-selected"), 599 e.slideNodes()[t.selectedScrollSnap()].classList.add("is-thumb-selected") 600 } 601 ; 602 return t.on("select", i), 603 e.on("init", i), 604 e.on("reInit", i), 605 ()=>{ 606 e.slideNodes()[t.selectedScrollSnap()].classList.remove("is-thumb-selected") 607 } 608} 609; 610var _update_total_counter, update_total_counter_fn, _update_current_counter, update_current_counter_fn, _delegate, _controller, _focusTrap, _config, _updateSlot, updateSlot_fn, _toggleClicked, toggleClicked_fn, _locked, locked_fn, _isLocked, _allowOutsideClick, allowOutsideClick_fn, _allowOutsideClickTouch, allowOutsideClickTouch_fn, _allowOutsideClickMouse, allowOutsideClickMouse_fn, _originalParentBeforeAppend, _slider_counter = new WeakMap; 611class SlideCounter extends HTMLElement { 612 #t; 613 constructor() { 614 super(), 615 getterAdd(_update_total_counter, this), 616 getterAdd(_update_current_counter, this) 617 } 618 connectedCallback() { 619 this.#t = new AbortController, 620 getterAdd(_slider_counter, this, $id4(this.getAttribute("slider"))), 621 getterGet(_slider_counter, this) && (getterGet(_slider_api, getterGet(_slider_counter, this)).on("init", getterRunFn(_update_total_counter, this, update_total_counter_fn).bind(this), { 622 signal: this.#t.signal 623 }), 624 getterGet(_slider_api, getterGet(_slider_counter, this)).on("reInit", getterRunFn(_update_total_counter, this, update_total_counter_fn).bind(this), { 625 signal: this.#t.signal 626 }), 627 getterGet(_slider_api, getterGet(_slider_counter, this)).on("select", getterRunFn(_update_current_counter, this, update_current_counter_fn).bind(this), { 628 signal: this.#t.signal 629 })) 630 } 631 disconnectedCallback() { 632 this.#t.abort() 633 } 634 get total() { 635 return $4("[update-total]", this) 636 } 637 get current() { 638 return this._current = this._current || $4("[update-current]", this) 639 } 640} 641_update_total_counter = new WeakSet, 642update_total_counter_fn = function(t) { 643 getterGet(_slider_counter, this).isActive && (this.total.textContent = t.scrollSnapList().length, 644 getterRunFn(_update_current_counter, this, update_current_counter_fn).call(this, t)) 645} 646, 647_update_current_counter = new WeakSet, 648update_current_counter_fn = function(t) { 649 this.current.textContent = t.selectedScrollSnap() + 1 650} 651, 652customElements.define("hdt-slider", Slider), 653customElements.define("hdt-slideshow", SlideShow), 654customElements.define("hdt-slider-sync", SliderSync), 655customElements.define("hdt-slider-thumb", SlideThumb), 656customElements.define("hdt-slider-counter", SlideCounter); 657class Scrollnap extends HTMLElement { 658 constructor() { 659 if (super(), 660 this.slider = $4('[id^="Scroller-"]', this) || this, 661 this.sliderItems = $$4('[id^="Scroll-"]', this), 662 this.enableSliderLooping = !1, 663 this.currentPageElement = $4(".hdt-scrollsnap-counter--current", this), 664 this.pageTotalElement = $4(".hdt-scrollsnap-counter--total", this), 665 this.prevButton = $4('button[name="previous"]', this), 666 this.nextButton = $4('button[name="next"]', this), 667 this.dotButtons = $$4(".hdt-scrollsnap-dot__link", this), 668 this.sliderFirstItemNode = this.sliderItems[0], 669 !this.slider) 670 return; 671 this.initPages(); 672 new ResizeObserver((t=>this.initPages())).observe(this.slider), 673 this.slider.addEventListener("scroll", this.update.bind(this)), 674 this.nextButton && (this.prevButton.addEventListener("click", this.onButtonClick.bind(this)), 675 this.nextButton.addEventListener("click", this.onButtonClick.bind(this))), 676 this.dotButtons.length && this.dotButtons.forEach((t=>t.addEventListener("click", this.linkToSlide.bind(this)))) 677 } 678 get isScrollable() { 679 return this.slider.scrollWidth !== this.slider.clientWidth 680 } 681 initPages() { 682 this.sliderItemsToShow = Array.from(this.sliderItems).filter((t=>t.clientWidth > 0)), 683 this.sliderItemsToShow.length < 2 || (this.sliderItemOffset = this.sliderItemsToShow[1].offsetLeft - this.sliderItemsToShow[0].offsetLeft, 684 this.slidesPerPage = Math.floor((this.slider.clientWidth - this.sliderItemsToShow[0].offsetLeft) / this.sliderItemOffset), 685 this.totalPages = this.sliderItemsToShow.length - this.slidesPerPage + 1, 686 this.update(), 687 this.classList.toggle("is-scrollable", this.isScrollable)) 688 } 689 resetPages() { 690 this.sliderItems = $$4('[id^="Scroll-"]', this), 691 this.initPages() 692 } 693 update() { 694 if (!this.slider) 695 return; 696 const t = this.currentPage; 697 this.currentPage = Math.round(this.slider.scrollLeft / this.sliderItemOffset) + 1, 698 this.currentPageElement && this.pageTotalElement && (this.currentPageElement.textContent = this.currentPage, 699 this.pageTotalElement.textContent = this.totalPages), 700 this.currentPage != t && this.dispatchEvent(new CustomEvent("slideChanged",{ 701 detail: { 702 currentPage: this.currentPage, 703 currentElement: this.sliderItemsToShow[this.currentPage - 1] 704 } 705 })), 706 this.dotButtons.length && (this.dotButtons.forEach((t=>{ 707 t.classList.remove("hdt-scrollsnap-dot__link--active"), 708 t.removeAttribute("aria-current") 709 } 710 )), 711 this.dotButtons[this.currentPage - 1]?.classList.add("hdt-scrollsnap-dot__link--active"), 712 this.dotButtons[this.currentPage - 1]?.setAttribute("aria-current", !0)), 713 !this.enableSliderLooping && this.nextButton && (this.isSlideVisible(this.sliderItemsToShow[0]) && 0 === this.slider.scrollLeft ? this.prevButton.setAttribute("disabled", "disabled") : this.prevButton.removeAttribute("disabled"), 714 this.isSlideVisible(this.sliderItemsToShow[this.sliderItemsToShow.length - 1]) ? this.nextButton.setAttribute("disabled", "disabled") : this.nextButton.removeAttribute("disabled")) 715 }
716 isSlideVisible(t, e=0) { 717 const i = this.slider.clientWidth + this.slider.scrollLeft - e; 718 return t.offsetLeft + t.clientWidth <= i && t.offsetLeft >= this.slider.scrollLeft 719 } 720 onButtonClick(t) { 721 t.preventDefault(); 722 const e = t.currentTarget.dataset.step || 1; 723 this.slideScrollPosition = "next" === t.currentTarget.name ? this.slider.scrollLeft + e * this.sliderItemOffset : this.slider.scrollLeft - e * this.sliderItemOffset, 724 this.setSlidePosition(this.slideScrollPosition) 725 } 726 linkToSlide(t) { 727 t.preventDefault(); 728 const e = this.slider.scrollLeft + this.sliderFirstItemNode.clientWidth * (this.dotButtons.indexOf(t.currentTarget) + 1 - this.currentPage); 729 this.setSlidePosition(e) 730 } 731 setSlidePosition(t) { 732 this.slider.scrollTo({ 733 left: t, 734 behavior: _matchMedia("motion") ? "smooth" : "auto" 735 }) 736 } 737} 738customElements.define("hdt-scrollsnap", Scrollnap); 739class ScrollBar extends HTMLElement { 740 connectedCallback() { 741 this.scrolledElement && (this.scrolledElement.addEventListener("scroll", throttle(this._updateScrollProgress.bind(this))), 742 window.ResizeObserver && new ResizeObserver(this._updateScrollProgress.bind(this)).observe(this.scrolledElement)) 743 } 744 get scrolledElement() { 745 return this._scrolledElement = this._scrolledElement || $id4(this.getAttribute("observes")) 746 } 747 _updateScrollProgress() { 748 const t = ((isRTL ? Math.abs(this.scrolledElement.scrollLeft) : this.scrolledElement.scrollLeft) + this.scrolledElement.clientWidth) / this.scrolledElement.scrollWidth; 749 this.style.setProperty("--scrollbar-progress", Math.max(0, Math.min(t, 1)).toFixed(6)) 750 } 751} 752customElements.define("hdt-scrollbar", ScrollBar); 753var _roundByDPR, roundByDPR_fn, _translateByDPR, translateByDPR_fn, _init, init_fn, _dpr, counterDialogOpened = 0; 754class DialogBase extends HTMLElement { 755 constructor() { 756 super(), 757 collectableAdd(this, _delegate, new Delegate(document.body)), 758 collectableAdd(this, _controller, void 0), 759 collectableAdd(this, _focusTrap, void 0), 760 collectableAdd(this, _config, void 0), 761 collectableAdd(this, _toggleClicked), 762 collectableAdd(this, _updateSlot), 763 collectableAdd(this, _originalParentBeforeAppend, void 0), 764 collectableAdd(this, _allowOutsideClick), 765 collectableAdd(this, _allowOutsideClickTouch), 766 collectableAdd(this, _allowOutsideClickMouse), 767 collectableAdd(this, _isLocked, !1), 768 collectableAdd(this, _locked), 769 this.shadowDomTemplate && (this.attachShadow({ 770 mode: "open" 771 }).appendChild($id4(this.shadowDomTemplate).content.cloneNode(!0)), 772 this.shadowRoot.addEventListener("slotchange", (t=>fnCheck(this, _updateSlot, updateSlot_fn).call(this, t.target)))), 773 this.addEventListener("dialog:forceClose", (t=>{ 774 this.closeDialog(), 775 t.stopPropagation() 776 } 777 )) 778 } 779 static get observedAttributes() { 780 return ["id", "open"] 781 } 782 updateBtbsOpen(t) { 783 this.id && t && (t.removeEventListener("click", getterRunFn(_toggleClicked, this, toggleClicked_fn).bind(this)), 784 t.addEventListener("click", getterRunFn(_toggleClicked, this, toggleClicked_fn).bind(this))) 785 } 786 connectedCallback() { 787 "smart" == this.config.appendToBody && (this.config.appendToBody = _matchMedia("phone")), 788 "smart" == this.config.noScroll && (this.config.noScroll = _matchMedia("phone")), 789 this.id && this.delegate.off().on("click", this.stringControls, getterRunFn(_toggleClicked, this, toggleClicked_fn).bind(this).bind(this)), 790 collectableSet(this, _controller, new AbortController), 791 this.setAttribute("role", "dialog"), 792 this.shadowDomTemplate && (this.selectorPartName("overlay")?.addEventListener("click", this.closeDialog.bind(this), { 793 signal: this.abortController.signal 794 }), 795 $$4("slot", this.shadowRoot).forEach((t=>
795fnCheck(this, _updateSlot, updateSlot_fn).call(this, t)))), 796 Shopify.designMode && !this.hasAttribute("un-detect") && (this.addEventListener(adnmEvts.select, (t=>this.openDialog(t.detail.load)), { 797 signal: this.abortController.signal 798 }), 799 this.addEventListener(adnmEvts.deselect, (()=>this.closeDialog(!1)), { 800 signal: this.abortController.signal 801 }), 802 this._shopifySection = this._shopifySection || this.closest(".shopify-section"), 803 this._shopifySection && (this.hasAttribute("detect-adm-se-evt") && (this._shopifySection.addEventListener(adnmEvts.seSelect, (t=>this.openDialog(!t.detail.load)), { 804 signal: this.abortController.signal 805 }), 806 this._shopifySection.addEventListener(adnmEvts.seDeselect, this.closeDialog.bind(this), { 807 signal: this.abortController.signal 808 })), 809 this._shopifySection.addEventListener(adnmEvts.seUnload, (()=>this.remove()), { 810 signal: this.abortController.signal 811 }))) 812 } 813 disconnectedCallback() { 814 this.abortController.abort(), 815 this.delegate.off(), 816 this.focusTrap?.deactivate({ 817 onDeactivate: ()=>{} 818 }), 819 collectableGet(this, _isLocked) && (collectableSet(this, _isLocked, !1), 820 fnCheck(this, _locked, locked_fn).call(this)) 821 } 822 get delegate() { 823 return collectableGet(this, _delegate) 824 } 825 get abortController() { 826 return collectableGet(this, _controller) 827 } 828 get open() { 829 return this.hasAttribute("open") 830 } 831 get defaultTemplate() { 832 return null 833 } 834 get shadowDomTemplate() { 835 return this.getAttribute("template") || this.defaultTemplate 836 } 837 get defaultConfig() { 838 return { 839 catchFocus: !0, 840 preventScrollFocus: !0, 841 allowOutsideClick: !0, 842 noScroll: !0, 843 appendToBody: !1 844 } 845 } 846 get userConfig() { 847 return Object.assign(JSON.parse(this.getAttribute("config") || "{}")) 848 } 849 get config() { 850 return collectableSet(this, _config, collectableGet(this, _config) || Object.assign(this.defaultConfig, this.userConfig)) 851 } 852 attributeChangedCallback(t, e, i) { 853 switch (t) { 854 case "id": 855 i && this.delegate.off().on("click", this.stringControls, getterRunFn(_toggleClicked, this, toggleClicked_fn).bind(this).bind(this)); 856 break; 857 case "open": 858 if (collectableSet(this, _isLocked, this.open), 859 this.allButton.forEach((t=>t.setAttribute("aria-expanded", null === i ? "false" : "true"))), 860 null !== e || "" !== i && "immediate" !== i) { 861 if (null !== e && null === i) { 862 this.dispatchEvent(new CustomEvent("dialog:beforeClose")); 863 const t = this.animateClose(); 864 "immediate" === this.getAttribute("closing") && t.finish(); 865 const e = t.finished; 866 e.then((()=>{ 867 this.dispatchEvent(new CustomEvent("dialog:doneClose")), 868 this.parentElement === document.body && collectableGet(this, _originalParentBeforeAppend) && (collectableGet(this, _originalParentBeforeAppend).appendChild(this), 869 collectableSet(this, _originalParentBeforeAppend, null)), 870 this.style.setProperty("display", "none"), 871 this.dispatchEvent(new CustomEvent("dialog:afterClose")), 872 this.style.removeProperty("z-index"), 873 this.removeAttribute("closing") 874 } 875 )), 876 this.focusTrap?.deactivate({ 877 checkCanReturnFocus: ()=>e 878 }), 879 this.config.noScroll && (collectableSet(this, _isLocked, !1), 880 fnCheck(this, _locked, locked_fn).call(this)) 881 } 882 } else { 883 collectableSet(this, _originalParentBeforeAppend, null), 884 this.style.setProperty("display", "block"), 885 this.style.zIndex = parseInt(this.config.zIndex || 999) + counterDialogOpened, 886 this.dispatchEvent(new CustomEvent("dialog:beforeOpen")), 887 this.config.appendToBody && this.parentElement !== document.body && (collectableSet(this, _originalParentBeforeAppend, this.parentElement), 888 document.body.append(this), 889 ++counterDialogOpened); 890 const t = this.animateOpen(); 891 "immediate" === i && t.finish(), 892 t.finished.then((()=>{ 893 this.dispatchEvent(new CustomEvent("dialog:afterOpen")) 894 } 895 )), 896 this.config.catchFocus && this.focusTrap.activate({ 897 checkCanFocusTrap: ()=>t.finished 898 }), 899 this.config.noScroll && (++counterDialogOpened, 900 collectableSet(this, _isLocked, !0), 901 fnCheck(this, _locked, locked_fn).call(this)) 902 } 903 this.dispatchEvent(new CustomEvent("toggle",{ 904 bubbles: !0 905 })) 906 } 907 } 908 openDialog(t=!0) { 909 return this.open ? Promise.resolve() : (this.setAttribute("open", t ? "" : "immediate"), 910 waitForEvent(this, "dialog:afterOpen")) 911 } 912 closeDialog(t=!0) { 913 return this.open ? (this.setAttribute("closing", t ? "" : "immediate"), 914 this.removeAttribute("open"), 915 waitForEvent(this, "dialog:afterClose")) : Promise.resolve() 916 } 917 animateOpen() { 918 return animate(this, {}, { 919 duration: 0 920 }) 921 } 922 animateClose() { 923 return animate(this, {}, { 924 duration: 0 925 }) 926 } 927 get initialFocus() { 928 return this.hasAttribute("initial-focus") ? "false" !== this.getAttribute("initial-focus") && $4(this.getAttribute("initial-focus"), this) : this.hasAttribute("tabindex") ? this
928: $4('input:not([type="hidden"])', this) || !1 929 } 930 hideForOutsideClickTarget(t) { 931 return !this.contains(t) 932 } 933 allowOutsideClickForTarget(t) { 934 return !1 935 } 936 get focusTrap() { 937 return collectableSet(this, _focusTrap, collectableGet(this, _focusTrap) || new FocusTrap([this, this.shadowRoot],{ 938 onDeactivate: this.closeDialog.bind(this), 939 allowOutsideClick: !!this.config.allowOutsideClick && fnCheck(this, _allowOutsideClick, allowOutsideClick_fn).bind(this), 940 initialFocus: !!_matchMedia("supports-hover") && this.initialFocus, 941 fallbackFocus: this, 942 preventScroll: this.config.preventScrollFocus 943 })) 944 } 945 selectorPartName(t) { 946 return this.shadowRoot?.querySelector(`[part="${t}"]`) 947 } 948 get stringControls() { 949 return `[aria-controls="${this.id}"]:not([section-id])` 950 } 951 get allButton() { 952 return $$4(this.stringControls, this.getRootNode()) 953 } 954} 955_isLocked = new WeakMap, 956_config = new WeakMap, 957_delegate = new WeakMap, 958_controller = new WeakMap, 959_focusTrap = new WeakMap, 960_toggleClicked = new WeakSet, 961toggleClicked_fn = function(t) { 962 if (t?.preventDefault(), 963 t) { 964 const e = t.target; 965 this.btnOpening = "BUTTON" === e.tagName || "A" === e.tagName ? e : e.closest("button") || e 966 } 967 t && this.btnOpening.hasAttribute("close-dialog") && $id4(this.btnOpening.getAttribute("close-dialog"))?.closeDialog(), 968 this.open ? this.closeDialog() : this.openDialog(!0, this.btnOpening) 969} 970, 971_locked = new WeakSet, 972locked_fn = function() { 973 if (collectableGet(this, _isLocked)) 974 html.classList.add("no-scroll"); 975 else { 976 if (counterDialogOpened < 1) 977 return void --counterDialogOpened; 978 html.classList.toggle("no-scroll", --counterDialogOpened > 0) 979 } 980} 981, 982_updateSlot = new WeakSet, 983updateSlot_fn = function(t) { 984 ["header", "sticky", "body", "footer"].includes(t.name) && (t.parentElement.hidden = 0 === t.assignedElements({ 985 flatten: !0 986 }).length) 987} 988, 989_originalParentBeforeAppend = new WeakMap, 990_allowOutsideClick = new WeakSet, 991allowOutsideClick_fn = function(t) { 992 return "TouchEvent"in window && t instanceof TouchEvent ? fnCheck(this, _allowOutsideClickTouch, allowOutsideClickTouch_fn).call(this, t) : fnCheck(this, _allowOutsideClickMouse, allowOutsideClickMouse_fn).call(this, t) 993} 994, 995_allowOutsideClickTouch = new WeakSet, 996allowOutsideClickTouch_fn = function(t) { 997 return t.target.addEventListener("touchend", (t=>{ 998 const e = document.elementFromPoint(t.changedTouches.item(0).clientX, t.changedTouches.item(0).clientY); 999 this.hideForOutsideClickTarget(e) && this.closeDialog() 1000 } 1001 ), { 1002 once: !0, 1003 signal: this.abortController.signal 1004 }), 1005 this.allowOutsideClickForTarget(t.target) 1006} 1007, 1008_allowOutsideClickMouse = new WeakSet, 1009allowOutsideClickMouse_fn = function(t) { 1010 if ("click" !== t.type) 1011 return !1; 1012 if (this.hideForOutsideClickTarget(t.target) && this.closeDialog(), 1013 this.allowOutsideClickForTarget(t.target)) 1014 return !0; 1015 let e = t.target 1016 , i = t.target.closest("[aria-controls]"); 1017 return i && i.getAttribute("aria-controls") === this.id && (e = i), 1018 this.id !== e.getAttribute("aria-controls") 1019} 1020, 1021customElements.define("hdt-dialog", DialogBase); 1022class CloseButton extends HTMLButtonElement { 1023 constructor() { 1024 super(), 1025 this.addEventListener("click", (()=>this.dispatchEvent(new CustomEvent("dialog:forceClose",{ 1026 bubbles: !0, 1027 cancelable: !0, 1028 composed: !0 1029 })))) 1030 } 1031} 1032customElements.define("close-button", CloseButton, { 1033 extends: "button" 1034}); 1035class cartOpenable extends DialogBase { 1036 animateOpen() { 1037 let t = this.selectorPartName("content") 1038 , e = this.selectorPartName("overlay"); 1039 return timeline([[e, { 1040 opacity: [0, 1] 1041 }, { 1042 duration: .15 1043 }], [t, { 1044 transform: ["translateY(100%)", "translateY(0)"] 1045 }, { 1046 duration: .2, 1047 easing: "ease-in", 1048 at: "-0.075" 1049 }]]) 1050 } 1051 animateClose() { 1052 let t = this.selectorPartName("content") 1053 , e = this.selectorPartName("overlay"); 1054 return timeline([[t, { 1055 transform: ["translateY(0)", "translateY(100%)"] 1056 }, { 1057 duration: .2, 1058 easing: "ease-out" 1059 }], [e, { 1060 opacity: [1, 0] 1061 }, { 1062 duration: .15, 1063 at: "-0.1" 1064 }]]) 1065 } 1066} 1067customElements.define("hdt-cart-openable", cartOpenable); 1068import {computePosition, shift, flip, offset, arrow} from "vendor"; 1069var updatePositionFloatingEl = function(t, e, i, n, s=!0, r=16, a="-8px") { 1070 getterAdd(_init, this), 1071 getterAdd(_translateByDPR, this), 1072 getterAdd(_roundByDPR, this), 1073 getterRunFn(_init, this, init_fn).call(this, t, e, i, n, s, r, a) 1074}; 1075_dpr = new Map, 1076getterAdd(_dpr, _thu, window.devicePixelRatio || 1), 1077_roundByDPR = new WeakSet, 1078_translateByDPR = new WeakSet, 1079_init = new WeakSet, 1080roundByDPR_fn = function(t) { 1081 return Math.round(t * getterGet(_dpr, _thu)) / getterGet(_dpr, _thu) 1082} 1083, 1084translateByDPR_fn = function(t, e) { 1085 return getterGet(_dpr, _thu) >
1085 1 ? `translate3d(${getterRunFn(_roundByDPR, this, roundByDPR_fn).call(this, t)}px,${getterRunFn(_roundByDPR, this, roundByDPR_fn).call(this, e)}px,0)` : `translate(${getterRunFn(_roundByDPR, this, roundByDPR_fn).call(this, t)}px,${getterRunFn(_roundByDPR, this, roundByDPR_fn).call(this, e)}px)` 1086} 1087, 1088init_fn = function(t, e, i, n, s, r, a) { 1089 computePosition(t, e, { 1090 placement: n, 1091 middleware: [offset(parseInt(r)), flip({ 1092 fallbackPlacements: ["top", "bottom"] 1093 }), shift({ 1094 padding: 0 1095 }), arrow({ 1096 element: i 1097 })] 1098 }).then((({x: t, y: n, placement: r, middlewareData: o})=>{ 1099 if (this.objStyle = s ? { 1100 top: "0", 1101 left: "0", 1102 transform: getterRunFn(_translateByDPR, this, translateByDPR_fn).call(this, t, n) 1103 } : { 1104 left: `${t}px`, 1105 top: `${n}px` 1106 }, 1107 Object.assign(e.style, this.objStyle), 1108 o.arrow && i) { 1109 const {x: t, y: e} = o.arrow 1110 , n = { 1111 top: "bottom", 1112 right: "left", 1113 bottom: "top", 1114 left: "right" 1115 }[r.split("-")[0]]; 1116 Object.assign(i.style, { 1117 left: null != t ? `${t}px` : "", 1118 top: null != e ? `${e}px` : "", 1119 right: "", 1120 bottom: "", 1121 [n]: a 1122 }) 1123 } 1124 } 1125 )) 1126} 1127; 1128class Popover extends DialogBase { 1129 connectedCallback() { 1130 super.connectedCallback(), 1131 this.allButton.forEach((t=>t.setAttribute("aria-haspopup", "dialog"))), 1132 this.config.closeRichlistSelect && this.addEventListener("richlist:select", this.closeDialog, { 1133 signal: this.abortController.signal 1134 }) 1135 } 1136 get defaultTemplate() { 1137 return "hdt-tmp-popover" 1138 } 1139 get userConfig() { 1140 return Object.assign({ 1141 noScroll: "smart", 1142 appendToBody: "smart" 1143 }, JSON.parse(this.getAttribute("config") || "{}")) 1144 } 1145 get placement() { 1146 return this.getAttribute("placement") || "bottom" 1147 } 1148 get arrowEl() { 1149 return this.selectorPartName("arrow") 1150 } 1151 animateOpen() { 1152 let t = this.selectorPartName("content") 1153 , e = this.selectorPartName("outside-close-button"); 1154 return this.style.display = "block", 1155 _matchMedia("phone") ? (Object.assign(this.style, { 1156 top: null, 1157 left: "0px", 1158 right: null, 1159 bottom: "0px", 1160 transform: null 1161 }), 1162 timeline([[this, { 1163 opacity: [0, 1], 1164 visibility: ["hidden", "visible"] 1165 }, { 1166 duration: .15 1167 }], [t, { 1168 clipPath: ["inset(100% 0 0 0 round 8px)", "inset(0 0 0 0 round 8px"] 1169 }, { 1170 duration: .4, 1171 easing: [.86, 0, .07, 1] 1172 }], [t.children, { 1173 opacity: [0, 1] 1174 }, { 1175 duration: .15 1176 }], [e, { 1177 opacity: [0, 1] 1178 }, { 1179 at: "<", 1180 duration: .15 1181 }]])) : (updatePositionFloatingEl.call(this, this.btnOpening, this, this.arrowEl, this.placement), 1182 timeline([[this, { 1183 opacity: [0, 1], 1184 visibility: ["hidden", "visible"] 1185 }, { 1186 duration: .15 1187 }], [t, { 1188 clipPath: "none" 1189 }, { 1190 at: "<", 1191 duration: 0 1192 }], [t.children, { 1193 opacity: 1 1194 }, { 1195 at: "<", 1196 duration: 0 1197 }]])) 1198 } 1199 animateClose() { 1200 if (_matchMedia("phone")) { 1201 let t = this.selectorPartName("content") 1202 , e = this.selectorPartName("outside-close-button"); 1203 return timeline([[e, { 1204 opacity: [null, 0] 1205 }, { 1206 duration: .15 1207 }], [t.children, { 1208 opacity: [null, 0] 1209 }, { 1210 at: "<", 1211 duration: .15 1212 }], [t, { 1213 clipPath: [null, "inset(100% 0 0 0 round 8px)"] 1214 }, { 1215 duration: .4, 1216 easing: [.86, 0, .07, 1] 1217 }], [this, { 1218 opacity: [null, 0], 1219 visibility: ["visible", "hidden"] 1220 }, { 1221 duration: .15 1222 }]]) 1223 } 1224 return timeline(this, { 1225 opacity: [null, 0], 1226 visibility: ["visible", "hidden"], 1227 transform: ["translateY(0)", "translateY(25%)"] 1228 }, { 1229 duration: .15 1230 }) 1231 } 1232} 1233customElements.define("hdt-popover", Popover); 1234var _find_title, find_title_fn, _tooltip_ids, _create_tooltip, create_tooltip_fn, _tooltip_thiss, _onOptionClicked, onOptionClicked_fn, _onKeyDown, onKeyDown_fn, _reveal, reveal_fn, _input, input_fn, _wrapper, _effect, effect_fn, _updateSizes, updateSizes_fn, _optimumx, _resizeObserver, resizeObserver_fn, _event, _position, _isCenterOnScreen, _x, _needCalc, _clickOutside, clickOutside_fn, _escape, escape_fn, dt_original_title = "data-original-title"; 1235class BaseTooltip { 1236 constructor(t) { 1237 getterAdd(_tooltip_thiss, this, t), 1238 "none" != this.placement && (getterAdd(_find_title, t), 1239 getterAdd(_create_tooltip, t), 1240 getterAdd(_tooltip_ids, t, getUID()), 1241 $id4(getterGet(_tooltip_ids, getterGet(_tooltip_thiss, this)))) 1242 } 1243 connectedCallback() { 1244 _matchMedia("supports-hover") && "none" != this.placement && new HoverIntent(getterGet(_tooltip_thiss, this),{ 1245 onEnter: this.onEnter.bind(getterGet(_tooltip_thiss, this), this), 1246 onExit: this.onExit.bind(getterGet(_tooltip_thiss, this)), 1247 exitDelay: 0, 1248 interval: 80, 1249 sensitivity: 6 1250 },getterGet(_tooltip_thiss, this)) 1251 } 1252 disconnectedCallback() { 1253 $id4(getterGet(_tooltip_ids, getterGet(_tooltip_thiss, this)))?.remove() 1254 } 1255 get placement() { 1256 return getterGet(_tooltip_thiss, this).getAttribute("placement") || "bottom" 1257 } 1258 get arrowEl() { 1259 return $4(".hdt-tooltip__arrow", $id4(getterGet(_tooltip_ids, getterGet(_tooltip_thiss, this)))) 1260 } 1261 onEnter(t) {
1262 getterRunFn(_create_tooltip, this, create_tooltip_fn).call(this, getterGet(_tooltip_ids, this), getterRunFn(_find_title, this, find_title_fn).call(this)), 1263 updatePositionFloatingEl.call(this, this, $id4(getterGet(_tooltip_ids, this)), t.arrowEl, t.placement, !0, 6, "-4px") 1264 } 1265 onExit() { 1266 const t = $id4(getterGet(_tooltip_ids, this)); 1267 t && t.remove() 1268 } 1269} 1270_tooltip_thiss = new WeakMap; 1271class btnTooltip extends HTMLButtonElement { 1272 constructor() { 1273 super(), 1274 "none" != this.placement && (this.baseTooltip = new BaseTooltip(this)) 1275 } 1276 attributeChangedCallback(t, e, i) { 1277 e != i && null !== e && this.dispatchEvent(new CustomEvent("theme4:update:tooltip",{ 1278 bubbles: !0, 1279 detail: "the4" 1280 })) 1281 } 1282 connectedCallback() { 1283 this.baseTooltip.onEnter = ()=>{ 1284 this.controller = new AbortController, 1285 getterRunFn(_create_tooltip, this, create_tooltip_fn).call(this, getterGet(_tooltip_ids, this), getterRunFn(_find_title, this, find_title_fn).call(this)); 1286 const t = $id4(getterGet(_tooltip_ids, this)); 1287 updatePositionFloatingEl.call(this, this, t, this.baseTooltip.arrowEl, this.baseTooltip.placement, !0, 6, "-4px"), 1288 this.addEventListener("theme4:update:tooltip", (e=>{ 1289 $4(".hdt-tooltip__inner", t).textContent = getterRunFn(_find_title, this, find_title_fn).call(this), 1290 updatePositionFloatingEl.call(this, this, t, this.baseTooltip.arrowEl, this.baseTooltip.placement, !0, 6, "-4px") 1291 } 1292 ), { 1293 signal: this.controller.signal 1294 }) 1295 } 1296 , 1297 this.baseTooltip.onExit = ()=>{ 1298 const t = $id4(getterGet(_tooltip_ids, this)); 1299 t && (this.controller.abort(), 1300 t.remove()) 1301 } 1302 , 1303 this.baseTooltip.connectedCallback() 1304 } 1305 disconnectedCallback() { 1306 this.baseTooltip.disconnectedCallback() 1307 } 1308} 1309class labelTooltip extends HTMLLabelElement { 1310 constructor() { 1311 super(), 1312 this.baseTooltip = new BaseTooltip(this) 1313 } 1314 connectedCallback() { 1315 this.baseTooltip.connectedCallback() 1316 } 1317 disconnectedCallback() { 1318 this.baseTooltip.disconnectedCallback() 1319 } 1320} 1321class linkTooltip extends HTMLAnchorElement { 1322 constructor() { 1323 super(), 1324 this.baseTooltip = new BaseTooltip(this) 1325 } 1326 connectedCallback() { 1327 this.baseTooltip.connectedCallback() 1328 } 1329 disconnectedCallback() { 1330 this.baseTooltip.disconnectedCallback() 1331 } 1332} 1333_tooltip_ids = new WeakMap, 1334_find_title = new WeakSet, 1335find_title_fn = function() { 1336 if (this.hasAttribute("data-text-tooltip")) 1337 return this.getAttribute("data-text-tooltip"); 1338 let t = (this.lastElementChild ? this.lastElementChild : this).textContent; 1339 return this.hasAttribute("aria-label") ? t = this.getAttribute("aria-label") : this.hasAttribute(dt_original_title) ? t = this.getAttribute(dt_original_title) : this.hasAttribute("title") && !this.hasAttribute(dt_original_title) && (t = this.getAttribute("title") || "", 1340 this.setAttribute(dt_original_title, t), 1341 this.setAttribute("title", "")), 1342 t 1343} 1344, 1345_create_tooltip = new WeakSet, 1346create_tooltip_fn = function(t, e) { 1347 document.body.append(document.createRange().createContextualFragment(`<hdt-tooltip id="${t}" class="hdt-tooltip" role="tooltip"><div class="hdt-tooltip__arrow"></div><div class="hdt-tooltip__inner">${e}</div></hdt-tooltip>`)) 1348} 1349; 1350class Tooltip extends HTMLElement { 1351 constructor() { 1352 super() 1353 } 1354 connectedCallback() { 1355 animate(this, { 1356 opacity: [0, .9], 1357 visibility: ["visible", "visible"] 1358 }, { 1359 duration: .3, 1360 easing: "ease" 1361 }) 1362 } 1363} 1364customElements.define("hdt-btn-tooltip", btnTooltip, { 1365 extends: "button" 1366}), 1367customElements.define("hdt-label-tooltip", labelTooltip, { 1368 extends: "label" 1369}), 1370customElements.define("hdt-a-tooltip", linkTooltip, { 1371 extends: "a" 1372}), 1373customElements.define("hdt-tooltip", Tooltip); 1374class Richlist extends HTMLElement { 1375 constructor() { 1376 super(), 1377 collectableAdd(this, _onOptionClicked), 1378 collectableAdd(this, _onKeyDown), 1379 this.addEventListener("keydown", fnCheck(this, _onKeyDown, onKeyDown_fn)) 1380 } 1381 connectedCallback() {
1382 $$4('[role="option"]', this).forEach((t=>{ 1383 t.addEventListener("click", fnCheck(this, _onOptionClicked, onOptionClicked_fn).bind(this)) 1384 } 1385 )) 1386 } 1387 static get observedAttributes() { 1388 return ["selected"] 1389 } 1390 set selected(t) { 1391 this.setAttribute("selected", t) 1392 } 1393 attributeChangedCallback(t, e, i) { 1394 "selected" === t && null !== e && i !== e && $$4('[role="option"]', this).forEach((t=>{ 1395 t.value === i ? (t.setAttribute("aria-selected", "true"), 1396 $$4(`[aria-owns="${this.id}"]`).forEach((e=>{ 1397 ($4("[change-text]", e) || e).textContent = t.getAttribute("title") || t.innerText || t.value 1398 } 1399 )), 1400 t.dispatchEvent(new CustomEvent("richlist:change",{ 1401 bubbles: !0, 1402 detail: { 1403 value: t.value 1404 } 1405 }))) : t.setAttribute("aria-selected", "false") 1406 } 1407 )) 1408 } 1409} 1410_onOptionClicked = new WeakSet, 1411onOptionClicked_fn = function(t) { 1412 const e = t.currentTarget.value; 1413 this.selected = e, 1414 t.currentTarget.dispatchEvent(new CustomEvent("richlist:select",{ 1415 bubbles: !0, 1416 detail: { 1417 value: e 1418 } 1419 })) 1420} 1421, 1422_onKeyDown = new WeakSet, 1423onKeyDown_fn = function(t) { 1424 "ArrowUp" === t.key ? (t.target.previousElementSibling?.focus(), 1425 t.preventDefault()) : "ArrowDown" === t.key && (t.target.nextElementSibling?.focus(), 1426 t.preventDefault()) 1427} 1428, 1429customElements.define("hdt-richlist", Richlist); 1430class Modal extends DialogBase { 1431 connectedCallback() { 1432 super.connectedCallback(), 1433 this.setAttribute("aria-modal", "true") 1434 } 1435 get effect() { 1436 return this.getAttribute("effect") || "fade" 1437 } 1438 get defaultTemplate() { 1439 return "hdt-tmp-modal" 1440 } 1441 animateOpen() { 1442 return _matchMedia("phone") ? timeline([[this.selectorPartName("overlay"), { 1443 opacity: [0, 1] 1444 }, { 1445 duration: .3, 1446 easing: [.645, .045, .355, 1] 1447 }], [this.selectorPartName("content"), { 1448 transform: ["translateY(100%)", "translateY(0)"] 1449 }, { 1450 duration: .3, 1451 easing: [.645, .045, .355, 1], 1452 at: "<" 1453 }]]) : "fade" == this.effect ? animate(this, { 1454 opacity: [0, 1] 1455 }, { 1456 duration: .2 1457 }) : timeline([[this.selectorPartName("overlay"), { 1458 opacity: [0, 1] 1459 }, { 1460 duration: .2, 1461 easing: [.645, .045, .355, 1] 1462 }], [this.selectorPartName("content"), { 1463 transform: ["translateX(-200px)", "translateX(0)"], 1464 opacity: [0, 1] 1465 }, { 1466 duration: .3, 1467 easing: [.645, .045, .355, 1], 1468 at: "<" 1469 }], [this.selectorPartName("close-button"), { 1470 opacity: [0, 1] 1471 }, { 1472 duration: .2, 1473 easing: [.645, .045, .355, 1] 1474 }]]) 1475 } 1476 animateClose() { 1477 return _matchMedia("phone") ? timeline([[this.selectorPartName("overlay"), { 1478 opacity: [1, 0] 1479 }, { 1480 duration: .3, 1481 easing: [.645, .045, .355, 1] 1482 }], [this.selectorPartName("content"), { 1483 transform: ["translateY(0)", "translateY(100%)"] 1484 }, { 1485 duration: .3, 1486 easing: [.645, .045, .355, 1], 1487 at: "<" 1488 }]]) : "fade" == this.effect ? animate(this, { 1489 opacity: [1, 0] 1490 }, { 1491 duration: .2 1492 }) : timeline([[this.selectorPartName("overlay"), { 1493 opacity: [1, 0] 1494 }, { 1495 duration: .2, 1496 easing: [.645, .045, .355, 1] 1497 }], [this.selectorPartName("content"), { 1498 transform: ["translateX(0)", "translateX(200px)"], 1499 opacity: [1, 0] 1500 }, { 1501 duration: .3, 1502 easing: [.645, .045, .355, 1], 1503 at: "<" 1504 }], [this.selectorPartName("close-button"), { 1505 opacity: [1, 0] 1506 }, { 1507 duration: .2, 1508 easing: [.645, .045, .355, 1] 1509 }]]) 1510 } 1511} 1512customElements.define("hdt-modal", Modal); 1513class Drawer extends Modal { 1514 get defaultTemplate() { 1515 return "hdt-tmp-drawer" 1516 } 1517 get effect() { 1518 let t = this.getAttribute("effect-lg");
1519 return !t || _matchMedia("phone") || _matchMedia("tablet") ? this.getAttribute("effect") || "left" : t 1520 } 1521 get codeEffect() { 1522 switch (this.effect) { 1523 case "left": 1524 return ["translateX(calc(var(--value-logical-flip) * -100%))", "translateX(0)"]; 1525 case "right": 1526 return ["translateX(calc(var(--value-logical-flip) * 100%))", "translateX(0)"]; 1527 case "top": 1528 return ["translateY(-100%)", "translateY(0)"]; 1529 default: 1530 return ["translateY(100%)", "translateY(0)"] 1531 } 1532 } 1533 animateOpen() { 1534 this.selectorPartName("content").style.marginInlineStart = "right" === this.effect ? "auto" : 0; 1535 const t = this.codeEffect; 1536 return timeline([[this.selectorPartName("overlay"), { 1537 opacity: [0, 1] 1538 }, { 1539 duration: .3, 1540 easing: [.645, .045, .355, 1] 1541 }], [this.selectorPartName("footer"), { 1542 opacity: [0, 1] 1543 }, { 1544 duration: .6, 1545 easing: [.645, .045, .355, 1], 1546 at: "<" 1547 }], [this.selectorPartName("content"), { 1548 transform: t 1549 }, { 1550 duration: .3, 1551 at: "<", 1552 easing: "ease" 1553 }], [this.selectorPartName("outside-close-button"), { 1554 opacity: [0, 1] 1555 }, { 1556 duration: .2, 1557 at: "<", 1558 easing: [.645, .045, .355, 1] 1559 }]]) 1560 } 1561 animateClose() { 1562 const t = this.codeEffect.reverse(); 1563 return timeline([[this.selectorPartName("footer"), { 1564 opacity: [1, 0] 1565 }, { 1566 duration: .6, 1567 easing: [.645, .045, .355, 1] 1568 }], [this.selectorPartName("content"), { 1569 transform: t 1570 }, { 1571 duration: .3, 1572 at: "<", 1573 easing: "ease" 1574 }], [this.selectorPartName("outside-close-button"), { 1575 opacity: [1, 0] 1576 }, { 1577 duration: .2, 1578 at: "<", 1579 easing: [.645, .045, .355, 1] 1580 }], [this.selectorPartName("overlay"), { 1581 opacity: [1, 0] 1582 }, { 1583 duration: .3, 1584 easing: [.645, .045, .355, 1], 1585 at: "<" 1586 }]]) 1587 } 1588} 1589customElements.define("hdt-drawer", Drawer); 1590class BeforeAfter extends HTMLElement { 1591 constructor() { 1592 super(), 1593 getterAdd(_reveal, this), 1594 getterAdd(_input, this) 1595 } 1596 connectedCallback() { 1597 $4(".hdt-bf__range", this).addEventListener("input", getterRunFn(_input, this, input_fn).bind(this)), 1598 this.beforeVal = $4(".hdt-bf__range", this).value, 1599 inView(this, getterRunFn(_reveal, this, reveal_fn).bind(this), { 1600 margin: "0px 0px -44% 0px" 1601 }) 1602 } 1603} 1604_reveal = new WeakSet, 1605reveal_fn = function(t) { 1606 animate((t=>{ 1607 this.style.setProperty("--percent-val", this.beforeVal * t) 1608 } 1609 ), { 1610 duration: .6, 1611 easing: [.85, 0, .15, 1] 1612 }) 1613} 1614, 1615_input = new WeakSet, 1616input_fn = function(t) { 1617 this.style.setProperty("--percent-val", t.target.value) 1618} 1619, 1620customElements.define("hdt-before-after", BeforeAfter); 1621class Countdown extends HTMLElement { 1622 timezoneString = themeHDN.settings.shopTimezone ? ` GMT${themeHDN.settings.shopTimezone}` : ""; 1623 constructor() { 1624 super(), 1625 this.selectors = { 1626 days: "[data-days]", 1627 hours: "[data-hours]", 1628 minutes: "[data-minutes]", 1629 seconds: "[data-seconds]" 1630 }, 1631 this.classes = { 1632 enabled: "hdt-cd--enabled", 1633 hide: "hdt-cd--hide", 1634 complete: "hdt-cd--complete" 1635 }, 1636 this.arrayMth = { 1637 1: "january", 1638 2: "february", 1639 3: "march", 1640 4: "april", 1641 5: "may", 1642 6: "june", 1643 7: "july", 1644 8: "august", 1645 9: "september", 1646 10: "october", 1647 11: "november", 1648 12: "december" 1649 }, 1650 this.defaults = { 1651 idTmp: null, 1652 hasZero: !0, 1653 hideTimerOnComplete: !0 1654 }, 1655 cancelAnimationFrame(this.myReq); 1656 const t = Object.assign({}, this.defaults, JSON.parse(this.getAttribute("config") || "{}")); 1657 if (this.date = new Date(Date.parse(this.arrayMth[t.month] + " " + t.date + this.timezoneString)), 1658 !isNaN(this.date)) { 1659 if (this.hideTimerOnComplete = t.hideTimerOnComplete, 1660 this.countDownTime = this.date.getTime(), 1661 t.idTmp) { 1662 const e = $id4(t.idTmp); 1663 e && (this.innerHTML = e.innerHTML) 1664 } 1665 this.daysEl = $4(this.selectors.days, this), 1666 this.hoursEl = $4(this.selectors.hours, this), 1667 this.minutesEl = $4(this.selectors.minutes, this), 1668 this.secondsEl = $4(this.selectors.seconds, this), 1669 this.hasZero = t.hasZero, 1670 this.playing = !1, 1671 this.init(), 1672 inView(this, (t=>(this.play(), 1673 this.isInview = !0, 1674 t=>{ 1675 this.pause(), 1676 this.isInview = !1 1677 } 1678 )), { 1679 margin: "0px 0px 150px 0px" 1680 }), 1681 visibilitychangeFn({ 1682 observes: this, 1683 play: this.play.bind(this), 1684 pause: this.pause.bind(this) 1685 }) 1686 } 1687 } 1688 init() { 1689 this.playing || (this.myReq || this.classList.add(this.classes.enabled), 1690 this.play()) 1691 } 1692 timerLoop() { 1693 const t = (new Date).getTime() 1694 , e = this.countDownTime - t 1695 , i = Math.floor(e / 864e5) 1696 , n = Math.floor(e % 864e5 / 36e5) 1697 , s = Math.floor(e % 36e5 / 6e4) 1698 , r = Math.floor(e % 6e4 / 1e3); 1699 e < 0 ? (this.destroy(), 1700 this.classList.add(this.classes.complete), 1701 this.hideTimerOnComplete && this.classList.add(this.classes.hide)) : (this.daysEl?.updateValue(i, this.hasZero), 1702 this.hoursEl?.updateValue(n, this.hasZero), 1703 this.minutesEl?.updateValue(s, this.hasZero), 1704 this.secondsEl?.updateValue(r, this.hasZero), 1705 this.myReq = requestAnimationFrame(this.timerLoop.bind(this))) 1706 } 1707 play() { 1708 this.playing || (this.myReq = requestAnimationFrame(this.timerLoop.bind(this)), 1709 this.playing = !0) 1710 } 1711 pause() { 1712 this.playing && (cancelAnimationFrame(this.myReq), 1713 this.playing = !1) 1714 } 1715 destroy() { 1716 this.pause(), 1717 this.classList.remove(this.classes.enabled) 1718 } 1719} 1720class CountdownAmount extends HTMLElement { 1721 constructor() { 1722 super(), 1723 this.attachShadow({ 1724 mode: "open" 1725 }); 1726 let t = [...this.textContent].map((()=>`<hdt-countdown-number part="number" effect="${this.getAttribute("effect")}" style="display: inline-block">0</hdt-countdown-number>`)); 1727 this.shadowRoot.appendChild(document.createRange().createContextualFragment(t.join(""))) 1728 }
1729 updateValue(t, e) { 1730 let i = Math.min(99, t).toString().padStart(2, "0"); 1731 if (this.textContent = i, 1732 [...i].forEach(((t,e)=>{ 1733 this.shadowRoot.children[e].setAttribute("number", t) 1734 } 1735 )), 1736 this.nextElementSibling && this.nextElementSibling.shadowRoot) { 1737 let t = 0; 1738 for (; t < 2; t++) 1739 this.nextElementSibling.shadowRoot.children[t].setAttribute("amount", i) 1740 } 1741 e || (this.shadowRoot.children[0].style.display = i < 10 ? "none" : "inline-block") 1742 } 1743} 1744class CountdownAmountNumber extends HTMLElement { 1745 static observedAttributes = ["number"]; 1746 constructor() { 1747 switch (super(), 1748 this.e = { 1749 Y: 0, 1750 S: 1, 1751 R: 0 1752 }, 1753 this.runFrist = 0, 1754 this.getAttribute("effect")) { 1755 case "move_top": 1756 this.e.Y = -8, 1757 this.e.Y2 = 8; 1758 break; 1759 case "move_bottom": 1760 this.e.Y = 6, 1761 this.e.Y2 = -6; 1762 break; 1763 case "scale": 1764 this.e.S = .5; 1765 break; 1766 case "rotate": 1767 this.e.R = 180, 1768 this.e.S = .68 1769 } 1770 this.attachShadow({ 1771 mode: "open" 1772 }).appendChild(document.createRange().createContextualFragment("<div><slot></slot></div>")) 1773 } 1774 async attributeChangedCallback(t, e, i) { 1775 if (++this.runFrist, 1776 "none" == this.getAttribute("effect") || 2 == this.runFrist) 1777 return this.textContent = i; 1778 null !== e && e !== i && (await animate(this.shadowRoot.firstElementChild, { 1779 opacity: [1, 0], 1780 transform: ["translateY(0) rotate(0deg) scale(1)", `translateY(${this.e.Y}px) rotate(${this.e.R}deg) scale(${this.e.S})`] 1781 }, { 1782 duration: .25, 1783 easing: [.64, 0, .78, 0] 1784 }).finished, 1785 this.textContent = i, 1786 animate(this.shadowRoot.firstElementChild, { 1787 opacity: [0, 1], 1788 transform: [`translateY(${this.e.Y2 || this.e.Y}px) rotate(${this.e.R}deg) scale(${this.e.S})`, "translateY(0) rotate(0deg) scale(1)"] 1789 }, { 1790 duration: .25, 1791 delay: .1, 1792 easing: [.22, 1, .36, 1] 1793 })) 1794 } 1795} 1796class CountdownText extends HTMLElement { 1797 static observedAttributes = ["amount"]; 1798 constructor() { 1799 if (super(), 1800 !this.hasAttribute("singular")) 1801 return; 1802 this.attachShadow({ 1803 mode: "open" 1804 }); 1805 let t = 0 1806 , e = ""; 1807 for (; t < 2; t++) 1808 e += `<hdt-countdown-unit ${t ? "singular" : "plural"} part="unit" style="grid-area: 1 / -1; will-change: opacity; opacity: ${t ? 0 : 1};">${t ? this.getAttribute("singular") : this.textContent}</hdt-countdown-unit>`; 1809 this.shadowRoot.appendChild(document.createRange().createContextualFragment(e)) 1810 } 1811} 1812class CountdownUnit extends HTMLElement { 1813 static observedAttributes = ["amount"]; 1814 constructor() { 1815 super() 1816 } 1817 async attributeChangedCallback(t, e, i) { 1818 null !== e && e !== i && (this.style.opacity = this.hasAttribute("plural") ? 1 == i ? 0 : 1 : 1 == i ? 1 : 0) 1819 } 1820} 1821customElements.define("hdt-countdown", Countdown), 1822customElements.define("hdt-countdown-amount", CountdownAmount), 1823customElements.define("hdt-countdown-number", CountdownAmountNumber), 1824customElements.define("hdt-countdown-text", CountdownText), 1825customElements.define("hdt-countdown-unit", CountdownUnit); 1826class Accordion extends HTMLDetailsElement { 1827 static get observedAttributes() { 1828 return ["open"] 1829 } 1830 constructor() { 1831 super(), 1832 this.summaryElement = this.firstElementChild, 1833 this.contentElement = this.lastElementChild, 1834 this._open = this.hasAttribute("open"), 1835 this.summaryElement.addEventListener("click", this._onSummaryClicked.bind(this)), 1836 this.setAttribute("aria-expanded", this._open ? "true" : "false"), 1837 Shopify.designMode && (this.addEventListener(adnmEvts.select, (()=>this.open = !0)), 1838 this.addEventListener(adnmEvts.deselect, (()=>this.open = !1))) 1839 } 1840 set open(t) { 1841 t !== this._open && (this._open = t, 1842 this.isConnected ? this._transition(t) : (t ? this.setAttribute("open", "") : this.removeAttribute("open"), 1843 this.setAttribute("aria-expanded", t ? "true" : "false"))) 1844 } 1845 get open() { 1846 return this._open 1847 } 1848 _myFunc(t, e) { 1849 t && (e && t.removeAttribute("open"), 1850 t.style.height = "auto", 1851 t.style.overflow = "visible") 1852 } 1853 _onSummaryClicked(t) { 1854 t.preventDefault(), 1855 this.open = !this.open 1856 } 1857 _transition(t) { 1858 this.style.overflow = "hidden", 1859 t ? (this.setAttribute("open", ""), 1860 this.setAttribute("aria-expanded", !0), 1861 timeline([[this, { 1862 height: [`${this.summaryElement.clientHeight}px`, `${this.scrollHeight}px`] 1863 }, { 1864 duration: .25, 1865 easing: "ease" 1866 }], [this.contentElement, { 1867 opacity: [0, 1], 1868 transform: ["translateY(4px)", "translateY(0)"] 1869 }, { 1870 duration: .15, 1871 at: "-0.1" 1872 }]]).finished.then((()=>{ 1873 this._myFunc(this, !1) 1874 } 1875 ))) : (this.setAttribute("aria-expanded", !1), 1876 timeline([[this.contentElement, { 1877 opacity: 0 1878 }, { 1879 duration: .15 1880 }], [this, { 1881 height: [`${this.clientHeight}px`, `${this.summaryElement.clientHeight}px`] 1882 }, { 1883 duration: .25, 1884 at: "<", 1885 easing: "ease" 1886 }]]).finished.then((()=>{ 1887 this._myFunc(this, !0) 1888 } 1889 ))) 1890 } 1891 attributeChangedCallback(t, e, i) { 1892 "open" === t && this.setAttribute("aria-expanded", "" === i ? "true" : "false") 1893 } 1894} 1895customElements.define("hdt-accordion", Accordion, { 1896 extends: "details" 1897}); 1898class AccordionUrl extends Accordion { 1899 _onSummaryClicked(t) { 1900 if (t.preventDefault(), 1901 this.summaryElement.hasAttribute("data-url") && this.hasAttribute("only-click-icon") && !t.target.hasAttribute("accordion-icon")) 1902 return window.location.href = this.summaryElement.getAttribute("data-url"); 1903 this.open = !this.open 1904 } 1905} 1906customElements.define("hdt-accordion-url", AccordionUrl, { 1907 extends: "details" 1908}); 1909class Tab extends HTMLElement { 1910 #t; 1911 connectedCallback() {
1912 this.idControls && (this.buttons = $$4("button", this), 1913 this.items = $$4("[tab-item]", this.idControls), 1914 this.#t = new AbortController, 1915 this.oldIndex = 0, 1916 this.buttons.forEach((t=>t.addEventListener("click", (()=>this._onButtonClicked(t, this.buttons.indexOf(t))), { 1917 signal: this.#t.signal 1918 }))), 1919 Shopify.designMode && this.addEventListener(adnmEvts.select, (t=>t.target.click()))) 1920 } 1921 disconnectedCallback() { 1922 this.#t.abort() 1923 } 1924 get idControls() { 1925 return $id4(this.getAttribute("aria-controls")) 1926 } 1927 animateHide() { 1928 return animate(this.items[this.oldIndex], { 1929 opacity: [1, 0], 1930 transform: ["translateY(0px)", "translateY(19px)"] 1931 }, { 1932 duration: .3, 1933 easing: "ease-in" 1934 }) 1935 } 1936 animateShow(t) { 1937 return animate(this.items[t], { 1938 opacity: [0, 1], 1939 transform: ["translateY(19px)", "translateY(0px)"] 1940 }, { 1941 duration: .2, 1942 delay: .2, 1943 easing: "ease-out" 1944 }) 1945 } 1946 _onButtonClicked(t, e) { 1947 if ("true" === t.getAttribute("aria-current")) 1948 return; 1949 this.buttons[this.oldIndex].setAttribute("aria-current", "false"), 1950 this.buttons[e].setAttribute("aria-current", "true"); 1951 this.animateHide().finished.then((()=>{ 1952 this.items[this.oldIndex].removeAttribute("tab-selected"), 1953 this.oldIndex = e, 1954 this.items[e].setAttribute("tab-selected", ""), 1955 this.animateShow(e) 1956 } 1957 )) 1958 } 1959} 1960customElements.define("hdt-tab", Tab); 1961class Marquee extends HTMLElement { 1962 constructor() { 1963 super(), 1964 this.classes = { 1965 enabled: "hdt-marquee--enabled", 1966 duplicate: "hdt-marquee--duplicate" 1967 }, 1968 this.oldWidth = 0, 1969 this.attachShadow({ 1970 mode: "open" 1971 }).appendChild(document.createRange().createContextualFragment("<slot part='wrapper'></slot>")), 1972 this.init(); 1973 new ResizeObserver((t=>this.init())).observe(this), 1974 _matchMedia("motion") && (inView(this, (t=>(this.animation.play(), 1975 this.isInview = !0, 1976 t=>{ 1977 this.animation.pause(), 1978 this.isInview = !1 1979 } 1980 )), { 1981 margin: "250px" 1982 }), 1983 visibilitychangeFn({ 1984 observes: this, 1985 play: this.animation.play, 1986 pause: this.animation.pause 1987 })) 1988 } 1989 get wrapper() { 1990 return getterGet(_wrapper, this, this.shadowRoot.querySelector('[part="wrapper"]')) 1991 } 1992 init() { 1993 this.clientWidth < this.oldWidth || (this.oldWidth = this.clientWidth, 1994 this.prepareContent(), 1995 this.calculateWidthRatio()) 1996 } 1997 prepareContent() { 1998 this.classList.remove(this.classes.enabled); 1999 var t = $$4("." + this.classes.duplicate, this); 2000 t.length && t.forEach((t=>t.remove())) 2001 } 2002 calculateWidthRatio() { 2003 let t, e, i = Math.ceil(this.clientWidth / this.firstElementChild.offsetWidth) + 1; 2004 const n = document.createDocumentFragment(); 2005 for (e = 0; e < i; e++) 2006 t = this.firstElementChild.cloneNode(!0), 2007 t.setAttribute("aria-hidden", !0), 2008 t.classList.add(this.classes.duplicate), 2009 t.style.setProperty("--index", e + 1), 2010 n.appendChild(t); 2011 this.append(n), 2012 this.classList.add(this.classes.enabled), 2013 _matchMedia("motion") && (this.animation = animate(this.wrapper, { 2014 transform: ["translateX(0)", "translateX(calc(var(--value-logical-flip) * var(--dir-logical) * 100%))"] 2015 }, { 2016 duration: 1 / parseFloat(this.getAttribute("speed")) * (this.wrapper.clientWidth / 350), 2017 easing: "linear", 2018 repeat: 1 / 0 2019 }), 2020 this.hasAttribute("pause-on-pointer-enter") && (this.addEventListener("mouseenter", this.onmouseenter), 2021 this.addEventListener("touchstart", this.onmouseenter))) 2022 } 2023 onmouseenter() { 2024 this.animation.pause(), 2025 this.addEventListener("mouseleave", this.onmouseleave), 2026 this.addEventListener("touchend", this.onmouseleave) 2027 } 2028 onmouseleave() { 2029 this.animation.play(), 2030 this.removeEventListener("mouseleave", this.onmouseleave), 2031 this.removeEventListener("touchend", this.onmouseleave) 2032 } 2033 disconnectedCallback() { 2034 getterDelete(_wrapper, this), 2035 this.removeEventListener("mouseenter", this.onmouseenter), 2036 this.removeEventListener("touchstart", this.onmouseenter) 2037 } 2038} 2039_wrapper = new WeakMap, 2040customElements.define("hdt-marquee", Marquee);
2041class ImageEffect extends HTMLImageElement { 2042 constructor() { 2043 super(...arguments), 2044 getterAdd(_effect, this) 2045 } 2046 connectedCallback() { 2047 _matchMedia("motion") && getterRunFn(_effect, this, effect_fn).call(this) 2048 } 2049} 2050_effect = new WeakSet, 2051effect_fn = function() { 2052 const t = this.getAttribute("on-eff"); 2053 if ("ambient" === t) 2054 animate(this, { 2055 transform: ["rotate(0deg) translateX(1em) rotate(0deg) scale(1.2)", "rotate(360deg) translateX(1em) rotate(-360deg) scale(1.2)"] 2056 }, { 2057 duration: 30, 2058 easing: "linear", 2059 repeat: 1 / 0 2060 }); 2061 else if ("parallax" === t) { 2062 const t = parseFloat(this.style.getPropertyValue("--parallax-scale") || 1.3) 2063 , [e,i] = [t, 15 / t] 2064 , n = this.closest(".hdt-section").matches(":first-child"); 2065 scroll(animate(this, { 2066 transform: [`scale(${e}) translateY(-${i}%)`, `scale(${e}) translateY(${i}%)`] 2067 }, { 2068 easing: "linear" 2069 }), { 2070 target: this, 2071 offset: [n ? "start start" : "start end", "end start"] 2072 }) 2073 } 2074} 2075, 2076customElements.define("hdt-effect", ImageEffect, { 2077 extends: "img" 2078}); 2079class ImageLazy extends HTMLImageElement { 2080 constructor() { 2081 super(...arguments), 2082 "auto" === this.getAttribute("data-sizes") && (getterAdd(_optimumx, this, this.getAttribute("data-optimumx") || 1), 2083 getterAdd(_updateSizes, this), 2084 getterRunFn(_updateSizes, this, updateSizes_fn).call(this), 2085 this.resizeObserver = new ResizeObserver((t=>getterRunFn(_updateSizes, this, updateSizes_fn).call(this))), 2086 this.resizeObserver.observe(this)) 2087 } 2088} 2089_updateSizes = new WeakSet, 2090_optimumx = new WeakMap, 2091updateSizes_fn = function() { 2092 this.setAttribute("sizes", this.offsetWidth * getterGet(_optimumx, this) + "px") 2093} 2094, 2095customElements.define("hdt-lazy", ImageLazy, { 2096 extends: "img" 2097}); 2098class HeightObserver extends HTMLElement { 2099 constructor() { 2100 super(), 2101 getterAdd(_resizeObserver, this), 2102 window.ResizeObserver && new ResizeObserver(throttle(getterRunFn(_resizeObserver, this, resizeObserver_fn).bind(this))).observe(this) 2103 } 2104 connectedCallback() { 2105 window.ResizeObserver || html.style.setProperty(`--${this.getAttribute("prefix")}-height`, `${Math.round(this.clientHeight)}px`) 2106 } 2107} 2108_resizeObserver = new WeakSet, 2109resizeObserver_fn = function(t) { 2110 t.forEach((t=>{ 2111 if (t.target === this) { 2112 const e = t.borderBoxSize ? t.borderBoxSize.length > 0 ? t.borderBoxSize[0].blockSize : t.borderBoxSize.blockSize : t.target.clientHeight; 2113 html.style.setProperty(`--${this.getAttribute("prefix")}-height`, `${Math.round(e)}px`) 2114 } 2115 } 2116 )) 2117} 2118, 2119customElements.define("hdt-height-observer", HeightObserver);
2120class StickyHeader extends HeightObserver { 2121 constructor() { 2122 super() 2123 } 2124 connectedCallback() { 2125 this.checkTransparent(), 2126 super.connectedCallback(), 2127 this.stickyType = this.getAttribute("sticky-type"), 2128 "none" !== this.stickyType && (this.header = $4(".hdt-section-header"), 2129 this.headerIsAlwaysSticky = "always" === this.stickyType, 2130 this.headerBounds = {}, 2131 this.headerIsAlwaysSticky && this.header.classList.add("shopify-section-header-sticky"), 2132 this.currentScrollTop = 0, 2133 this.preventReveal = !1, 2134 this.predictiveSearch = $4("predictive-search", this), 2135 this.onScrollHandler = this.onScroll.bind(this), 2136 this.hideHeaderOnScrollUp = ()=>this.preventReveal = !0, 2137 this.addEventListener("preventHeaderReveal", this.hideHeaderOnScrollUp), 2138 window.addEventListener("scroll", this.onScrollHandler, !1), 2139 this.createObserver()) 2140 } 2141 disconnectedCallback() { 2142 this.removeEventListener("preventHeaderReveal", this.hideHeaderOnScrollUp), 2143 window.removeEventListener("scroll", this.onScrollHandler) 2144 } 2145 createObserver() { 2146 new IntersectionObserver(((t,e)=>{ 2147 this.headerBounds = t[0].intersectionRect, 2148 e.disconnect() 2149 } 2150 )).observe(this.header) 2151 } 2152 onScroll() { 2153 const t = window.scrollY || html.scrollTop; 2154 if (!this.predictiveSearch || !this.predictiveSearch.isOpen) { 2155 if (t > this.currentScrollTop && t > this.headerBounds.bottom) { 2156 if (this.header.classList.add("scrolled-past-header"), 2157 this.preventHide) 2158 return; 2159 requestAnimationFrame(this.hide.bind(this)) 2160 } else 2161 t < this.currentScrollTop && t > this.headerBounds.bottom ? (this.header.classList.add("scrolled-past-header"), 2162 this.preventReveal ? (window.clearTimeout(this.isScrolling), 2163 this.isScrolling = setTimeout((()=>{ 2164 this.preventReveal = !1 2165 } 2166 ), 66), 2167 requestAnimationFrame(this.hide.bind(this))) : requestAnimationFrame(this.reveal.bind(this))) : t <= this.headerBounds.top && (this.header.classList.remove("scrolled-past-header"), 2168 requestAnimationFrame(this.reset.bind(this))); 2169 this.currentScrollTop = t 2170 } 2171 } 2172 hide() { 2173 this.headerIsAlwaysSticky || (this.header.classList.add("shopify-section-header-hidden", "shopify-section-header-sticky"), 2174 this.closeMenuDisclosure()) 2175 } 2176 reveal() { 2177 this.headerIsAlwaysSticky || (this.header.classList.add("shopify-section-header-sticky", "animate"), 2178 this.header.classList.remove("shopify-section-header-hidden")) 2179 } 2180 reset() { 2181 this.headerIsAlwaysSticky || this.header.classList.remove("shopify-section-header-hidden", "shopify-section-header-sticky", "animate") 2182 } 2183 closeMenuDisclosure() { 2184 $$4('details[is="hdt-header-menu"][open]', this.header).forEach((t=>t.toggle(!1, !1))) 2185 } 2186 checkTransparent() { 2187 $4(".section-allow-transparent.hdt-section:first-child") && !$4(".hdt-section-header + .shopify-section-group-header-group") && html.setAttribute("enabled-transparent-header", "") 2188 } 2189} 2190customElements.define("hdt-sticky-header", StickyHeader); 2191class MegaMenu extends Accordion { 2192 static get observedAttributes() { 2193 return ["open", "aria-expanded"] 2194 } 2195 constructor() { 2196 super(), 2197 _matchMedia("phone") || ("hover" === this.event && new HoverIntent(this,{ 2198 onEnter: t=>{ 2199 t.summaryElement.classList.add("is_action-hover"), 2200 this.toggle(!0) 2201 } 2202 , 2203 onExit: t=>{ 2204 t.summaryElement.classList.remove("is_action-hover"), 2205 this.toggle(!1) 2206 } 2207 , 2208 exitDelay: 150, 2209 interval: 35, 2210 sensitivity: 3 2211 },this.summaryElement), 2212 getterAdd(_clickOutside, this), 2213 getterAdd(_escape, this)) 2214 } 2215 get open() { 2216 return "true" === this.getAttribute("aria-expanded") 2217 } 2218 get event() { 2219 return getterGet(_event, this, _matchMedia("supports-hover") ? this.getAttribute("event") : "click") 2220 } 2221 get position() { 2222 return getterGet(_position, this, this.getAttribute("position") || "bottom") 2223 } 2224 get isCenterOnScreen() { 2225 return getterGet(_isCenterOnScreen, this, "center_on_screen" === this.position) 2226 } 2227 get needCalc() { 2228 return getterGet(_needCalc, this, !this.hasAttribute("not-need-calc")) 2229 } 2230 get x() { 2231 return getterGet(_x, this, this.isCenterOnScreen ? "-50%" : "0") 2232 } 2233 _onSummaryClicked(t) { 2234 if (this.summaryElement.hasAttribute("data-url") && ("hover" === this.event || this.open && this.hasAttribute("opened-able-click"))) 2235 return window.location.href = this.summaryElement.getAttribute("data-url"); 2236 t.preventDefault(), 2237 this.toggle() 2238 } 2239 toggle(t=void 0, e=!0) { 2240 if ("boolean" == typeof t ? t : !this.open) { 2241 this.setAttribute("open", e ? "" : "immediate"), 2242 this.needCalc && !this.isCenterOnScreen && updatePositionFloatingEl.call(this, this.summaryElement, this.contentElement, null, this.position, !1); 2243 const t = timeline([[this.contentElement, { 2244 opacity: [0, 1], 2245 visibility: ["hidden", "visible"], 2246 transform: [`translateX(${this.x}) translateY(15px)`, `translateX(${this.x}) translateY(0)`] 2247 }, { 2248 duration: .4, 2249 easing: [.19, 1, .22, 1] 2250 }]]); 2251 e || t.finish() 2252 } else { 2253 const t = timeline([[this.contentElement, { 2254 opacity: [1, 0], 2255 visibility: ["visible", "hidden"], 2256 transform: [`translateX(${this.x}) translateY(0)`, `translateX(${this.x}) translateY(15px)`] 2257 }, { 2258 duration: .4, 2259 easing: [.19, 1, .22, 1] 2260 }]]); 2261 t.finished.then((()=>{ 2262 this.isActive || this.removeAttribute("open") 2263 } 2264 )), 2265 e || (this.isActive = !1, 2266 t.finish()) 2267 } 2268 } 2269 attributeChangedCallback(t, e, i) {
2270 _matchMedia("phone") || ("open" === t ? this.setAttribute("aria-expanded", "" === i ? "true" : "false") : "aria-expanded" === t && ("false" === i ? (document.removeEventListener("click", getterRunFn(_clickOutside, this, clickOutside_fn).bind(this)), 2271 document.removeEventListener("keydown", getterRunFn(_escape, this, escape_fn).bind(this))) : (document.addEventListener("click", getterRunFn(_clickOutside, this, clickOutside_fn).bind(this)), 2272 document.addEventListener("keydown", getterRunFn(_escape, this, escape_fn).bind(this))))) 2273 } 2274} 2275_event = new WeakMap, 2276_position = new WeakMap, 2277_isCenterOnScreen = new WeakMap, 2278_x = new WeakMap, 2279_needCalc = new WeakMap, 2280_clickOutside = new WeakSet, 2281_escape = new WeakSet, 2282clickOutside_fn = function(t) { 2283 "click" === this.event && (this.contains(t.target) || this.toggle(!1)) 2284} 2285, 2286escape_fn = function(t) { 2287 if ("Escape" === t.code) { 2288 const e = t.target.closest('details[is="hdt-header-menu"][open]'); 2289 e && (e.toggle(!1), 2290 t.stopPropagation()) 2291 } 2292} 2293, 2294customElements.define("hdt-header-menu", MegaMenu, { 2295 extends: "details" 2296}); 2297var _color_limit, color_limit_fn, _color_item_first, _color_item_last, _color_resizeObserver, color_resizeObserver_fn, _clicked_color_viewmore, _click_color_viewmore, click_color_viewmore_fn, _color_slider, _delegate2, _even_color, _color_changed_data, color_changed_data_fn, _color_products, _color_product_urls, _color_product_url_first, _color_on_hovered, color_on_hovered_fn, _create_img, create_img_fn, _color_vimgs, isColorLimit = "is--color-limit"; 2298class ColorList extends HTMLFieldSetElement { 2299 constructor() { 2300 super(), 2301 getterAdd(_delegate2, this, new Delegate(this)), 2302 getterAdd(_color_changed_data, this), 2303 getterAdd(_color_on_hovered, this), 2304 getterAdd(_create_img, this), 2305 getterAdd(_color_products, this, this.closest(".hdt-card-product")), 2306 getterAdd(_color_product_urls, this, $$4("[data-pr-url]", getterGet(_color_products, this))) 2307 } 2308 connectedCallback() { 2309 $$4('[type="radio"]:not([disabled])', this).length > 0 && (getterGet(_delegate2, this).on("change", '[type="radio"]', getterRunFn(_color_changed_data, this, color_changed_data_fn).bind(this)), 2310 getterGet(_delegate2, this).on("pointerover", '[type="radio"][data-vimg] + label', getterRunFn(_color_on_hovered, this, color_on_hovered_fn).bind(this), !0), 2311 _matchMedia("phone") || "hover" != this.event || $$4('[type="radio"] + label', this).forEach((t=>{ 2312 new HoverIntent(t,{ 2313 onEnter: t=>t.click(), 2314 onExit: t=>{} 2315 , 2316 exitDelay: 100, 2317 interval: 100, 2318 sensitivity: 6 2319 }) 2320 } 2321 ))), 2322 this.childElementCount > 2 && (getterAdd(_clicked_color_viewmore, this, !1), 2323 getterAdd(_color_item_first, this, this.firstChild), 2324 getterAdd(_color_item_last, this, this.lastChild), 2325 getterAdd(_color_resizeObserver, this), 2326 getterAdd(_color_slider, this, this.closest(".hdt-slider__products")), 2327 this.hasAttribute("auto-limit") && (getterAdd(_color_limit, this), 2328 window.ResizeObserver ? new ResizeObserver(throttle(getterRunFn(_color_resizeObserver, this, color_resizeObserver_fn).bind(this))).observe(this) : getterRunFn(_color_limit, this, color_limit_fn).call(this)), 2329 this.hasAttribute("action-all") && (getterAdd(_click_color_viewmore, this), 2330 getterGet(_color_item_last, this).addEventListener("click", getterRunFn(_click_color_viewmore, this, click_color_viewmore_fn).bind(this)), 2331 window.ResizeObserver && !this.hasAttribute("auto-limit") && new ResizeObserver(throttle(getterRunFn(_color_resizeObserver, this, color_resizeObserver_fn).bind(this))).observe(this))) 2332 } 2333 disconnectedCallback() { 2334 getterGet(_delegate2, this).off() 2335 } 2336 get event() { 2337 return getterGet(_even_color, this, _matchMedia("supports-hover") ? this.getAttribute("event") : "click") 2338 } 2339} 2340_color_limit = new WeakSet, 2341_color_item_first = new WeakMap, 2342_color_item_last = new WeakMap, 2343_color_resizeObserver = new WeakSet, 2344_click_color_viewmore = new WeakSet, 2345_clicked_color_viewmore = new WeakMap, 2346_color_slider = new WeakMap, 2347_delegate2 = new WeakMap, 2348_even_color = new WeakMap, 2349_color_changed_data = new WeakSet, 2350_color_products = new WeakMap, 2351_color_product_urls = new WeakMap, 2352_color_product_url_first = new WeakMap, 2353_color_vimgs = new WeakMap, 2354color_limit_fn = function() { 2355 const t = getterGet(_color_item_first, this).getBoundingClientRect().width 2356 , e = getterGet(_color_item_last, this).getBoundingClientRect().width 2357 , i = getComputedStyle(this) 2358 , n = parseInt(i.gap || i.columnGap || 10) 2359 , s = this.childElementCount - 1 2360 , r = t * s + (s - 1) * n 2361 , a = Math.floor(this.clientWidth / (t + n)) 2362 , o = Math.floor((this.clientWidth - e) / (t + n)); 2363 a >= s || r <= this.clientWidth ? (getterGet(_color_item_last, this).setAttribute("hidden", ""), 2364 $4("." + isColorLimit, this)?.classList.remove(isColorLimit)) : ($4("." + isColorLimit, this)?.classList.remove(isColorLimit), 2365 this.childNodes[o]?.classList.add(isColorLimit), 2366 getterGet(_color_item_last, this).lastElementChild.textContent = "+" + (s - o), 2367 getterGet(_color_item_last, this).style.opacity = 1) 2368} 2369, 2370color_resizeObserver_fn = function() { 2371 getterGet(_color_slider, this) && getterGet(_slider_api, getterGet(_color_slider, this)).reInit(), 2372 getterGet(_clicked_color_viewmore, this) || (this.hasAttribute("auto-limit") ? ($4("." + isColorLimit, this)?.classList.remove(isColorLimit), 2373 this.childNodes[1]?.classList.add(isColorLimit), 2374 getterGet(_color_item_last, this).removeAttribute("hidden"), 2375 getterGet(_color_item_last, this).style.opacity = 0, 2376 getterRunFn(_color_limit, this, color_limit_fn).call(this), 2377 setTimeout((()=>{ 2378 getterRunFn(_color_limit, this, color_limit_fn).call(this) 2379 } 2380 ), 0)) : (this.childNodes[parseInt(this.getAttribute("maximum"))]?.classList.add(isColorLimit), 2381 getterGet(_color_item_last, this).removeAttribute("hidden"))) 2382} 2383, 2384click_color_viewmore_fn = function(t) { 2385 t.preventDefault(), 2386 getterAdd(_clicked_color_viewmore, this, !0, !0); 2387 const e = $4("." + isColorLimit, this); 2388 e?.classList.remove(isColorLimit), 2389 getterGet(_color_item_last, this).setAttribute("hidden", ""), 2390 this.style.minHeight = this.clientHeight + "px", 2391 animate(this.children, { 2392 opacity: [0, 1], 2393 transform: ["scale(.5) translateY(10px)", "scale(1) translateY(0)"] 2394 }, {
2395 duration: .35, 2396 delay: stagger(.05, { 2397 easing: "ease-out" 2398 }), 2399 easing: "ease" 2400 }).finished.then((()=>{ 2401 this.style.minHeight = null, 2402 getterAdd(_clicked_color_viewmore, this, !1, !0), 2403 getterGet(_color_slider, this) && getterGet(_slider_api, getterGet(_color_slider, this)).reInit() 2404 } 2405 )), 2406 e.previousElementSibling?.querySelector("input").focus() 2407} 2408, 2409color_changed_data_fn = function(t, e) { 2410 if (getterGet(_color_product_urls, this).length) { 2411 const t = UrlWithVariant.get(getterGet(_color_product_url_first, this, getterGet(_color_product_urls, this)[0].href), e.dataset.vid); 2412 getterGet(_color_product_urls, this).forEach((e=>{ 2413 e.href = t 2414 } 2415 )) 2416 } 2417 const i = getterGet(_color_vimgs, e, e.getAttribute("data-vimg")); 2418 if (i) { 2419 const t = getterGet(_color_products, this).querySelector(".hdt-card-product__media--main"); 2420 if (i === t.getAttribute("src")) 2421 return; 2422 t.parentElement.removeAttribute("loaded"), 2423 t.parentElement.setAttribute("loading", ""), 2424 t.replaceWith(getterRunFn(_create_img, this, create_img_fn).call(this, i, t)) 2425 } 2426} 2427, 2428_color_on_hovered = new WeakSet, 2429color_on_hovered_fn = function(t, e) { 2430 const i = e.previousElementSibling; 2431 if (!i) 2432 return; 2433 const n = getterGet(_color_vimgs, i, i.getAttribute("data-vimg")); 2434 if (n) { 2435 const t = getterGet(_color_products, this).querySelector(".hdt-card-product__media--main"); 2436 n !== t.getAttribute("src") && getterRunFn(_create_img, this, create_img_fn).call(this, n, t) 2437 } 2438} 2439, 2440_create_img = new WeakSet, 2441create_img_fn = function(t, e) { 2442 return createImg({ 2443 src: t, 2444 width: e.getAttribute("width"), 2445 height: e.getAttribute("height"), 2446 alt: e.alt, 2447 onload: !0, 2448 attrs: { 2449 class: e.className, 2450 sizes: e.sizes, 2451 "data-widths": e.getAttribute("data-widths") || "[]" 2452 } 2453 }) 2454} 2455, 2456customElements.define("hdt-color-list", ColorList, { 2457 extends: "fieldset" 2458}); 2459var cacheUrlVariant = {} 2460 , UrlWithVariant = class { 2461 static get(t, e) { 2462 if (t && e) 2463 return cacheUrlVariant[e] ? cacheUrlVariant[e] : ((t = new URL(t)).searchParams.set("variant", e), 2464 cacheUrlVariant[e] = t.toString()) 2465 } 2466} 2467; 2468const {currencyFormat} = themeHDN.settings 2469 , variantChange = "variant:change"; 2470var _on_after_close, on_after_close_fn, _on_submit, on_submit_fn, _section_ids_modal = new WeakMap; 2471class LazyModal extends Modal { 2472 constructor() { 2473 super(), 2474 getterAdd(_on_after_close, this), 2475 getterAdd(_section_ids_modal, this, this.getAttribute("section-id")), 2476 this.addEventListener("dialog:doneClose", getterRunFn(_on_after_close, this, on_after_close_fn).bind(this)) 2477 } 2478 async openDialog(t=!0, e) { 2479 const i = e ? e.getAttribute("handle") : this.getAttribute("handle"); 2480 if (!i) 2481 return; 2482 document.dispatchEvent(new CustomEvent("theme:loading:doing",{ 2483 bubbles: !0 2484 })), 2485 e?.setAttribute("aria-busy", "true"); 2486 const n = await (await cachedFetch(`${window.Shopify.routes.root}products/${i}?section_id=${getterGet(_section_ids_modal, this)}`)).text(); 2487 document.dispatchEvent(new CustomEvent("theme:loading:done",{ 2488 bubbles: !0 2489 })), 2490 e?.setAttribute("aria-busy", "false"); 2491 const s = (new DOMParser).parseFromString(n, "text/html") 2492 , r = document.createRange().createContextualFragment(s.getElementById(`shopify-section-${getterGet(_section_ids_modal, this)}`).innerHTML); 2493 return this.replaceChildren(...r.children), 2494 Shopify?.PaymentButton?.init(), 2495 document.dispatchEvent(new CustomEvent("currency:update")), 2496 super.openDialog(t) 2497 } 2498 get controls() { 2499 return $$4(`[aria-controls="${this.id}"]`, this.getRootNode()) 2500 } 2501} 2502_on_after_close = new WeakSet, 2503on_after_close_fn = function() { 2504 this.innerHTML = "" 2505} 2506; 2507class FetchButtonModal extends btnTooltip { 2508 constructor() { 2509 super(), 2510 $id4(this.getAttribute("aria-controls"))?.updateBtbsOpen(this) 2511 } 2512} 2513customElements.define("hdt-lazy-modal", LazyModal), 2514customElements.define("hdt-open-modal-btn", FetchButtonModal, { 2515 extends: "button" 2516}); 2517class ProductForm extends HTMLFormElement { 2518 constructor() { 2519 super(),
2520 getterAdd(_on_submit, this), 2521 this.addEventListener("submit", getterRunFn(_on_submit, this, on_submit_fn)) 2522 } 2523 connectedCallback() { 2524 this.hideErrors = "true" === this.dataset.hideErrors, 2525 this.id.disabled = !1 2526 } 2527} 2528_on_submit = new WeakSet, 2529on_submit_fn = async function(t) { 2530 if (t.preventDefault(), 2531 this.checkBreak) 2532 return; 2533 if (!this.checkValidity()) 2534 return void this.reportValidity(); 2535 const e = Array.from(this.elements).filter((t=>"submit" === t.type)); 2536 e.forEach((t=>{ 2537 t.setAttribute("disabled", "disabled"), 2538 t.setAttribute("aria-busy", "true") 2539 } 2540 )), 2541 document.dispatchEvent(new CustomEvent("theme:loading:doing",{ 2542 bubbles: !0 2543 })); 2544 let i = []; 2545 document.dispatchEvent(new CustomEvent("cart:push:section.id",{ 2546 bubbles: !0, 2547 detail: { 2548 sections: i 2549 } 2550 })); 2551 const n = new FormData(this); 2552 n.set("sections", i.join(",")), 2553 n.set("sections_url", this.id.value ? `${Shopify.routes.root}variants/${this.id.value}` : window.location.pathname); 2554 const s = await fetch(`${Shopify.routes.root}cart/add.js`, { 2555 body: n, 2556 method: "POST", 2557 headers: { 2558 "X-Requested-With": "XMLHttpRequest" 2559 } 2560 }); 2561 e.forEach((t=>{ 2562 t.removeAttribute("disabled"), 2563 t.removeAttribute("aria-busy") 2564 } 2565 )); 2566 const r = await s.json(); 2567 if (document.dispatchEvent(new CustomEvent("theme:loading:done",{ 2568 bubbles: !0 2569 })), 2570 s.ok) { 2571 const t = await createCartPromise(); 2572 t.sections = r.sections, 2573 this.dispatchEvent(new CustomEvent("variant:add",{ 2574 bubbles: !0, 2575 detail: { 2576 items: r.hasOwnProperty("items") ? r.items : [r], 2577 actionAfterATC: n.get("action_added"), 2578 cart: t 2579 } 2580 })), 2581 document.dispatchEvent(new CustomEvent("cart:change",{ 2582 bubbles: !0, 2583 detail: { 2584 baseEvent: "variant:add", 2585 actionAfterATC: n.get("action_added"), 2586 cart: t 2587 } 2588 })) 2589 } else { 2590 if (this.hideErrors) 2591 return; 2592 this.dispatchEvent(new CustomEvent("cart:add:error",{ 2593 bubbles: !0, 2594 detail: { 2595 isGiftCardRecipient: "true" === this.dataset.giftCardRecipient, 2596 error: r.description 2597 } 2598 })) 2599 } 2600} 2601; 2602var _update_bundle_total, update_bundle_total_fn, _update_total_bundle = new WeakMap; 2603class ProductFormBundle extends ProductForm { 2604 constructor() { 2605 super(), 2606 getterAdd(_update_bundle_total, this) 2607 } 2608 connectedCallback() { 2609 getterAdd(_update_total_bundle, this, $4("[update-total]", this)), 2610 this.totalPrice = Number(getterGet(_update_total_bundle, this).dataset.price), 2611 this.totalComparePrice = Number(getterGet(_update_total_bundle, this).dataset.cpprice), 2612 this.addEventListener("update:bundle:total", getterRunFn(_update_bundle_total, this, update_bundle_total_fn).bind(this)) 2613 } 2614 disconnectedCallback() { 2615 this.removeEventListener("update:bundle:total", getterRunFn(_update_bundle_total, this, update_bundle_total_fn).bind(this)) 2616 } 2617} 2618_update_bundle_total = new WeakSet, 2619update_bundle_total_fn = function(t) { 2620 "plus" == t.detail.action ? (this.totalPrice = this.totalPrice + t.detail.remainPrice, 2621 this.totalComparePrice = this.totalComparePrice + t.detail.remainComparePrice) : (this.totalPrice = this.totalPrice - t.detail.remainPrice, 2622 this.totalComparePrice = this.totalComparePrice - t.detail.remainComparePrice), 2623 $4("hdt-compare-at-price", getterGet(_update_total_bundle, this)).toggleAttribute("hidden", this.totalComparePrice <= this.totalPrice), 2624 $4("hdt-compare-at-price .hdt-money", getterGet(_update_total_bundle, this)).innerHTML = formatMoney(this.totalComparePrice), 2625 $4("hdt-price .hdt-money", getterGet(_update_total_bundle, this)).innerHTML = formatMoney(this.totalPrice), 2626 document.dispatchEvent(new CustomEvent("currency:update")) 2627} 2628; 2629var _bundle_product, bundle_product_fn, _on_variant_changed, on_variant_changed_fn, _cart_error, _cart_error_fn, _on_recipient_form_changed, on_recipient_form_changed_fn, _cart_error2, _cart_error2_fn, _displayErrorMessage, displayErrorMessage_fn, _createErrorListItem, createErrorListItem_fn, _clearErrorMessage, clearErrorMessage_fn, _on_value_change, on_value_change_fn, _variants_data, _find_closest_variant, find_closest_variant_fn, _update_variant_statuses, update_variant_statuses_fn, _update_url, update_url_fn, _master_input_change, master_input_change_fn, _bundle_items = new WeakMap; 2630class bundleProduct extends HTMLElement { 2631 #t; 2632 constructor() { 2633 super(), 2634 getterAdd(_bundle_product, this), 2635 getterAdd(_bundle_items, this, $$4('[name^="items[]"]', this)) 2636 } 2637 connectedCallback() { 2638 this.#t = new AbortController; 2639 const t = $4('[name="items[][id]"]', this); 2640 this.price = Number(t.dataset.price), 2641 this.comparePrice = Number(t.dataset.cpprice), 2642 this.addEventListener("change", getterRunFn(_bundle_product, this, bundle_product_fn).bind(this), { 2643 signal: this.#t.signal 2644 }) 2645 } 2646 disconnectedCallback() { 2647 this.#t.abort() 2648 } 2649 get observes() { 2650 return this._observes = this._observes || $id4(this.getAttribute("observes")) 2651 } 2652} 2653_bundle_product = new WeakSet, 2654bundle_product_fn = function(t) { 2655 const e = t.target; 2656 if ("SELECT" == e.tagName) { 2657 const t = e.options[e.selectedIndex] 2658 , r = this.price 2659 , a = this.comparePrice; 2660 this.price = Number(t.dataset.price), 2661 this.comparePrice = Number(t.dataset.cpprice); 2662 var i = "plus" 2663 , n = this.price - r 2664 , s = this.comparePrice - a; 2665 if ($4("[update-price] hdt-compare-at-price", this).toggleAttribute("hidden", this.comparePrice <= this.price), 2666 $4("[update-price] hdt-compare-at-price .hdt-money", this).innerHTML = formatMoney(this.comparePrice), 2667 $4("[update-price] hdt-price .hdt-money", this).innerHTML = formatMoney(this.price), 2668 $4("[update-qty]", this).value = t.dataset.qty, 2669 $4("[update-img]", this.observes || this).src = t.dataset.img, 2670 document.dispatchEvent(new CustomEvent("currency:update")), 2671 !this.classList.contains("is-checked")) 2672 return 2673 } else if ("INPUT" == e.tagName) {
2674 getterGet(_bundle_items, this).forEach((t=>{ 2675 t.toggleAttribute("disabled", !e.checked) 2676 } 2677 )), 2678 this.classList.toggle("is-checked", e.checked); 2679 i = e.checked ? "plus" : "minus", 2680 n = this.price, 2681 s = this.comparePrice; 2682 this.observes?.classList.toggle("is-checked", e.checked) 2683 } 2684 this.dispatchEvent(new CustomEvent("update:bundle:total",{ 2685 bubbles: !0, 2686 detail: { 2687 remainPrice: n, 2688 remainComparePrice: s, 2689 action: i 2690 } 2691 })) 2692} 2693; 2694class BuyButtons extends HTMLElement { 2695 #t; 2696 constructor() { 2697 super(), 2698 getterAdd(_on_variant_changed, this), 2699 getterAdd(_cart_error, this) 2700 } 2701 get form() { 2702 return document.forms[this.getAttribute("form")] 2703 } 2704 connectedCallback() { 2705 this.#t = new AbortController, 2706 this.form?.addEventListener(variantChange, getterRunFn(_on_variant_changed, this, on_variant_changed_fn).bind(this), { 2707 signal: this.#t.signal 2708 }), 2709 this.form?.addEventListener("cart:add:error", getterRunFn(_cart_error, this, _cart_error_fn).bind(this), { 2710 signal: this.#t.signal 2711 }) 2712 } 2713 disconnectedCallback() { 2714 this.#t.abort() 2715 } 2716} 2717_on_variant_changed = new WeakSet, 2718on_variant_changed_fn = function(t) { 2719 const e = t.detail.variant 2720 , i = $4('button[type="submit"]', this); 2721 i.disabled = !e || !e.available, 2722 i.firstElementChild.textContent = themeHDN.extras[e ? e.variant_state.pre_order ? "preOrder" : e.available ? "addToCart" : "soldOut" : "unavailable"], 2723 this.previousElementSibling.hidden = !0, 2724 $4("hdt-price", this)?.removeAttribute("hidden") 2725} 2726, 2727_cart_error = new WeakSet, 2728_cart_error_fn = function(t) { 2729 t.detail.isGiftCardRecipient || (this.previousElementSibling.hidden = !1, 2730 this.previousElementSibling.lastElementChild.textContent = t.detail.error, 2731 this.form?.addEventListener("variant:add", (()=>this.previousElementSibling.hidden = !0), { 2732 once: !0 2733 })) 2734} 2735; 2736class RecipientForm extends HTMLElement { 2737 #t; 2738 constructor() { 2739 super(), 2740 getterAdd(_on_recipient_form_changed, this), 2741 getterAdd(_cart_error2, this), 2742 getterAdd(_displayErrorMessage, this), 2743 getterAdd(_createErrorListItem, this), 2744 getterAdd(_clearErrorMessage, this), 2745 this.recipientFieldsLiveRegion = $4(`#Recipient-fields-live-region-${this.sectionId}`, this), 2746 this.checkboxInput = $4(`#Recipient-checkbox-${this.sectionId}`, this), 2747 this.checkboxInput.disabled = !1, 2748 this.hiddenControlField = $4(`#Recipient-control-${this.sectionId}`, this), 2749 this.hiddenControlField.disabled = !0, 2750 this.emailInput = $4(`#Recipient-email-${this.sectionId}`, this), 2751 this.nameInput = $4(`#Recipient-name-${this.sectionId}`, this), 2752 this.messageInput = $4(`#Recipient-message-${this.sectionId}`, this), 2753 this.sendonInput = $4(`#Recipient-send-on-${this.sectionId}`, this), 2754 this.offsetProperty = $4(`#Recipient-timezone-offset-${this.sectionId}`), 2755 this.offsetProperty && (this.offsetProperty.value = (new Date).getTimezoneOffset().toString()), 2756 this.errorMessageWrapper = $4(".hdt-form__message-wrapper", this), 2757 this.errorMessageList = this.errorMessageWrapper?.querySelector("ul"), 2758 this.errorMessage = this.errorMessageWrapper?.querySelector(".hdt-error-message"), 2759 this.defaultErrorHeader = this.errorMessage?.innerText 2760 } 2761 connectedCallback() { 2762 this.#t = new AbortController, 2763 this.checkboxInput.addEventListener("change", getterRunFn(_on_recipient_form_changed, this, on_recipient_form_changed_fn).bind(this), { 2764 signal: this.#t.signal 2765 }), 2766 this.form?.addEventListener("cart:add:error", getterRunFn(_cart_error2, this, _cart_error2_fn).bind(this), { 2767 signal: this.#t.signal 2768 }), 2769 this.form?.addEventListener("variant:add", getterRunFn(_clearErrorMessage, this, clearErrorMessage_fn).bind(this), { 2770 signal: this.#t.signal 2771 }) 2772 } 2773 disconnectedCallback() { 2774 this.#t.abort() 2775 } 2776 get form() { 2777 return document.forms[this.getAttribute("form")] 2778 } 2779 get sectionId() { 2780 return this.dataset.sectionId 2781 } 2782 inputFields() { 2783 return [this.emailInput, this.nameInput, this.messageInput, this.sendonInput] 2784 } 2785 disableableFields() { 2786 return [...this.inputFields(), this.offsetProperty] 2787 } 2788 enableInputFields() {
2789 this.disableableFields().forEach((t=>t.disabled = !1)) 2790 } 2791 disableInputFields() { 2792 this.disableableFields().forEach((t=>t.disabled = !0)) 2793 } 2794} 2795_on_recipient_form_changed = new WeakSet, 2796on_recipient_form_changed_fn = function() { 2797 this.checkboxInput.checked ? (this.enableInputFields(), 2798 this.recipientFieldsLiveRegion.innerText = this.recipientFieldsLiveRegion.dataset.expanded) : (this.disableInputFields(), 2799 this.recipientFieldsLiveRegion.innerText = this.recipientFieldsLiveRegion.dataset.collapsed) 2800} 2801, 2802_cart_error2 = new WeakSet, 2803_cart_error2_fn = function(t) { 2804 t.detail.isGiftCardRecipient && (console.log(t.detail), 2805 getterRunFn(_displayErrorMessage, this, displayErrorMessage_fn).call(this, t.detail.error)) 2806} 2807, 2808_displayErrorMessage = new WeakSet, 2809displayErrorMessage_fn = function(t) { 2810 if (getterRunFn(_clearErrorMessage, this, clearErrorMessage_fn).call(this), 2811 this.errorMessageWrapper.hidden = !1, 2812 "object" == typeof t) 2813 return this.errorMessage.innerText = this.defaultErrorHeader, 2814 Object.entries(t).forEach((([t,e])=>{ 2815 const i = `RecipientForm-${t}-error-${this.sectionId}` 2816 , n = `#Recipient-${t}-${this.sectionId}` 2817 , s = `${e.join(", ")}` 2818 , r = this.querySelector(`#${i}`) 2819 , a = r?.querySelector(".hdt-error-message"); 2820 if (!a) 2821 return; 2822 this.errorMessageList && this.errorMessageList.appendChild(getterRunFn(_createErrorListItem, this, createErrorListItem_fn).call(this, n, s)), 2823 a.innerText = `${s}.`, 2824 r.removeAttribute("hidden"); 2825 const o = this[`${t}Input`]; 2826 o && (o.setAttribute("aria-invalid", !0), 2827 o.setAttribute("aria-describedby", i)) 2828 } 2829 )); 2830 this.errorMessage.innerText = t 2831} 2832, 2833_createErrorListItem = new WeakSet, 2834createErrorListItem_fn = function(t, e) { 2835 const i = document.createElement("li") 2836 , n = document.createElement("a"); 2837 return n.setAttribute("href", t), 2838 n.innerText = e, 2839 i.appendChild(n), 2840 i.className = "hdt-error-message", 2841 i 2842} 2843, 2844_clearErrorMessage = new WeakSet, 2845clearErrorMessage_fn = function() { 2846 this.errorMessageWrapper.hidden = !0, 2847 this.errorMessageList && (this.errorMessageList.innerHTML = ""), 2848 this.querySelectorAll(".hdt-recipient-fields .hdt-form__message").forEach((t=>{ 2849 t.setAttribute("hidden", ""); 2850 const e = t.querySelector(".hdt-error-message"); 2851 e && (e.innerText = "") 2852 } 2853 )), 2854 [this.emailInput, this.messageInput, this.nameInput, this.sendonInput].forEach((t=>{ 2855 t.setAttribute("aria-invalid", !1), 2856 t.removeAttribute("aria-describedby") 2857 } 2858 )) 2859} 2860, 2861customElements.define("hdt-product-form", ProductForm, { 2862 extends: "form" 2863}), 2864customElements.define("hdt-product-form-bundle", ProductFormBundle, { 2865 extends: "form" 2866}), 2867customElements.define("hdt-bundle-product", bundleProduct), 2868customElements.define("hdt-buy-buttons", BuyButtons), 2869customElements.define("hdt-recipient-form", RecipientForm); 2870class VariantPicker extends HTMLElement { 2871 #t; 2872 constructor() { 2873 super(), 2874 getterAdd(_on_value_change, this), 2875 getterAdd(_find_closest_variant, this), 2876 getterAdd(_update_variant_statuses, this), 2877 getterAdd(_update_url, this); 2878 var t = JSON.parse($4("[data-variants-json]", this).textContent); 2879 const e = (new DOMParser).parseFromString(this.nextElementSibling.textContent, "text/html"); 2880 e && $$4("select > option", e).forEach(((e,i)=>{ 2881 const n = e.dataset; 2882 let s = t[i]; 2883 s = Object.assign(s, { 2884 incoming: "true" === n.incoming, 2885 next_incoming_date: n.nextincomingdate || null, 2886 next_incoming_date_format: n.nextincomingdateformat || null, 2887 inventory_policy: n.inventorypolicy || null, 2888 inventory_quantity: parseInt(n.inventoryquantity), 2889 mdid: n.mdid || null 2890 }), 2891 s.variant_state = { 2892 sold_out: !s.available, 2893 on_sale: s.compare_at_price > s.price, 2894 pre_order: "shopify" == s.inventory_management && s.inventory_quantity <= 0 && s.available 2895 }, 2896 s.quantity_rule || (s.quantity_rule = { 2897 min: 1, 2898 max: null, 2899 increment: 1 2900 }) 2901 } 2902 )), 2903 this.hideSoldOutVariants ? getterAdd(_variants_data, this, t.filter((t=>t.available))) : getterAdd(_variants_data, this, t), 2904 t = null 2905 } 2906 connectedCallback() { 2907 this.#t = new AbortController, 2908 this.masterInput = document.forms[this.getAttribute("form")].id, 2909 getterRunFn(_update_url, this, update_url_fn).call(this, !0), 2910 this.masterInput && (this.masterInput.disabled = !1, 2911 getterAdd(_master_input_change, this), 2912 this.addEventListener("change", getterRunFn(_on_value_change, this, on_value_change_fn).bind(this), { 2913 signal: this.#t.signal 2914 }), 2915 this.masterInput.addEventListener("change", getterRunFn(_master_input_change, this, master_input_change_fn).bind(this), { 2916 signal: this.#t.signal 2917 }),
2918 $$4('fieldset[type^="dropdown"]', this).forEach((t=>{ 2919 $4("hdt-popover", t).addEventListener("richlist:change", (e=>{ 2920 const i = $4(`input[type="hidden"][name="option${parseInt(t.dataset.index) + 1}"]`, t); 2921 i.value != e.detail.value && (i.value = e.detail.value, 2922 i.dispatchEvent(new Event("change",{ 2923 bubbles: !0 2924 }))) 2925 } 2926 ), { 2927 signal: this.#t.signal 2928 }) 2929 } 2930 ))) 2931 } 2932 disconnectedCallback() { 2933 this.#t.abort() 2934 } 2935 get hideSoldOutVariants() { 2936 return this.hasAttribute("hide-sold-out-variants") 2937 } 2938 get updateUrl() { 2939 return this.getAttribute("update-url") 2940 } 2941 get updateStatus() { 2942 return this.hasAttribute("update-status") 2943 } 2944 get productMedia() { 2945 return this._productMedia = this._productMedia || $4(`hdt-product-media[form="${this.getAttribute("form")}"]`) 2946 } 2947 getvariantObjById(t) { 2948 return getterGet(_variants_data, this).find((e=>e.id == t)) 2949 } 2950 updateOptions() { 2951 const t = $$4("fieldset", this); 2952 this.options = t.map((t=>$$4("input", t).find((t=>t.checked || "hidden" == t.type))?.value)).filter((function(t) { 2953 return void 0 !== t && "" !== t 2954 } 2955 )) 2956 } 2957 updateMasterId() { 2958 this.currentVariant = getterGet(_variants_data, this).find((t=>!t.options.map(((t,e)=>this.options[e] === t)).includes(!1))) 2959 } 2960 selectVariantByID(t, e=!0) { 2961 this.hasAttribute("no-pick") || this.selectVariantByVariantObj(this.getvariantObjById(t), e) 2962 } 2963 selectVariantByVariantObj(t, e=!0) { 2964 "object" == typeof t && getterGet(_variants_data, this).includes(t) && (this.options = t.options, 2965 this.currentVariant = t, 2966 this.selectVariant(!1, e)) 2967 } 2968 selectVariant(t=!1, e=!0) { 2969 this.oldVariant && this.oldVariant.id === this.currentVariant.id || (this.oldVariant = this.currentVariant, 2970 this.masterInput.value = this.currentVariant.id, 2971 this.masterInput.dispatchEvent(new CustomEvent("change",{ 2972 bubbles: !0, 2973 detail: { 2974 hasVariant: !0, 2975 untriggerChangeEvent: t 2976 } 2977 })), 2978 getterRunFn(_update_variant_statuses, this, update_variant_statuses_fn).call(this), 2979 getterRunFn(_update_url, this, update_url_fn).call(this), 2980 this.masterInput.form.dispatchEvent(new CustomEvent(variantChange,{ 2981 bubbles: !0, 2982 detail: { 2983 variant: this.currentVariant, 2984 jumpMedia: e 2985 } 2986 }))) 2987 } 2988} 2989function onlyUnique(t, e, i) { 2990 return i.indexOf(t) === e 2991} 2992_variants_data = new WeakMap, 2993_on_value_change = new WeakSet, 2994on_value_change_fn = function(t) { 2995 if (!t.target.hasAttribute("is-value")) 2996 return; 2997 const e = t.target.closest("fieldset"); 2998 if (this.clickedCurrentIndex = parseInt(e.dataset.index), 2999 this.clickedCurrentValue = t.target.value, 3000 this.updateOptions(), 3001 this.options.length < parseInt(this.dataset.size)) { 3002 $4("[update-value]", e).textContent = this.clickedCurrentValue; 3003 const t = ["nanthan94", "nanthan94", "nanthan94"]; 3004 return t[this.clickedCurrentIndex] = this.clickedCurrentValue, 3005 void this.productMedia?.dispatchEvent(new CustomEvent("update:value",{ 3006 detail: { 3007 options: t 3008 } 3009 })) 3010 } 3011 this.removeAttribute("no-pick"), 3012 this.updateMasterId(), 3013 this.currentVariant || getterRunFn(_find_closest_variant, this, find_closest_variant_fn).call(this), 3014 this.selectVariant(!0) 3015} 3016, 3017_master_input_change = new WeakSet, 3018master_input_change_fn = function(t) { 3019 t.detail && t.detail.hasVariant || (this.currentVariant = this.getvariantObjById(t.target.value)), 3020 this.currentVariant && $$4("fieldset[data-index]", this).forEach(((e,i)=>{ 3021 let n = this.currentVariant.options[i] 3022 , s = e.getAttribute("type") 3023 , r = $4("[update-value]", e) 3024 , a = $4(`input[type="radio"][value="${CSS.escape(n)}"], input[type="hidden"][name="option${i + 1}"]`, e) 3025 , o = !1; 3026 if (s.startsWith("dropdown")) { 3027 o = a.value !== n, 3028 a.value = n; 3029 const t = $4("hdt-richlist", e); 3030 t && (t.selected = n) 3031 } else 3032 o = !a.checked && a.value === n, 3033 a.checked = !0; 3034 t.detail && t.detail.untriggerChangeEvent && (o = !1), 3035 r && (r.textContent = n), 3036 o && a.dispatchEvent(new CustomEvent("change",{ 3037 bubbles: !0 3038 })) 3039 } 3040 )) 3041} 3042, 3043_find_closest_variant = new WeakSet, 3044find_closest_variant_fn = function() { 3045 let t, e = parseInt(this.dataset.size), i = !this.hideSoldOutVariants; 3046 t = 1 == e ? getterGet(_variants_data, this).filter((t=>t.available)) : 3 == e ? getterGet(_variants_data, this).filter((t=>t.option1 == this.options[0] && t.option2 == this.options[1] && (i || t.available))) : getterGet(_variants_data, this).filter((t=>t.option1 == this.options[0] && (i || t.available))), 3047 t[0] || (t = getterGet(_variants_data, this).filter((t=>t.options[this.clickedCurrentIndex] == this.clickedCurrentValue && (i || t.available)))), 3048 this.currentVariant = t[0] 3049} 3050, 3051_update_variant_statuses = new WeakSet, 3052update_variant_statuses_fn = function() { 3053 if (!this.updateStatus) 3054 return; 3055 const t = getterGet(_variants_data, this).filter((t=>t.option1 == this.currentVariant.option1)) 3056 , e = getterGet(_variants_data, this).filter((t=>t.option1 == this.currentVariant.option1 && t.option2 == this.currentVariant.option2)) 3057 , i = getterGet(_variants_data, this).map((t=>t.option1)).filter(onlyUnique) 3058 , n = t.map((t=>t.option2)).filter(onlyUnique) 3059 , s = e.map((t=>t.option3)).filter(onlyUnique) 3060 , r = getterGet(_variants_data, this).filter((t=>t.available)).map((t=>t.option1)).filter(onlyUnique) 3061 , a = t.filter((t=>t.available)).map((t=>t.option2)).filter(onlyUnique) 3062 , o = e.filter((t=>t.available)).map((t=>t.option3)).filter(onlyUnique);
3063 $$4("fieldset[data-index]", this).forEach(((t,e)=>{ 3064 let l = ++e; 3065 $$4('[type="radio"], hdt-richlist > button', t).forEach((t=>{ 3066 let e = !0 3067 , d = !0; 3068 switch (l) { 3069 case 1: 3070 i.includes(t.value) && (e = !1), 3071 r.includes(t.value) && (d = !1); 3072 break; 3073 case 2: 3074 n.includes(t.value) && (e = !1), 3075 a.includes(t.value) && (d = !1); 3076 break; 3077 default: 3078 s.includes(t.value) && (e = !1), 3079 o.includes(t.value) && (d = !1) 3080 } 3081 t.classList.toggle("is-disabled", d), 3082 t.classList.toggle("is-unavailable", e) 3083 } 3084 )) 3085 } 3086 )) 3087} 3088, 3089_update_url = new WeakSet, 3090update_url_fn = function(t) { 3091 if (!this.updateUrl || !history.replaceState) 3092 return; 3093 const e = new URL(window.location.href) 3094 , i = t ? this.updateUrl : this.currentVariant.id; 3095 i ? e.searchParams.set("variant", i) : e.searchParams.delete("variant"), 3096 window.history.replaceState({ 3097 path: e.toString() 3098 }, "", e.toString()) 3099} 3100; 3101class VariantChangeBase extends HTMLElement { 3102 constructor() { 3103 super(), 3104 this._onVariantChanged = this.onVariantChanged.bind(this) 3105 } 3106 get form() { 3107 return this._form = this._form || document.forms[this.getAttribute("form")] 3108 } 3109 connectedCallback() { 3110 this.form?.addEventListener(variantChange, this._onVariantChanged) 3111 } 3112 disconnectedCallback() { 3113 this.form?.removeEventListener(variantChange, this._onVariantChanged) 3114 } 3115 onVariantChanged() {} 3116} 3117class Price extends VariantChangeBase { 3118 get price() { 3119 return this._price = this._price || $4(".hdt-money", this) 3120 } 3121 onVariantChanged(t) { 3122 const e = t.detail.variant; 3123 this.price.textContent = formatMoney(e.price, currencyFormat), 3124 this.classList.toggle("hdt-price-on-sale", e.variant_state.on_sale), 3125 document.dispatchEvent(new CustomEvent("currency:update")) 3126 } 3127} 3128class CompareAtPrice extends Price { 3129 onVariantChanged(t) { 3130 const e = t.detail.variant; 3131 this.hidden = !(e.compare_at_price > e.price), 3132 this.hidden || (this.price.textContent = formatMoney(e.compare_at_price, currencyFormat), 3133 document.dispatchEvent(new CustomEvent("currency:update"))) 3134 } 3135} 3136class UnitPrice extends Price { 3137 onVariantChanged(t) { 3138 const e = t.detail.variant; 3139 this.hidden = !e.unit_price, 3140 this.hidden || (this.price.textContent = formatMoney(e.unit_price, currencyFormat), 3141 document.dispatchEvent(new CustomEvent("currency:update"))) 3142 } 3143} 3144class Badge extends VariantChangeBase { 3145 constructor() { 3146 super(), 3147 this.updateHiddenParent(), 3148 this.parentElement && this.parentElement.classList.add("js-intent") 3149 } 3150 get is() { 3151 return this.getAttribute("is") 3152 } 3153 get type() { 3154 return this.getAttribute("type") 3155 } 3156 updateHiddenParent() { 3157 this.parentElement && this.hasAttribute("update-hidden") && (this.parentElement.removeAttribute("hidden"), 3158 this.parentElement.hidden = !this.parentElement.clientHeight) 3159 } 3160 onVariantChanged(t) { 3161 const e = t.detail.variant; 3162 this.hidden = "available" != this.is ? !e.variant_state[this.is] : !e.available, 3163 this.updateHiddenParent(); 3164 const i = $4("[percent]", this); 3165 if (!this.hidden && "percentage" === this.type && i) { 3166 const t = 100 * (e.compare_at_price - e.price) / e.compare_at_price; 3167 t != i.textContent && (i.textContent = Math.max(1, Math.round(t))) 3168 } 3169 } 3170} 3171var _update_inventory_status, update_inventory_status_fn, _pickup_availability, pickup_availability_fn, _create_img2, create_img2_fn, _show_quantity_inventory = new WeakMap, _threshold_inventory = new WeakMap, _progressBar_inventory = new WeakMap; 3172class VariantInventory extends VariantChangeBase { 3173 constructor() { 3174 super(), 3175 getterAdd(_update_inventory_status, this), 3176 getterAdd(_show_quantity_inventory, this, this.hasAttribute("show-inventory-quantity")), 3177 getterAdd(_threshold_inventory, this, parseInt(this.getAttribute("inventory-threshold"))), 3178 getterAdd(_progressBar_inventory, this, $4(".hdt-progress-bar", this)) 3179 } 3180 get progressBar() { 3181 return getterGet(_progressBar_inventory, this) 3182 } 3183 onVariantChanged(t) { 3184 getterRunFn(_update_inventory_status, this, update_inventory_status_fn).c
3184all(this, t.detail.variant) 3185 } 3186} 3187_update_inventory_status = new WeakSet, 3188update_inventory_status_fn = function(t) { 3189 let e = ""; 3190 e = t.available ? t.inventory_quantity > 0 ? t.inventory_quantity <= getterGet(_threshold_inventory, this) && "deny" == t.inventory_policy && t.requires_shipping ? getterGet(_show_quantity_inventory, this) ? "low-stock-count" : "low-stock" : getterGet(_show_quantity_inventory, this) ? "in-stock-count" : "in-stock" : t.next_incoming_date && t.requires_shipping ? "not-ship-stock" : "shopify" == t.inventory_management ? "pre-order-stock" : "in-stock" : t.incoming && t.next_incoming_date ? "will-in-stock" : "out-of-stock", 3191 "not-ship-stock" != e && "will-in-stock" != e || $$4("[data-incoming-date]", this).forEach((e=>e.textContent = t.next_incoming_date_format)), 3192 "low-stock" == e || "in-stock" == e || "low-stock-count" == e || "in-stock-count" == e ? ($$4("[data-quantity]", this).forEach((e=>e.textContent = t.inventory_quantity)), 3193 this.progressBar && (this.progressBar.hidden = !1, 3194 this.progressBar.valueNow = t.inventory_quantity > 0 ? t.inventory_quantity : this.progressBar.getAttribute("aria-valuemax"))) : this.progressBar && (this.progressBar.hidden = !0), 3195 $4(".hdt-stock-status:not([hidden])", this).hidden = !0, 3196 $4(`.hdt-stock-status[${e}]`, this).hidden = !1 3197} 3198; 3199class VariantLive extends VariantChangeBase { 3200 get is() { 3201 return this.getAttribute("is") 3202 } 3203 onVariantChanged(t) { 3204 const e = t.detail.variant; 3205 if (this.hidden = !e || "" === e[this.is], 3206 !this.hidden) { 3207 const value = e[this.is]; 3208 if (value != null && value !== undefined) { 3209 ($4("[update-value]", this) || this).innerText = value; 3210 } 3211 } 3212 } 3213} 3214class PickupAvailability extends VariantChangeBase { 3215 constructor() { 3216 super(), 3217 getterAdd(_pickup_availability, this) 3218 } 3219 onVariantChanged(t) { 3220 getterRunFn(_pickup_availability, this, pickup_availability_fn).call(this, t.detail.variant) 3221 } 3222} 3223_pickup_availability = new WeakSet, 3224pickup_availability_fn = async function(t) { 3225 if (t) { 3226 const e = document.createElement("div"); 3227 this.setAttribute("loading", ""), 3228 e.innerHTML = await (await fetch(`${Shopify.routes.root}variants/${t.id}?section_id=pickup-availability`)).text(), 3229 this.replaceChildren(...e.querySelector("hdt-pickup-availability").childNodes), 3230 this.removeAttribute("loading", "") 3231 } else 3232 this.innerHTML = "" 3233} 3234; 3235class VariantPreviewImg extends VariantChangeBase { 3236 constructor() { 3237 super(), 3238 getterAdd(_create_img2, this) 3239 } 3240 onVariantChanged(t) { 3241 const e = t.detail.variant 3242 , i = $4("img", this); 3243 e && e.featured_image && i && i.replaceWith(getterRunFn(_create_img2, this, create_img2_fn).call(this, e.featured_image, i)) 3244 } 3245} 3246_create_img2 = new WeakSet, 3247create_img2_fn = function(t, e) { 3248 return createImg(Object.assign(t, { 3249 onload: !0, 3250 attrs: { 3251 class: e.className, 3252 sizes: e.sizes, 3253 "data-widths": e.getAttribute("data-widths") || "[]" 3254 } 3255 })) 3256} 3257; 3258class PaymentTerms extends VariantChangeBase { 3259 onVariantChanged(t) { 3260 if (t.detail.variant) { 3261 const e = $4('[name="id"]', this); 3262 e.value = t.detail.variant.id, 3263 e.dispatchEvent(new Event("change",{ 3264 bubbles: !0 3265 })) 3266 } 3267 } 3268} 3269class BackInStock extends VariantChangeBase { 3270 connectedCallback() { 3271 this.hasAttribute("is-pr-default") || (this.select = $4("[back-instock-select]", this), 3272 this.originalText = $4("[back-instock-text]", this).textContent, 3273 this.elReplace = $4('[name="contact[product]"]', this), 3274 this.select.addEventListener("change", (t=>{ 3275 this.elReplace.textContent = this.originalText.replace("nt94_name", this.select.selectedOptions[0].textContent).replace("nt94_vid", this.select.value) 3276 } 3277 )), 3278 super.connectedCallback()) 3279 } 3280 onVariantChanged(t) { 3281 const e = t.detail.variant; 3282 this.hasAttribute("toogle-hidden") && (this.hidden = e && e.available), 3283 e && !e.available && this.select.value != e.id && (this.select.value = e.id, 3284 this.select.dispatchEvent(new Event("change",{ 3285 bubbles: !1 3286 }))) 3287 } 3288} 3289var _form_atc_visible, form_atc_visible_fn, _copy_to_clipboard, copy_to_clipboard_fn, _native_share, native_share_fn, _variant_toogle, variant_toogle_fn, _onLoadingStart, onLoadingStart_fn, _onLoadingEnd, onLoadingEnd_fn, _load_more_url, load_more_url_fn, _lm_render, lm_render_fn, _sticky_select = new WeakMap, _formElement = new WeakMap, _intersection_observer = new WeakMap, _latestFormCondition = new WeakMap, stickyRunOne = !0; 3290class StickyATC extends VariantChangeBase { 3291 #e; 3292 constructor() { 3293 super(...arguments), 3294 getterAdd(_form_atc_visible, this), 3295 getterAdd(_latestFormCondition, this, !1), 3296 getterAdd(_intersection_observer, this, new IntersectionObserver(getterRunFn(_form_atc_visible, this, form_atc_visible_fn).bind(this))) 3297 } 3298 connectedCallback() { 3299 getterAdd(_formElement, this, document.forms[this.getAttribute("form")]), 3300 getterGet(_formElement, this) && getterGet(_intersection_observer, this).observe(getterGet(_formElement, this)), 3301 this.hasAttribute("is-pr-default") || (getterAdd(_sticky_select, this, $4("[tag-select]", this)), 3302 this.#e = getterGet(_sticky_select, this).value, 3303 super.connectedCallback(), 3304 getterGet(_sticky_select, this).addEventListener("change", (t=>{ 3305 this.variantPicker?.selectVariantByID(t.target.value, $4(".hdt-product-media__main hdt-slider")?.isActive) 3306 } 3307 ))) 3308 } 3309 get variantPicker() { 3310 return this._variantPicker = this._variantPicker || $4(`hdt-variant-picker[form="${this.getAttribute("form")}"]`) 3311 } 3312 onVariantChanged(t) { 3313 const e = t.detail.variant; 3314 if (e && this.#e != e.id) { 3315 getterGet(_sticky_select, this).value = e.id, 3316 this.#e = getterGet(_sticky_select, this).value; 3317 const t = $4("[data-v-img]", this) 3318 , i = e.featured_image; 3319 if (t && i) { 3320 const e = createImg({ 3321 src: i.src, 3322 width: t.getAttribute("width"), 3323 height: t.getAttribute("height"), 3324 alt: t.alt, 3325 onload: !0, 3326 attrs: { 3327 class: t.className, 3328 sizes: t.sizes, 3329 "data-widths": t.getAttribute("data-widths") || "[]", 3330 "data-v-img": "" 3331 } 3332 }); 3333 t.replaceWith(e) 3334 } 3335 $4('form[is="hdt-product-form"]', this).dispatchEvent(new CustomEvent(variantChange,{ 3336 bubbles: !1, 3337 detail: { 3338 variant: e, 3339 jumpMedia: !1 3340 } 3341 })), 3342 $4('[name="add"]', this).disabled = !e || !e.available, 3343 $4('[name="add"]', this).firstElementChild.textContent = themeHDN.extras[e ? e.variant_state.pre_order ? "preOrder" : e.available ? "addToCart" : "soldOut" : "unavailable"] 3344 } 3345 } 3346} 3347_form_atc_visible = new WeakSet, 3348form_atc_visible_fn = function(t) { 3349 if (this.variantPicker?.hasAttribute("no-pick")) 3350 return stickyRunOne = !1, 3351 void document.body.style.setProperty("--sticky-atc-height", "0px"); 3352 document.body.style.removeProperty("--sticky-atc-height"); 3353 const e = t.find((t=>t.target === getterGet(_formElement, this))); 3354 e && getterAdd(_latestFormCondition, this, !e.isIntersecting && e.boundingClientRect.bottom < 0, !0), 3355 document.body.classList.toggle("sticky-shown", getterGet(_latestFormCondition, this)), 3356 stickyRunOne && !getterGet(_latestFormCondition, this) && setTimeout((()=>{ 3357 getterAdd(_latestFormCondition, this, window.innerHeight + Math.round(window.scrollY) >= document.body.offsetHeight, !0), 3358 document.body.classList.toggle("sticky-shown", getterGet(_latestFormCondition, this)), 3359 stickyRunOne = !1 3360 } 3361 ), 100) 3362} 3363; 3364class CopyButton extends HTMLButtonElement { 3365 constructor() { 3366 super(), 3367 getterAdd(_copy_to_clipboard, this), 3368 this.addEventListener("click", getterRunFn(_copy_to_clipboard, this, copy_to_clipboard_fn).bind(this, this.input)), 3369 this.actionCopy = this.input ? "value" : "textContent", 3370 this.input && this.hasAttribute("get-document") && this.closest("hdt-popover")?.addEventListener("dialog:beforeOpen", (t=>{ 3371 this.input[this.actionCopy] = this.textCopy 3372 } 3373 )) 3374 } 3375 get input() { 3376 return $id4(this.getAttribute("text-id")) 3377 } 3378 get textCopy() { 3379 return this.hasAttribute("get-document") ? document.location.href : this.getAttribute("data-text") || "" 3380 } 3381} 3382_copy_to_clipboard = new WeakSet, 3383copy_to_clipboard_fn = async function(t) { 3384 if (navigator.clipboard && (await navigator.clipboard.writeText(this.textCopy), 3385 this.hasAttribute("data-success-message"))) { 3386 const e = (t = t || this)[this.actionCopy]; 3387 t[this.actionCopy] = this.getAttribute("data-success-message"), 3388 setTimeout((()=>{ 3389 t[this.actionCopy] = e 3390 } 3391 ), 1500) 3392 } 3393} 3394; 3395class ShareButton extends HTMLButtonElement { 3396 constructor() { 3397 super(), 3398 getterAdd(_native_share, this), 3399 navigator.share && (this.hidden = !1, 3400 this.addEventListener("click", getterRunFn(_native_share, this, native_share_fn))) 3401 } 3402} 3403_native_share = new WeakSet, 3404native_share_fn = function() { 3405 navigator.share({ 3406 title: this.getAttribute("share-title") || document.title, 3407 url: this.getAttribute("share-link") || document.location.href 3408 }) 3409} 3410; 3411class VaraintToogle extends HTMLElement { 3412 constructor() { 3413 super(), 3414 getterAdd(_variant_toogle, this) 3415 } 3416 connectedCallback() { 3417 this.firstElementChild && document.addEventListener(variantChange, getterRunFn(_variant_toogle, this, variant_toogle_fn).bind(this)) 3418 } 3419} 3420_variant_toogle = new WeakSet, 3421variant_toogle_fn = function(t) { 3422 const e = t.detail.variant;
3423 $$4("[variant-id]:not([hidden])", this).forEach((t=>t.hidden = !0)), 3424 e && e.id && $4(`[variant-id="${e.id}"]`, this)?.removeAttribute("hidden") 3425} 3426, 3427customElements.define("hdt-variant-picker", VariantPicker), 3428customElements.define("hdt-price", Price), 3429customElements.define("hdt-compare-at-price", CompareAtPrice), 3430customElements.define("hdt-unit-price", UnitPrice), 3431customElements.define("hdt-badge", Badge), 3432customElements.define("hdt-variant-inventory", VariantInventory), 3433customElements.define("hdt-variant-live", VariantLive), 3434customElements.define("hdt-pickup-availability", PickupAvailability), 3435customElements.define("hdt-variant-preview-img", VariantPreviewImg), 3436customElements.define("hdt-payment-terms", PaymentTerms), 3437customElements.define("hdt-back-instock", BackInStock), 3438customElements.define("hdt-sticky-btn-atc", StickyATC), 3439customElements.define("hdt-copy-button", CopyButton, { 3440 extends: "button" 3441}), 3442customElements.define("hdt-share-button", ShareButton, { 3443 extends: "button" 3444}), 3445customElements.define("hdt-varaint-toogle-info", VaraintToogle); 3446class LoadingBar extends HTMLElement { 3447 constructor() { 3448 super(), 3449 getterAdd(_onLoadingStart, this), 3450 getterAdd(_onLoadingEnd, this), 3451 document.addEventListener("theme:loading:doing", getterRunFn(_onLoadingStart, this, onLoadingStart_fn).bind(this)), 3452 document.addEventListener("theme:loading:done", getterRunFn(_onLoadingEnd, this, onLoadingEnd_fn).bind(this)) 3453 } 3454} 3455_onLoadingStart = new WeakSet, 3456onLoadingStart_fn = function() { 3457 animate(this, { 3458 opacity: [0, 1], 3459 transform: ["scaleX(0)", "scaleX(0.8)"] 3460 }, { 3461 duration: .5 3462 }) 3463} 3464, 3465_onLoadingEnd = new WeakSet, 3466onLoadingEnd_fn = async function() { 3467 await animate(this, { 3468 transform: [null, "scaleX(1)"] 3469 }, { 3470 duration: .25 3471 }).finished, 3472 animate(this, { 3473 opacity: 0 3474 }, { 3475 duration: .25 3476 }) 3477} 3478, 3479customElements.define("hdt-loading-bar", LoadingBar); 3480class RevealItems extends HTMLElement { 3481 constructor() { 3482 super() 3483 } 3484 connectedCallback() { 3485 _matchMedia("motion") && this.enabledReveal && $$4(this.selector, this).length > 0 && inView(this, this.reveal.bind(this)) 3486 } 3487 get selector() { 3488 const t = this.getAttribute("selector") || ".hdt-card-product"; 3489 return (this.prependEl || "") + t + (this.appendEl || "").replaceAll(/nathan/g, t) 3490 } 3491 get enabledReveal() { 3492 return "true" === this.getAttribute("reveal-on-scroll") 3493 } 3494 reveal() { 3495 animate($$4(this.selector, this), { 3496 opacity: [0, 1], 3497 transform: ["translateY(30px)", "translateY(0)"] 3498 }, { 3499 duration: .25, 3500 easing: "ease", 3501 delay: stagger(.05, { 3502 start: .3, 3503 easing: "ease" 3504 }) 3505 }) 3506 } 3507} 3508customElements.define("hdt-reval-items", RevealItems); 3509const str_shopify_section = "shopify-section"; 3510class LoadMore extends HTMLAnchorElement { 3511 #t; 3512 constructor() { 3513 super(), 3514 getterAdd(_load_more_url, this), 3515 getterAdd(_lm_render, this) 3516 } 3517 connectedCallback() { 3518 this.#t = new AbortController, 3519 this.abortController2 = null, 3520 this.addEventListener("click", getterRunFn(_load_more_url, this, load_more_url_fn).bind(this), { 3521 signal: this.#t.signal 3522 }) 3523 } 3524 disconnectedCallback() { 3525 this.#t.abort() 3526 } 3527 get idcontrol() { 3528 return "#" + this.getAttribute("append") 3529 } 3530} 3531_load_more_url = new WeakSet, 3532load_more_url_fn = function(t) { 3533 t.preventDefault(); 3534 const e = new URL(this.href); 3535 e.searchParams.set("section_id", this.getAttribute("section-id")), 3536 getterRunFn(_lm_render, this, lm_render_fn).call(this, { 3537 detail: { 3538 url: e, 3539 id: this.idcontrol 3540 } 3541 }) 3542} 3543, 3544_lm_render = new WeakSet, 3545lm_render_fn = async function(t) { 3546 this.abortController2 && this.abortController2.abort(), 3547 this.abortController2 = new AbortController; 3548 const e = t.detail.url 3549 , i = e.searchParams.get("section_id") 3550 , n = e.searchParams.get("page") 3551 , s = document.getElementById(`shopify-section-${i}`); 3552 new URL(e).searchParams.delete("section_id"); 3553 const r = $4(t.detail.id, s) 3554 , a = $4("[loadmore-btn-wrapp]", s); 3555 try { 3556 a.setAttribute("loading", ""); 3557 const i = (new DOMParser).parseFromString(await (await fetch(e.toString(), { 3558 signal: this.abortController2.signal 3559 }).then((t=>t))).text(), "text/html") 3560 , s = $4(`.shopify-section ${t.detail.id}`, i); 3561 r.lastElementChild.classList.add(`point-effect-${n}`), 3562 r.append(...document.importNode(s, !0).childNodes), 3563 _matchMedia("motion") && (r.prependEl = `.point-effect-${n} ~ `, 3564 r.reveal()); 3565 const o = $4("[loadmore-btn-wrapp]", i); 3566 o ? (a.replaceChildren(...document.importNode(o, !0).childNodes), 3567 a.removeAttribute("loading")) : a.remove() 3568 } catch (t) {} 3569} 3570, 3571customElements.define("hdt-lm-url", LoadMore, { 3572 extends: "a" 3573});
3574var _qty_forms, _qty_inputs, _on_variant_changed2, on_variant_changed2_fn, _on_cart_changed2, on_cart_changed2_fn, _update_quantity_rules, update_quantity_rules_fn, _set_quantity_boundries, set_quantity_boundries_fn, _block_required_froms, _block_required_detect, _block_required_on_change, block_required_on_change_fn, _block_required_on_submit, block_required_on_submit_fn, _is_cart_dirty, _cart_on_change, cart_on_change_fn, _remove_item_on_cart, remove_item_on_cart_fn, _remove_forms, _cart_note_on_change, cart_note_on_change_fn, ON_CHANGE_DEBOUNCE_TIMER = 300; 3575class QuantityWrapp extends HTMLElement { 3576 #t; 3577 constructor() { 3578 super(...arguments), 3579 getterAdd(_qty_inputs, this, $4("input", this)), 3580 getterAdd(_on_variant_changed2, this), 3581 getterAdd(_on_cart_changed2, this), 3582 getterAdd(_update_quantity_rules, this), 3583 getterAdd(_set_quantity_boundries, this) 3584 } 3585 get input() { 3586 return getterGet(_qty_inputs, this) 3587 } 3588 get quantityForm() { 3589 return $id4(`Quantity-Form-${this.getAttribute("section-id")}`) 3590 } 3591 connectedCallback() { 3592 this.input && (this.#t = new AbortController, 3593 getterAdd(_qty_forms, this, document.forms[this.getAttribute("form") || this.input.getAttribute("form")]), 3594 this.input.addEventListener("change", this.onInputChange.bind(this), { 3595 signal: this.#t.signal 3596 }), 3597 $$4("button", this).forEach((t=>t.addEventListener("click", this.onButtonClick.bind(this), { 3598 signal: this.#t.signal 3599 }))), 3600 this.buttonMinus = $4(".hdt-quantity__button[name='minus']", this), 3601 this.buttonPlus = $4(".hdt-quantity__button[name='plus']", this), 3602 this.validateQtyRules(), 3603 this.quantityForm && (getterRunFn(_set_quantity_boundries, this, set_quantity_boundries_fn).call(this), 3604 getterGet(_qty_forms, this)?.addEventListener(variantChange, getterRunFn(_on_variant_changed2, this, on_variant_changed2_fn).bind(this), { 3605 signal: this.#t.signal 3606 }), 3607 document.addEventListener("cart:change", getterRunFn(_on_cart_changed2, this, on_cart_changed2_fn).bind(this), { 3608 signal: this.#t.signal 3609 })), 3610 this.debouncedOnChange = debounce((()=>{ 3611 this.input.dispatchEvent(new CustomEvent("change",{ 3612 bubbles: !0, 3613 detail: { 3614 target: this.input 3615 } 3616 })) 3617 } 3618 ), ON_CHANGE_DEBOUNCE_TIMER)) 3619 } 3620 disconnectedCallback() { 3621 this.#t.abort() 3622 } 3623 onInputChange() { 3624 this.validateQtyRules() 3625 } 3626 onButtonClick(t) { 3627 t.preventDefault(); 3628 const e = this.input.value; 3629 "plus" === t.target.name ? this.input.stepUp() : this.input.stepDown(), 3630 e !== this.input.value && this.debouncedOnChange() 3631 } 3632 validateQtyRules() { 3633 const t = parseInt(this.input.value); 3634 this.hasAttribute("form") && getterGet(_qty_forms, this)?.dispatchEvent(new CustomEvent("change",{ 3635 bubbles: !0, 3636 detail: { 3637 target: this.input 3638 } 3639 })), 3640 this.input.min && this.buttonMinus.classList.toggle("disabled", t <= parseInt(this.input.min)), 3641 this.input.max && this.buttonPlus.classList.toggle("disabled", t >= parseInt(this.input.max)) 3642 } 3643} 3644_qty_forms = new WeakMap, 3645_qty_inputs = new WeakMap, 3646_on_variant_changed2 = new WeakSet, 3647on_variant_changed2_fn = function(t) { 3648 const e = t.detail.variant; 3649 e && e.available && getterRunFn(_update_quantity_rules, this, update_quantity_rules_fn).call(this, e), 3650 e && getterRunFn(_update_quantity_rules, this, update_quantity_rules_fn).call(this, e) 3651} 3652, 3653_on_cart_changed2 = new WeakSet, 3654on_cart_changed2_fn = function(t) { 3655 const e = t.detail.cart 3656 , i = getterGet(_qty_forms, this).id.value 3657 , n = $id4(`variant-picker-${this.getAttribute("section-id")}`); 3658 if (!n || !i) 3659 return; 3660 let s, r, a; 3661 "line-item:change" != t.detail.baseEvent ? s = e.items.find((t=>i == t.variant_id)) : (r = e.items_added.find((t=>i == t.variant_id)), 3662 a = e.items_removed.find((t=>i == t.variant_id))), 3663 (s || r || a) && getterRunFn(_update_quantity_rules, this, update_quantity_rules_fn).c
3663all(this, n?.getvariantObjById(i), e) 3664} 3665, 3666_set_quantity_boundries = new WeakSet, 3667set_quantity_boundries_fn = function() { 3668 const t = { 3669 cartQuantity: this.input.dataset.cartQuantity ? parseInt(this.input.dataset.cartQuantity) : 0, 3670 min: this.input.dataset.min ? parseInt(this.input.dataset.min) : 1, 3671 max: this.input.dataset.max ? parseInt(this.input.dataset.max) : null, 3672 step: this.input.step ? parseInt(this.input.step) : 1 3673 }; 3674 let e = t.min; 3675 const i = null === t.max ? t.max : t.max - t.cartQuantity; 3676 null !== i && (e = Math.min(e, i)), 3677 t.cartQuantity >= t.min && (e = Math.min(e, t.step)), 3678 this.input.min = e, 3679 this.input.max = i, 3680 this.input.value = e 3681} 3682, 3683_update_quantity_rules = new WeakSet, 3684update_quantity_rules_fn = async function(t, e=null) { 3685 const i = (e = e || await fetchCart).items.find((e=>e.id === t.id)); 3686 $4(".hdt-quantity__rules-cart", this.quantityForm).hidden = !i, 3687 i && ($4(".hdt-quantity-cart", this.quantityForm).textContent = i.quantity); 3688 const n = t.quantity_rule; 3689 $4(".hdt-quantity__rules", this.quantityForm).innerHTML = `<span class="hdt-divider">${n.increment > 1 ? themeHDN.extras.quantity.increment.replace("1904", n.increment) : ""}\n ${n.min > 1 ? themeHDN.extras.quantity.min.replace("1904", n.min) : ""}\n ${null != n.max ? themeHDN.extras.quantity.max.replace("1904", n.max) : ""}`; 3690 const s = ["data-cart-quantity", "data-min", "data-max", "step"] 3691 , r = [`${i ? i.quantity : 0}`, "min", "max", "increment"]; 3692 for (const [t,e] of s.entries()) { 3693 const i = 0 === t ? r[t] : n[r[t]]; 3694 null !== i ? this.input.setAttribute(e, i) : this.input.removeAttribute(e) 3695 } 3696 getterRunFn(_set_quantity_boundries, this, set_quantity_boundries_fn).call(this) 3697} 3698, 3699customElements.define("hdt-quantity-wrapp", QuantityWrapp); 3700class BlockRequired extends HTMLElement { 3701 #t; 3702 constructor() { 3703 super(), 3704 getterAdd(_block_required_on_submit, this), 3705 getterAdd(_block_required_on_change, this), 3706 getterAdd(_block_required_detect, this, this.getAttribute("detect")) 3707 } 3708 connectedCallback() { 3709 this.#t = new AbortController; 3710 const t = $$4("[required]", this); 3711 0 != t.length && (getterAdd(_block_required_froms, this, document.forms[this.attrForm]), 3712 getterGet(_block_required_froms, this) && (t.forEach((t=>{ 3713 t.removeAttribute("required"), 3714 this.classList.add("is-required") 3715 } 3716 )), 3717 this.updateBreak(), 3718 "change" === this.getAttribute("event") ? (setTimeout((()=>this.checked = $4("input:checked", this)), 100), 3719 this.addEventListener("change", getterRunFn(_block_required_on_change, this, block_required_on_change_fn).bind(this), { 3720 signal: this.#t.signal 3721 })) : this.addEventListener("input", debounce(getterRunFn(_block_required_on_change, this, block_required_on_change_fn).bind(this), 150, { 3722 signal: this.#t.signal 3723 })), 3724 getterGet(_block_required_froms, this).addEventListener("submit", getterRunFn(_block_required_on_submit, this, block_required_on_submit_fn).bind(this), { 3725 signal: this.#t.signal 3726 }))) 3727 } 3728 get attrForm() { 3729 return this._attrForm = this._attrForm || $4("[form]", this).getAttribute("form") 3730 } 3731 updateBreak() { 3732 getterGet(_block_required_froms, this).checkBreak = $$4(`hdt-block-required [form="${this.attrForm}"]`).length != $$4(`hdt-block-required:not(.is-uncheck, .is-required) [form="${this.attrForm}"]`).length 3733 } 3734 disconnectedCallback() { 3735 this.#t.abort() 3736 } 3737 createStyle() { 3738 const t = []; 3739 let e, i = 0; 3740 for (e = 0; e < 10; e++) 3741 t.push(`translate3d(${arguments[i++]},0,0)`), 3742 i === arguments.length && (i = 0); 3743 return t 3744 } 3745 set checked(t) { 3746 this.setChecked = t 3747 } 3748 get checked() { 3749 return this.setChecked 3750 } 3751} 3752_block_required_froms = new WeakMap, 3753_block_required_detect = new WeakMap, 3754_block_required_on_change = new WeakSet, 3755block_required_on_change_fn = function() { 3756 if (this.checked = !1, 3757 "checked" === getterGet(_block_required_detect, this)) 3758 $4("input:checked", this) && (this.checked = !0); 3759 else { 3760 const t = $4('input[type="text"]', this) || $4("textarea", this); 3761 t && t.value.length > 0 && (this.checked = !0) 3762 } 3763 this.classList.remove("is-uncheck"), 3764 this.classList.toggle("is-required", !this.checked), 3765 this.updateBreak() 3766} 3767, 3768_block_required_on_submit = new WeakSet, 3769block_required_on_submit_fn = function(t) { 3770 this.checked || (t.preventDefault(), 3771 t.stopPropagation(), 3772 this.classList.remove("is-required"), 3773 this.classList.add("is-uncheck"), 3774 $4(`hdt-block-required.is-uncheck [form="${this.attrForm}"]`).focus(), 3775 animate(this, { 3776 transform: this.createStyle(0, "-10px", "10px") 3777 }, {
3778 offset: [0, .1, .2, .3, .4, .5, .6, .7, .8, .9, 1], 3779 duration: 1, 3780 ease: "ease" 3781 })) 3782} 3783, 3784customElements.define("hdt-block-required", BlockRequired); 3785class CheckedToUse extends HTMLElement { 3786 #t; 3787 constructor() { 3788 super() 3789 } 3790 connectedCallback() { 3791 this.#t = new AbortController; 3792 const t = $id4(this.getAttribute("get-id")); 3793 t ? t.addEventListener("change", (e=>this.firstElementChild.toggleAttribute("disabled", !t.checked)), { 3794 signal: this.#t.signal 3795 }) : this.firstElementChild.removeAttribute("disabled"), 3796 this.addEventListener("click", (e=>{ 3797 t.checked || this.closest("form")?.dispatchEvent(new Event("submit",{ 3798 bubbles: !0 3799 })) 3800 } 3801 ), { 3802 signal: this.#t.signal 3803 }) 3804 } 3805 disconnectedCallback() { 3806 this.#t.abort() 3807 } 3808} 3809customElements.define("hdt-need-checked-to-use", CheckedToUse); 3810class CartForm extends HTMLFormElement { 3811 #t; 3812 constructor() { 3813 super(), 3814 getterAdd(_is_cart_dirty, this, !1), 3815 getterAdd(_cart_on_change, this) 3816 } 3817 connectedCallback() { 3818 this.#t = new AbortController, 3819 this.addEventListener("change", getterRunFn(_cart_on_change, this, cart_on_change_fn), { 3820 signal: this.#t.signal 3821 }) 3822 } 3823 disconnectedCallback() { 3824 this.#t.abort() 3825 } 3826} 3827_is_cart_dirty = new WeakMap, 3828_cart_on_change = new WeakSet, 3829cart_on_change_fn = async function(t) { 3830 if (getterGet(_is_cart_dirty, this) || !t.target.hasAttribute("will-change-cart")) 3831 return; 3832 getterAdd(_is_cart_dirty, this, !0, !0); 3833 const e = t.detail && t.detail.target ? t.detail.target : t.target 3834 , i = e.closest(".hdt-cart-item"); 3835 document.dispatchEvent(new CustomEvent("theme:loading:doing",{ 3836 bubbles: !0 3837 })), 3838 i?.classList.add("hdt-pe-none"); 3839 let n = []; 3840 document.dispatchEvent(new CustomEvent("cart:push:section.id",{ 3841 bubbles: !0, 3842 detail: { 3843 sections: n 3844 } 3845 })); 3846 const s = await (await fetch(`${this.action}/change.js`, { 3847 method: "POST", 3848 headers: { 3849 "Content-Type": "application/json" 3850 }, 3851 body: JSON.stringify({ 3852 line: e.dataset.index, 3853 quantity: e.value || 0, 3854 sections: n.join(",") 3855 }) 3856 })).json(); 3857 getterAdd(_is_cart_dirty, this, !1, !0), 3858 document.dispatchEvent(new CustomEvent("theme:loading:done",{ 3859 bubbles: !0 3860 })), 3861 i?.classList.remove("hdt-pe-none"), 3862 document.dispatchEvent(new CustomEvent("cart:change",{ 3863 bubbles: !0, 3864 detail: { 3865 baseEvent: "line-item:change", 3866 cart: s 3867 } 3868 })) 3869} 3870; 3871class RemoveItemOnCart extends HTMLAnchorElement { 3872 #t; 3873 constructor() { 3874 super(), 3875 getterAdd(_remove_item_on_cart, this) 3876 } 3877 connectedCallback() { 3878 getterAdd(_remove_forms, this, document.forms[this.getAttribute("form")] || this.closest("form")), 3879 this.#t = new AbortController, 3880 this.abortController2 = null, 3881 this.addEventListener("click", getterRunFn(_remove_item_on_cart, this, remove_item_on_cart_fn).bind(this), { 3882 signal: this.#t.signal 3883 }) 3884 } 3885 disconnectedCallback() { 3886 this.#t.abort() 3887 } 3888} 3889_remove_forms = new WeakMap, 3890_remove_item_on_cart = new WeakSet, 3891remove_item_on_cart_fn = async function(t) { 3892 t.preventDefault(), 3893 getterGet(_remove_forms, this).dispatchEvent(new CustomEvent("change",{ 3894 bubbles: !0, 3895 detail: { 3896 target: this 3897 } 3898 })) 3899} 3900; 3901class CartNote extends HTMLElement { 3902 #t; 3903 constructor() { 3904 super(), 3905 getterAdd(_cart_note_on_change, this) 3906 } 3907 connectedCallback() { 3908 this.#t = new AbortController, 3909 this.addEventListener("change", getterRunFn(_cart_note_on_change, this, cart_note_on_change_fn).bind(this), { 3910 signal: this.#t.signal 3911 }) 3912 } 3913 disconnectedCallback() { 3914 this.#t.abort() 3915 } 3916} 3917_cart_note_on_change = new WeakSet, 3918cart_note_on_change_fn = function(t) { 3919 const e = t.target.value; 3920 fetch(`${Shopify.routes.root}cart/update.js`, { 3921 method: "POST", 3922 headers: { 3923 "Content-Type": "application/json" 3924 }, 3925 body: JSON.stringify({ 3926 note: e 3927 }), 3928 keepalive: !0 3929 }), 3930 $$4("[data-label-note]").forEach((t=>{ 3931 2 === t.childElementCount && (t.firstElementChild.toggleAttribute("hidden", e.length > 0), 3932 t.lastElementChild.toggleAttribute("hidden", 0 === e.length)) 3933 } 3934 )) 3935} 3936; 3937var _refresh_cart_count, refresh_cart_count_fn, _render_cart_drawer, render_cart_drawer_fn, _cart_bundled_section, cart_bundled_section_fn, _on_cart_change, on_cart_change_fn, _on_page_show, on_page_show_fn, _refresh_cart, refresh_cart_fn, _cart_section_id, _cart_page_bundled_section, cart_page_bundled_section_fn, _cart_page_section_id, _render_cart_page, render_cart_page_fn, _on_cart_page_change, on_cart_page_change_fn, _allow_update_progress_bar, _update_progress_bar, update_progress_bar_fn, _color_progress_bar, _onCountryChanged, onCountryChanged_fn, _estimateShipping, estimateShipping_fn, _getAsyncShippingRates, getAsyncShippingRates_fn, _formatShippingRates, formatShippingRates_fn, _formatError, formatError_fn, createCartPromise = ()=>new Promise((async t=>{ 3938 t(await (await fetch(`${Shopify.routes.root}cart.js`)).json()) 3939} 3940)), fetchCart = createCartPromise(); 3941document.addEventListener("cart:change", (t=>{ 3942 fetchCart = t.detail.cart 3943} 3944)), 3945document.addEventListener("cart:refresh", (()=>{ 3946 fetchCart = createCartPromise() 3947} 3948)), 3949window.addEventListener("pageshow", (t=>{ 3950 t.persisted && (fetchCart = createCartPromise()) 3951} 3952)); 3953class CartCount extends HTMLElement { 3954 #t; 3955 constructor() { 3956 super(), 3957 getterAdd(_refresh_cart_count, this) 3958 } 3959 connectedCallback() { 3960 this.#t = new AbortController, 3961 document.addEventListener("cart:change", (t=>this.itemCount = t.detail.cart.item_count), { 3962 signal: this.#t.signal 3963 }), 3964 document.addEventListener("cart:refresh", getterRunFn(_refresh_cart_count, this, refresh_cart_count_fn).bind(this), { 3965 signal: this.#t.signal 3966 }), 3967 window.addEventListener("pageshow", getterRunFn(_refresh_cart_count, this, refresh_cart_count_fn).bind(this), { 3968 signal: this.#t.signal 3969 }) 3970 } 3971 disconnectedCallback() { 3972 this.#t.abort() 3973 } 3974 set itemCount(t) { 3975 this.innerText = t 3976 } 3977} 3978_refresh_cart_count = new WeakSet, 3979refresh_cart_count_fn = async function() { 3980 this.itemCount = (await fetchCart).item_count 3981} 3982; 3983class CartDot extends CartCount { 3984 set itemCount(t) { 3985 this.classList.toggle("is-visible", t > 0) 3986 } 3987} 3988class CartDrawer extends Drawer { 3989 constructor() { 3990 super(), 3991 getterAdd(_cart_section_id, this, this.getAttribute("section-id")), 3992 getterAdd(_render_cart_drawer, this), 3993 getterAdd(_cart_bundled_section, this), 3994 getterAdd(_on_cart_change, this), 3995 getterAdd(_on_page_show, this), 3996 getterAdd(_refresh_cart, this) 3997 } 3998 connectedCallback() { 3999 super.connectedCallback(), 4000 document.addEventListener("cart:push:section.id", getterRunFn(_cart_bundled_section, this, cart_bundled_section_fn).bind(this), { 4001 signal: this.abortController.signal 4002 }), 4003 document.addEventListener("cart:change", getterRunFn(_on_cart_change, this, on_cart_change_fn).bind(this), { 4004 signal: this.abortController.signal 4005 }), 4006 document.addEventListener("cart:refresh", getterRunFn(_refresh_cart, this, refresh_cart_fn).bind(this), { 4007 signal: this.abortController.signal 4008 }), 4009 window.addEventListener("pageshow", getterRunFn(_on_page_show, this, on_page_show_fn).bind(this), { 4010 signal: this.abortController.signal 4011 }) 4012 } 4013} 4014_cart_section_id = new WeakMap, 4015_render_cart_drawer = new WeakSet, 4016render_cart_drawer_fn = async function(t, e=null) { 4017 const i = (new DOMParser).parseFromString(t, "text/html") 4018 , n = $4(".hdt-free-shipping-bar", i); 4019 let s = 0; 4020 n && (s = $4(".hdt-progress-bar", n).getAttribute("aria-valuenow"), 4021 $4(".hdt-progress-bar", n).valueNow = $4(".hdt-progress-bar", this).getAttribute("aria-valuenow"), 4022 $4(".hdt-progress-bar", n).style.setProperty("--progress-rate", $4(".hdt-progress-bar", this).style.getPropertyValue("--progress-rate"))); 4023 const r = document.createRange().createContextualFragment(i.getElementById(`shopify-section-${getterGet(_cart_section_id, this)}`).querySelector("hdt-cart-drawer").innerHTML); 4024 if (0 === (e || (await fetchCart).item_count)) { 4025 const t = timeline([[this.selectorPartName("body"), { 4026 opacity: [1, 0] 4027 }, { 4028 duration: .15, 4029 easing: "ease-in" 4030 }], [this.selectorPartName("footer"), { 4031 opacity: [1, 0], 4032 transform: ["translateY(0)", "translateY(30px)"] 4033 }, { 4034 duration: .15, 4035 at: "<", 4036 easing: "ease-in" 4037 }]]); 4038 await t.finished, 4039 this.replaceChildren(...r.children), 4040 animate(this.selectorPartName("body"), { 4041 opacity: [0, 1], 4042 transform: ["translateY(30px)", "translateY(0)"] 4043 }, { 4044 duration: .25, 4045 easing: [.25, .46, .45, .94] 4046 }) 4047 } else 4048 this.replaceChildren(...r.children); 4049 n && ($4(".hdt-progress-bar", this).valueNow = s) 4050} 4051, 4052_cart_bundled_section = new WeakSet, 4053cart_bundled_section_fn = function(t) { 4054 t.detail.sections.push(getterGet(_cart_section_id, this)) 4055} 4056, 4057_on_cart_change = new WeakSet, 4058on_cart_change_fn = function(t) { 4059 getterRunFn(_render_cart_drawer, this, render_cart_drawer_fn).call(this, t.detail.cart.sections[getterGet(_cart_section_id, this)], t.detail.cart.item_count), 4060 document.dispatchEvent(new CustomEvent("currency:update")); 4061 const e = t.detail.actionAfterATC || themeHDN.settings.actionAfterATC; 4062 if ("variant:add" === t.detail.baseEvent) 4063 switch (e) { 4064 case "open_cart_drawer": 4065 this.openDialog(); 4066 break; 4067 case "go_checkout_page": 4068 window.location.href = `${Shopify.routes.root}checkout`; 4069 break; 4070 case "go_cart_page": 4071 window.location.href = `${Shopify.routes.root}cart` 4072 } 4073} 4074, 4075_on_page_show = new WeakSet, 4076on_page_show_fn = function(t) { 4077 t.persisted && getterRunFn(_refresh_cart, this, refresh_cart_fn).call(this) 4078} 4079, 4080_refresh_cart = new WeakSet, 4081refresh_cart_fn = async function() { 4082 getterRunFn(_render_cart_drawer, this, render_cart_drawer_fn).call(this, await (await fetch(`${Shopify.routes.root}?section_id=${getterGet(_cart_section_id, this)}`)).text()) 4083} 4084; 4085class CartPageForm extends CartForm { 4086 #t; 4087 constructor() { 4088 super(), 4089 getterAdd(_cart_page_section_id, this, this.getAttribute("section-id")), 4090 getterAdd(_render_cart_page, this), 4091 getterAdd(_cart_page_bundled_section, this), 4092 getterAdd(_on_cart_page_change, this) 4093 } 4094 connectedCallback() { 4095 super.connectedCallback(), 4096 this.#t = new AbortController, 4097 document.addEventListener("cart:change", getterRunFn(_on_cart_page_change, this, on_cart_page_change_fn).bind(this), { 4098 signal: this.#t.signal 4099 }), 4100 document.addEventListener("cart:push:section.id", getterRunFn(_cart_page_bundled_section, this, cart_page_bundled_section_fn).bind(this), { 4101 signal: this.#t.signal 4102 }) 4103 } 4104 disconnectedCallback() { 4105 super.disconnectedCallback(), 4106 this.#t.abort() 4107 } 4108} 4109_cart_page_section_id = new WeakMap, 4110_render_cart_page = new WeakSet, 4111render_cart_page_fn = async function(t, e=null) { 4112 const i = (new DOMParser).parseFromString(t, "text/html") 4113 , n = $4(".hdt-free-shipping-bar", i) 4114 , s = this.closest(".shopify-section"); 4115 let r = 0; 4116 n && (r = $4(".hdt-progress-bar", n).getAttribute("aria-valuenow"), 4117 $4(".hdt-progress-bar", n).valueNow = $4(".hdt-progress-bar", s).getAttribute("aria-valuenow"), 4118 $4(".hdt-progress-bar", n).style.setProperty("--progress-rate", $4(".hdt-progress-bar", s).style.getPropertyValue("--progress-rate"))); 4119 const a = $4(".shopify-section [main-content]", i).innerHTML; 4120 if (0 === (e || (await fetchCart).item_count)) { 4121 const t = animate(s, { 4122 opacity: [1, 0], 4123 transform: ["translateY(0)", "translateY(30px)"] 4124 }, { 4125 duration: .25, 4126 easing: [.25, .46, .45, .94] 4127 }); 4128 await t.finished, 4129 $4("[main-content]", s).innerHTML = a, 4130 animate(s, { 4131 opacity: [0, 1], 4132 transform: ["translateY(30px)", "translateY(0)"] 4133 }, { 4134 duration: .25, 4135 easing: [.25, .46, .45, .94] 4136 }) 4137 } else 4138 $4("[main-content]", s).innerHTML = a; 4139 n && ($4(".hdt-progress-bar", s).valueNow = r), 4140 document.dispatchEvent(new CustomEvent("currency:update")) 4141} 4142, 4143_on_cart_page_change = new WeakSet, 4144on_cart_page_change_fn = function(t) { 4145 if ("variant:add" === t.detail.baseEvent) 4146 return window.location.href = `${Shopify.routes.root}cart`; 4147 getterRunFn(_render_cart_page, this, render_cart_page_fn).call(this, t.detail.cart.sections[getterGet(_cart_page_section_id, this)], t.detail.cart.item_count) 4148} 4149, 4150_cart_page_bundled_section = new WeakSet, 4151cart_page_bundled_section_fn = function(t) { 4152 t.detail.sections.push(getterGet(_cart_page_section_id, this)) 4153} 4154, 4155customElements.define("hdt-cart-form", CartForm, { 4156 extends: "form" 4157}), 4158customElements.define("hdt-cart-page-form", CartPageForm, { 4159 extends: "form" 4160}), 4161customElements.define("remove-item-oncart", RemoveItemOnCart, { 4162 extends: "a" 4163}), 4164customElements.define("hdt-cart-note", CartNote),
4165customElements.define("hdt-cart-count", CartCount), 4166customElements.define("hdt-cart-dot", CartDot), 4167customElements.define("hdt-cart-drawer", CartDrawer); 4168class ProgressBar extends HTMLElement { 4169 constructor() { 4170 super(), 4171 getterAdd(_update_progress_bar, this), 4172 getterAdd(_allow_update_progress_bar, this, !this.hasAttribute("reveal-in-view")), 4173 getterAdd(_color_progress_bar, this, this.getAttribute("data-colors")) 4174 } 4175 static get observedAttributes() { 4176 return ["aria-valuenow", "aria-valuemax"] 4177 } 4178 connectedCallback() { 4179 this.hasAttribute("reveal-in-view") && inView(this, (()=>{ 4180 getterAdd(_allow_update_progress_bar, this, !0, !0), 4181 getterRunFn(_update_progress_bar, this, update_progress_bar_fn).call(this) 4182 } 4183 ), { 4184 margin: "-50px 0px" 4185 }) 4186 } 4187 get progress() { 4188 return Math.min(1, this.getAttribute("aria-valuenow") / this.getAttribute("aria-valuemax")) 4189 } 4190 set valueMax(t) { 4191 this.setAttribute("aria-valuemax", t) 4192 } 4193 set valueNow(t) { 4194 this.setAttribute("aria-valuenow", t) 4195 } 4196 attributeChangedCallback() { 4197 getterGet(_allow_update_progress_bar, this) && getterRunFn(_update_progress_bar, this, update_progress_bar_fn).call(this) 4198 } 4199} 4200_color_progress_bar = new WeakMap, 4201_allow_update_progress_bar = new WeakMap, 4202_update_progress_bar = new WeakSet, 4203update_progress_bar_fn = function() { 4204 const t = JSON.parse(getterGet(_color_progress_bar, this)) 4205 , e = (this.progress + "").slice(0, 3); 4206 if (t && t[e]) 4207 for (let[i,n] of Object.entries(t)) 4208 this.parentElement.classList.toggle(n, i == e); 4209 this.style.setProperty("--progress-rate", `${this.progress}`) 4210} 4211, 4212customElements.define("hdt-progress-bar", ProgressBar); 4213class CountryProvinceSelector extends HTMLElement { 4214 #t; 4215 constructor() { 4216 super(...arguments), 4217 getterAdd(_onCountryChanged, this) 4218 } 4219 connectedCallback() { 4220 this.#t = new AbortController, 4221 this.countryEl = $4('[name="address[country]"]', this), 4222 this.provinceEl = $4('[name="address[province]"]', this), 4223 this.countryEl.addEventListener("change", getterRunFn(_onCountryChanged, this, onCountryChanged_fn).bind(this), { 4224 signal: this.#t.signal 4225 }), 4226 "" !== this.getAttribute("country") && (this.countryEl.selectedIndex = Math.max(0, Array.from(this.countryEl.options).findIndex((t=>t.textContent === this.getAttribute("country"))))), 4227 this.countryEl.dispatchEvent(new Event("change")) 4228 } 4229 disconnectedCallback() { 4230 this.#t.abort() 4231 } 4232} 4233_onCountryChanged = new WeakSet, 4234onCountryChanged_fn = function() { 4235 const t = this.countryEl.options[this.countryEl.selectedIndex] 4236 , e = JSON.parse(t.getAttribute("data-provinces")); 4237 this.provinceEl.parentElement.hidden = 0 === e.length, 4238 this.provinceEl.disabled = 0 === e.length, 4239 0 !== e.length && (this.provinceEl.innerHTML = "", 4240 e.forEach((t=>{ 4241 const e = t[1] === this.getAttribute("province") || t[0] === this.getAttribute("province"); 4242 this.provinceEl.options.add(new Option(t[1],t[0],e,e)) 4243 } 4244 ))) 4245} 4246, 4247customElements.define("hdt-country-province-selector", CountryProvinceSelector); 4248var ShippingCalculator = class extends HTMLElement { 4249 #t; 4250 constructor() { 4251 super(), 4252 getterAdd(_estimateShipping, this), 4253 getterAdd(_getAsyncShippingRates, this), 4254 getterAdd(_formatShippingRates, this), 4255 getterAdd(_formatError, this), 4256 this.langRates = JSON.parse($4("template[data-lang-rates]", this).innerHTML) 4257 } 4258 connectedCallback() { 4259 this.#t = new AbortController, 4260 this.submitButton = $4('[type="button"]', this), 4261 this.resultsElement = $4('[aria-live="polite"]', this), 4262 this.submitButton.addEventListener("click", getterRunFn(_estimateShipping, this, estimateShipping_fn).bind(this), { 4263 signal: this.#t.signal 4264 }) 4265 } 4266 disconnectedCallback() { 4267 this.#t.abort() 4268 } 4269} 4270; 4271_estimateShipping = new WeakSet, 4272estimateShipping_fn = async function(t) { 4273 t.preventDefault(); 4274 const e = $4('[name="address[zip]"]', this).value 4275 , i = $4('[name="address[country]"]', this).value 4276 , n = $4('[name="address[province]"]', this) 4277 , s = n.disabled ? "" : n.value; 4278 this.submitButton.setAttribute("aria-busy", "true"), 4279 document.dispatchEvent(new CustomEvent("theme:loading:doing",{ 4280 bubbles: !0 4281 })); 4282 const r = await fetch(`${Shopify.routes.root}cart/prepare_shipping_rates.json?shipping_address[zip]=${e}&shipping_address[country]=${i}&shipping_address[province]=${s}`, { 4283 method: "POST" 4284 }); 4285 if (document.dispatchEvent(new CustomEvent("theme:loading:done",{ 4286 bubbles: !0 4287 })), 4288 r.ok) { 4289 const t = await getterRunFn(_getAsyncShippingRates, this, getAsyncShippingRates_fn).c
4289all(this, e, i, s); 4290 getterRunFn(_formatShippingRates, this, formatShippingRates_fn).call(this, t) 4291 } else { 4292 const t = await r.json(); 4293 getterRunFn(_formatError, this, formatError_fn).call(this, t) 4294 } 4295 this.resultsElement.hidden = !1, 4296 this.submitButton.removeAttribute("aria-busy") 4297} 4298, 4299_getAsyncShippingRates = new WeakSet, 4300getAsyncShippingRates_fn = async function(t, e, i) { 4301 const n = await fetch(`${Shopify.routes.root}cart/async_shipping_rates.json?shipping_address[zip]=${t}&shipping_address[country]=${e}&shipping_address[province]=${i}`) 4302 , s = await n.text(); 4303 return "null" === s ? getterRunFn(_getAsyncShippingRates, this, getAsyncShippingRates_fn).call(this, t, e, i) : JSON.parse(s).shipping_rates 4304} 4305, 4306_formatShippingRates = new WeakSet, 4307formatShippingRates_fn = function(t) { 4308 let e = t.map((t=>`<li>${t.presentment_name}: ${"0.00" == t.price ? this.langRates.free : `${t.price} ${t.currency}`}</li>`)); 4309 this.resultsElement.innerHTML = `\n <div class="hdt-mess__rates is--rates-success">\n <p>${0 === t.length ? this.langRates.no_rates : 1 === t.length ? this.langRates.one_rate : this.langRates.multiple_rates}</p>\n ${"" === e ? "" : `<ul role="list">${e.join("")}</ul>`}\n </div>\n ` 4310} 4311, 4312_formatError = new WeakSet, 4313formatError_fn = function(t) { 4314 let e = Object.keys(t).map((e=>`<li><span class="hdt-key__rate">${e}:</span> ${t[e]}</li>`)); 4315 this.resultsElement.innerHTML = `\n <div class="hdt-mess__rates is--rates-error">\n <p>${this.langRates.errors}</p>\n <ul role="list">${e.join("")}</ul>\n </div>\n ` 4316} 4317, 4318customElements.define("hdt-shipping-calculator", ShippingCalculator); 4319class player extends HTMLElement { 4320 static get observedAttributes() { 4321 return ["playing"] 4322 } 4323 connectedCallback() { 4324 this._abortController = new AbortController, 4325 this.hasAttribute("autoplay") && inView(this, this.play.bind(this), { 4326 margin: "0px 0px 0px 0px" 4327 }) 4328 } 4329 disconnectedCallback() { 4330 this._abortController.abort() 4331 } 4332 get playing() { 4333 return this.hasAttribute("playing") 4334 } 4335 get player() { 4336 return this._playerProxy = this._playerProxy || new Proxy(this._createPlayer(),{ 4337 get: (t,e)=>async()=>{ 4338 t = await t, 4339 this._playerApi(t, e) 4340 } 4341 }) 4342 } 4343 play() { 4344 this.playing || this.player.play() 4345 } 4346 pause() { 4347 this.playing && this.player.pause() 4348 } 4349 attributeChangedCallback(t, e, i) { 4350 "playing" === t && (null === e && "" === i ? (this.dispatchEvent(new CustomEvent("media:play",{ 4351 bubbles: !0 4352 })), 4353 this.hasAttribute("group") && Array.from(document.querySelectorAll(`[group="${this.getAttribute("group")}"]`)).filter((t=>t !== this)).forEach((t=>{ 4354 t.pause() 4355 } 4356 ))) : null === i && this.dispatchEvent(new CustomEvent("media:pause",{ 4357 bubbles: !0 4358 }))) 4359 } 4360} 4361class ModelPlayer extends player { 4362 connectedCallback() { 4363 super.connectedCallback(), 4364 this.player 4365 } 4366 _createPlayer() { 4367 return new Promise((t=>{ 4368 this.setAttribute("loaded", ""), 4369 window.Shopify.loadFeatures([{ 4370 name: "shopify-xr", 4371 version: "1.0", 4372 onLoad: this._setupShopifyXr.bind(this) 4373 }, { 4374 name: "model-viewer-ui", 4375 version: "1.0", 4376 onLoad: ()=>{ 4377 const e = $4("model-viewer", this); 4378 e.addEventListener("shopify_model_viewer_ui_toggle_play", (()=>this.setAttribute("playing", ""))), 4379 e.addEventListener("shopify_model_viewer_ui_toggle_pause", (()=>this.removeAttribute("playing"))), 4380 t(new window.Shopify.ModelViewerUI(e,{ 4381 focusOnPlay: !0 4382 })) 4383 } 4384 }]) 4385 } 4386 )) 4387 } 4388 _playerApi(t, e) {} 4389 async _setupShopifyXr() { 4390 if (window.ShopifyXR) {
4391 const t = $id4("ModelJson-" + this.getAttribute("section-id")); 4392 window.ShopifyXR.addModels(JSON.parse(t.textContent)), 4393 window.ShopifyXR.setupXRElements(), 4394 this.closest("hdt-slider")?.reInit() 4395 } else 4396 document.addEventListener("shopify_xr_initialized", this._setupShopifyXr.bind(this)) 4397 } 4398} 4399var onYouTubePromise = new Promise((t=>{ 4400 window.onYouTubeIframeAPIReady = ()=>t() 4401} 4402)); 4403class VideoPlayer extends player { 4404 #i = !1; 4405 connectedCallback() { 4406 super.connectedCallback(), 4407 this.hasAttribute("autoplay") || this.addEventListener("click", this.play, { 4408 once: !0, 4409 signal: this._abortController.signal 4410 }), 4411 "video" === this.getAttribute("type") && inView(this, (()=>{ 4412 $4("video", this)?.setAttribute("preload", "metadata") 4413 } 4414 ), { 4415 margin: "800px" 4416 }) 4417 } 4418 _createPlayer() { 4419 if (this.hasAttribute("host")) 4420 return this.setAttribute("loaded", ""), 4421 new Promise((async t=>{ 4422 const e = $4("template", this); 4423 e && e.replaceWith(e.content.firstElementChild.cloneNode(!0)), 4424 "background" === this.getAttribute("type") && (this.sizeBackgroundVideo(), 4425 window.addEventListener("resize", debounce(this.sizeBackgroundVideo.bind(this), 300))); 4426 const i = this.hasAttribute("autoplay") || _matchMedia("phone") 4427 , n = document.createElement("script"); 4428 if (n.type = "text/javascript", 4429 "youtube" === this.getAttribute("host")) { 4430 window.YT && window.YT.Player || (n.src = "https://www.youtube.com/iframe_api", 4431 document.head.appendChild(n), 4432 await new Promise((t=>{ 4433 n.onload = t 4434 } 4435 ))), 4436 await onYouTubePromise; 4437 const e = new YT.Player($4("iframe", this),{ 4438 events: { 4439 onReady: ()=>{ 4440 i && e.mute(), 4441 t(e) 4442 } 4443 , 4444 onStateChange: t=>{ 4445 t.data === YT.PlayerState.PLAYING ? this.setAttribute("playing", "") : t.data !== YT.PlayerState.ENDED && t.data !== YT.PlayerState.PAUSED || this.removeAttribute("playing") 4446 } 4447 } 4448 }) 4449 } 4450 if ("vimeo" === this.getAttribute("host")) { 4451 window.Vimeo && window.Vimeo.Player || (n.src = "https://player.vimeo.com/api/player.js", 4452 document.head.appendChild(n), 4453 await new Promise((t=>{ 4454 n.onload = t 4455 } 4456 ))); 4457 const e = new Vimeo.Player($4("iframe", this)); 4458 i && e.setMuted(!0), 4459 e.on("play", (()=>{ 4460 this.setAttribute("playing", "") 4461 } 4462 )), 4463 e.on("pause", (()=>this.removeAttribute("playing"))), 4464 e.on("ended", (()=>this.removeAttribute("playing"))), 4465 t(e) 4466 } 4467 } 4468 )); 4469 { 4470 const t = $4("video", this); 4471 return this.setAttribute("loaded", ""), 4472 t.addEventListener("play", (()=>{ 4473 this.setAttribute("playing", ""), 4474 this.removeAttribute("suspended"), 4475 this.#i && (t.controls = !1) 4476 } 4477 )), 4478 t.addEventListener("pause", (()=>{ 4479 !t.seeking && t.paused && this.removeAttribute("playing") 4480 } 4481 )), 4482 t 4483 } 4484 } 4485 _playerApi(t, e) { 4486 "youtube" === this.getAttribute("host") ? t[`${e}Video`]() : "play" !== e || this.hasAttribute("host") ? t[e]() : t.play().catch((e=>{ 4487 "NotAllowedError" === e.name && (this.setAttribute("suspended", ""), 4488 this.hasAttribute("controls") || (this.#i = !0, 4489 t.controls = !0)) 4490 } 4491 )) 4492 }
4493 sizeBackgroundVideo() { 4494 var t, e, i, n, s = this.clientWidth, r = this.clientHeight; 4495 s / r < 16 / 9 ? (t = r * (16 / 9), 4496 e = r, 4497 i = -Math.round((t - s) / 2), 4498 n = -Math.round((e - r) / 2)) : (e = (t = s) * (9 / 16), 4499 n = -Math.round((e - r) / 2), 4500 i = -Math.round((t - s) / 2)), 4501 $4("iframe", this).style.cssText = `max-width: 1000%; margin-left: ${i}px; margin-top: ${n}px; width: ${t}px; height: ${e}px;` 4502 } 4503} 4504import {PhotoSwipeLightbox, Zoom} from "vendor"; 4505var _on_variant_changed_media, on_variant_changed_media_fn, _slider_main_select, slider_main_select_fn, _media_image_click, media_image_click_fn, _media_image_zoom, media_image_zoom_fn, _update_group_media, update_group_media_fn, _lightbox_psw_media_init = new WeakMap; 4506class ProductMedia extends HTMLElement { 4507 #t; 4508 constructor() { 4509 super(), 4510 getterAdd(_on_variant_changed_media, this), 4511 getterAdd(_update_group_media, this), 4512 getterAdd(_slider_main_select, this), 4513 getterAdd(_media_image_click, this), 4514 getterAdd(_media_image_zoom, this) 4515 } 4516 connectedCallback() { 4517 this.#t = new AbortController, 4518 this.form?.addEventListener(variantChange, getterRunFn(_on_variant_changed_media, this, on_variant_changed_media_fn).bind(this), { 4519 signal: this.#t.signal 4520 }), 4521 this.sliderMain && this.sliderMain.addEventListener("select:slide", getterRunFn(_slider_main_select, this, slider_main_select_fn).bind(this), { 4522 signal: this.#t.signal 4523 }), 4524 this.updateGroupFilter && this.addEventListener("update:value", getterRunFn(_update_group_media, this, update_group_media_fn).bind(this), { 4525 signal: this.#t.signal 4526 }), 4527 "no" != this.imageZoom && ($$4('.hdt-product-media__main [data-media-type="image"]', this).forEach((t=>{ 4528 t.addEventListener("click", getterRunFn(_media_image_click, this, media_image_click_fn).bind(this, t), {
4529 signal: this.#t.signal 4530 }) 4531 } 4532 )), 4533 this.addEventListener("lightbox:psw:open", (t=>this.openLightBox(t?.detail?.index)))), 4534 "zoom" != this.imageZoom && "zoom_lightbox" != this.imageZoom || !_matchMedia("supports-hover") || getterRunFn(_media_image_zoom, this, media_image_zoom_fn).call(this) 4535 } 4536 disconnectedCallback() { 4537 this.#t.abort() 4538 } 4539 get form() { 4540 return this._form = this._form || document.forms[this.getAttribute("form")] 4541 } 4542 get sliderMain() { 4543 return this._sliderMain = this._sliderMain || $4(".hdt-product-media__main hdt-slider", this) 4544 } 4545 get sliderThumb() { 4546 return this._sliderThumb = this._sliderThumb || $4("hdt-slider-thumb", this) 4547 } 4548 get variantPicker() { 4549 return this._variantPicker = this._variantPicker || $4(`hdt-variant-picker[form="${this.getAttribute("form")}"]`) 4550 } 4551 get updateGroupFilter() { 4552 return this.hasAttribute("can-has-media-group") 4553 } 4554 get imageZoom() { 4555 return this.getAttribute("image-zoom") 4556 } 4557 get sectionId() { 4558 return this.getAttribute("section-id") 4559 } 4560 get lightBox() { 4561 if (getterGet(_lightbox_psw_media_init, this)) 4562 return getterGet(_lightbox_psw_media_init, this); 4563 let t = parseInt(this.getAttribute("max-zoom")) || 2; 4564 return getterAdd(_lightbox_psw_media_init, this, new PhotoSwipeLightbox({ 4565 pswpModule: ()=>import("photoswipe"), 4566 bgOpacity: 1, 4567 secondaryZoomLevel: t, 4568 maxZoomLevel: ++t, 4569 closeTitle: themeHDN.extras.pswp.close, 4570 zoomTitle: themeHDN.extras.pswp.zoom, 4571 arrowPrevTitle: themeHDN.extras.pswp.prev, 4572 arrowNextTitle: themeHDN.extras.pswp.next, 4573 errorMsg: themeHDN.extras.pswp.errorMsg 4574 })), 4575 getterGet(_lightbox_psw_media_init, this).addFilter("thumbEl", ((t,e)=>e.thumbEl)), 4576 getterGet(_lightbox_psw_media_init, this).on("close", (()=>{ 4577 const t = $$4('.hdt-product-media__main [data-media-type="image"]:not([hidden])')[getterGet(_lightbox_psw_media_init, this).pswp.currIndex]; 4578 t && (this.sliderMain && this.sliderMain.isActive ? this.sliderMain.scrollToTarget(t, !0) : t.scrollIntoView({ 4579 block: "start", 4580 behavior: "instant" 4581 })) 4582 } 4583 )), 4584 getterGet(_lightbox_psw_media_init, this).init(), 4585 getterGet(_lightbox_psw_media_init, this) 4586 } 4587 openLightBox(t=0) { 4588 const e = $$4('.hdt-product-media__main [data-media-type="image"]:not([hidden]) img', this).map((t=>({ 4589 thumbEl: t, 4590 src: t.src, 4591 srcset: t.srcset, 4592 msrc: t.currentSrc || t.src, 4593 width: parseInt(t.getAttribute("width")), 4594 height: parseInt(t.getAttribute("height")), 4595 alt: t.alt, 4596 thumbCropped: !0 4597 }))); 4598 this.lightBox.loadAndOpen(t, e) 4599 } 4600} 4601_on_variant_changed_media = new WeakSet, 4602on_variant_changed_media_fn = function(t) { 4603 const e = t.detail.variant; 4604 if (getterRunFn(_update_group_media, this, update_group_media_fn).call(this, e), 4605 e.mdid && t.detail.jumpMedia) { 4606 const t = $4(`.hdt-product-media__main [data-media-id="${e.mdid}"]`, this); 4607 t && (this.sliderMain.isActive ? this.sliderMain.scrollToTarget(t) : t.scrollIntoView({ 4608 block: "start", 4609 behavior: "smooth" 4610 })) 4611 } 4612} 4613, 4614_update_group_media = new WeakSet, 4615update_group_media_fn = function(t) { 4616 const e = t.options || t.detail.options; 4617 if (!this.updateGroupFilter) 4618 return; 4619 let i = !1; 4620 e.forEach(((t,e)=>{ 4621 $$4(`[data-group-name="option${e}"][data-group-value="${t}"][hidden]`).length && this.sliderMain.isActive && ($4("[data-media-type].is-selected hdt-video-player[loaded]", this)?.pause(), 4622 i = !0), 4623 $$4(`[data-group-name="option${e}"]`, this).forEach((e=>{ 4624 e.getAttribute("data-group-value") == t ? e.removeAttribute("hidden") : e.setAttribute("hidden", "") 4625 } 4626 )) 4627 } 4628 )), 4629 i && (this.sliderMain.reInit(), 4630 this.sliderThumb?.reInit()) 4631} 4632, 4633_slider_main_select = new WeakSet, 4634slider_main_select_fn = function(t) { 4635 const e = t.detail.sliderApi 4636 , i = e.slideNodes()[e.selectedScrollSnap()] 4637 , n = e.slideNodes()[e.previousScrollSnap()] 4638 , s = i.getAttribute("data-media-id") || null 4639 , r = (i.dataset.variantsId || "").split(";"); 4640 switch (s && this.variantPicker && this.hasAttribute("update-when-variant-change") && r[0] && r.indexOf(this.form.id.value) < 0 && this.variantPicker.selectVariantByID(r[0], !1), 4641 n.getAttribute("data-media-type")) { 4642 case "video": 4643 case "external_video": 4644 $4("hdt-video-player[loaded]", n)?.pause() 4645 } 4646 switch (i.getAttribute("data-media-type")) { 4647 case "video": 4648 case "external_video": 4649 this.hasAttribute("autoplay-media") && $4("hdt-video-player", i).play(); 4650 break; 4651 case "model":
4652 _matchMedia("phone") || $4("hdt-model-player", i).play() 4653 } 4654} 4655, 4656_media_image_click = new WeakSet, 4657media_image_click_fn = function(t) { 4658 const e = $$4('.hdt-product-media__main [data-media-type="image"]:not([hidden])', this); 4659 this.dispatchEvent(new CustomEvent("lightbox:psw:open",{ 4660 bubbles: !0, 4661 detail: { 4662 index: e.indexOf(t) 4663 } 4664 })) 4665} 4666, 4667_media_image_zoom = new WeakSet, 4668media_image_zoom_fn = function() { 4669 var t = "zoom_fade_media" 4670 , e = "zoom_fade_info" 4671 , i = JSON.parse(this.getAttribute("zoom-options")) 4672 , n = $id4(`product-zoom-${this.sectionId}`) 4673 , s = $id4(`product-info-${this.sectionId}`) 4674 , r = i.type 4675 , a = i.magnify 4676 , o = "external" == r; 4677 Shopify.designMode && $4(".drift-zoom-pane, .drift-bounding-box")?.remove(), 4678 html.classList.add(`zoom-type--${r}`), 4679 $$4('.hdt-product-media__main [data-media-type="image"] img', this).forEach((i=>{ 4680 new Zoom(i,{ 4681 sourceAttribute: "src", 4682 zoomFactor: a, 4683 inlinePane: !o && "inner2" == r, 4684 containInline: o, 4685 paneContainer: o ? n : i.parentElement, 4686 hoverBoundingBox: o, 4687 handleTouch: !1, 4688 onShow: ()=>{ 4689 this.classList.add(t), 4690 s.classList.add(e) 4691 } 4692 , 4693 onHide: ()=>{ 4694 this.classList.remove(t), 4695 s.classList.remove(e) 4696 } 4697 }) 4698 } 4699 )) 4700} 4701; 4702class OpenLightboxPSWMedia extends HTMLButtonElement { 4703 constructor() { 4704 super(), 4705 this.addEventListener("click", (()=>this.dispatchEvent(new CustomEvent("lightbox:psw:open",{ 4706 bubbles: !0 4707 })))) 4708 } 4709} 4710var _lightbox_psw_init, lightbox_psw_init_fn, _lightbox_psws = new WeakMap; 4711class OpenLightboxPSW extends HTMLButtonElement { 4712 #t; 4713 constructor() { 4714 super(), 4715 getterAdd(_lightbox_psw_init, this) 4716 } 4717 connectedCallback() { 4718 this.#t = new AbortController, 4719 this.dataset.objImg && (getterRunFn(_lightbox_psw_init, this, lightbox_psw_init_fn).call(this), 4720 this.addEventListener("click", (()=>this.lightBox?.loadAndOpen(this.dataset.index || 0)), { 4721 signal: this.#t.signal 4722 })) 4723 } 4724 disconnectedCallback() { 4725 this.#t.abort() 4726 } 4727 get lightBox() { 4728 return getterGet(_lightbox_psws, this) 4729 } 4730 get objImg() { 4731 return this.getAttribute("obj-img") 4732 } 4733} 4734_lightbox_psw_init = new WeakSet, 4735lightbox_psw_init_fn = function() { 4736 let t = null; 4737 const e = JSON.parse(this.dataset.objImg); 4738 e.srcset = renderSrcset(e.src, JSON.parse(this.dataset.widths || `[246, 493, 600, 713, 823, 990, 1100, 1206, 1346, 1426, 1646, 1946, 2200, 2500, 3000, 3500, 4000, ${e.width}]`)), 4739 t = [e]; 4740 getterAdd(_lightbox_psws, this, new PhotoSwipeLightbox({ 4741 bgOpacity: 1, 4742 showHideAnimationType: "fade", 4743 pswpModule: ()=>import("photoswipe"), 4744 dataSource: t 4745 })), 4746 this.lightBox.init(), 4747 t = null 4748} 4749, 4750customElements.define("hdt-video-player", VideoPlayer), 4751customElements.define("hdt-model-player", ModelPlayer), 4752customElements.define("hdt-product-media", ProductMedia), 4753customElements.define("open-pswp-media", OpenLightboxPSWMedia, { 4754 extends: "button" 4755}), 4756customElements.define("open-pswp-button", OpenLightboxPSW, { 4757 extends: "button" 4758}); 4759var _item_compare_color, item_compare_color_fn, _items_compare_color = new WeakMap; 4760class CompareToogle extends HTMLElement { 4761 #t; 4762 constructor() { 4763 super(), 4764 getterAdd(_items_compare_color, this, $$4(".hdt-compare-color-item", this.closest(".hdt-modal__compare-color"))), 4765 getterAdd(_item_compare_color, this) 4766 } 4767 connectedCallback() { 4768 this.#t = new AbortController, 4769 this.indexOrder = 0, 4770 $$4("button", this).forEach(((t,e)=>{ 4771 ++this.indexOrder, 4772 t.addEventListener("click", getterRunFn(_item_compare_color, this, item_compare_color_fn).bind(this, t, e), { 4773 signal: this.#t.signal 4774 }) 4775 } 4776 )) 4777 } 4778 disconnectedCallback() { 4779 this.#t.abort() 4780 } 4781} 4782_item_compare_color = new WeakSet, 4783item_compare_color_fn = function(t, e) { 4784 const i = t.classList.toggle("is-hide-color"); 4785 t.firstElementChild.toggleAttribute("hidden", i), 4786 t.lastElementChild.toggleAttribute("hidden", !i), 4787 console.log(this.indexOrder, e, getterGet(_items_compare_color, this)), 4788 i ? (--this.indexOrder, 4789 getterGet(_items_compare_color, this)[e].setAttribute("hidden", "")) : (++this.indexOrder, 4790 getterGet(_items_compare_color, this)[e].removeAttribute("hidden"), 4791 getterGet(_items_compare_color, this)[e].style.order = this.indexOrder) 4792} 4793, 4794customElements.define("hdt-compare-color-toogle", CompareToogle); 4795class closeAnnounce extends HTMLButtonElement { 4796 constructor() { 4797 super(), 4798 "true" !== sessionStorage.getItem(announceSize) ? this.addEventListener("click", (t=>{ 4799 Shopify.designMode || sessionStorage.setItem(announceSize, "true"); 4800 let e = this.closest(".hdt-section-group"); 4801 e.style.setProperty("overflow", "hidden"), 4802 animate(e, { 4803 height: [`${e.clientHeight}px`, "0px"] 4804 }).finished.then((()=>{ 4805 e.classList.add("hdt-announcement-hidden"), 4806 announceSize = null 4807 } 4808 )) 4809 } 4810 )) : announceSize = null 4811 } 4812} 4813customElements.define("hdt-close-announce", closeAnnounce, { 4814 extends: "button" 4815}), 4816(()=>{ 4817 const t = "hdt-reveal" 4818 , e = t + "--offscreen" 4819 , i = t + "--cancel" 4820 , n = t=>{ 4821 const e = t.target; 4822 e.isAnimationend && (e.setAttribute("animationend", ""), 4823 e.removeEventListener("animationend", n)) 4824 } 4825 ; 4826 function s(t, s) { 4827 t.forEach(((t,r)=>{ 4828 const a = t.target; 4829 a.setAttribute("observed", ""), 4830 t.isIntersecting ? (a.classList.contains(e) && (a.classList.remove(e), 4831 a.hasAttribute("timeline") && a.style.setProperty("--animation-order", r)), 4832 s.unobserve(a)) : (a.classList.add(e), 4833 a.classList.remove(i)), 4834 a.isAnimationend = !0, 4835 a.addEventListener("animationend", n) 4836 } 4837 )) 4838 } 4839 function r(e=document, i=!1) { 4840 const n = $$4(`[${t}]:not([observed])`, e); 4841 if (0 === n.length) 4842 return; 4843 if (i)
4844 return void n.forEach((e=>{ 4845 e.classList.add(t + "--design-mode") 4846 } 4847 )); 4848 const r = new IntersectionObserver(s,{ 4849 rootMargin: "0px 0px -50px 0px" 4850 }); 4851 n.forEach((t=>r.observe(t))) 4852 } 4853 themeHDN.settings.revealInView && matchMedia("motion") && (html.classList.add("hdt-reveal-in-view"), 4854 window.addEventListener("DOMContentLoaded", (()=>r())), 4855 Shopify.designMode && (document.addEventListener(adnmEvts.seLoad, (t=>r(t.target, !0))), 4856 document.addEventListener(adnmEvts.seReorder, (()=>r(document, !0))))); 4857 const a = ()=>{ 4858 const t = window.innerWidth - document.body.clientWidth; 4859 t >= 0 && html.style.setProperty("--scrollbar-w", `${t}px`); 4860 const e = $4("#MainContent .hdt-section"); 4861 if (!e) 4862 return; 4863 const i = $4(".md\\:hdt-height--full, .hdt-height--full", e); 4864 i && i.offsetTop < window.innerHeight && e.style.setProperty("--fill-height-first", 100 - i.offsetTop / (window.innerHeight / 100) + "vh") 4865 } 4866 ; 4867 (a(), 4868 window.addEventListener("resize", throttle(a)), 4869 _matchMedia("supports-hover")) && $$4(".hdt-btn-effect-3d").forEach((t=>{ 4870 t.addEventListener("mousemove", (function(e) { 4871 const i = t.getBoundingClientRect() 4872 , n = e.clientX - i.left - i.width / 2 4873 , s = e.clientY - i.top - i.height / 2; 4874 t.style.transform = "translate(" + .15 * n + "px, " + .3 * s + "px)", 4875 t.style.transform += "rotate3d(" + -.1 * n + ", " + -.3 * s + ", 0, 12deg)", 4876 t.children[0] && (t.children[0].style.transition = "all .2s linear", 4877 t.children[0].style.transform = "translate(" + .07 * n + "px, " + .14 * s + "px)") 4878 } 4879 )), 4880 t.addEventListener("mouseleave", (function() { 4881 t.style.transform = "translate3d(0px, 0px, 0px)", 4882 t.style.transform += "rotate3d(0, 0, 0, 0deg)", 4883 t.children[0] && (t.children[0].style.transform = "translate3d(0px, 0px, 0px)") 4884 } 4885 )) 4886 } 4887 )) 4888} 4889)(); 4890export {$4, $$4, $id4, getterAdd, getterGet, getterRunFn, isRTL, getUID, throttle, debounce, formatMoney, btnTooltip, _matchMedia, cachedFetch, Drawer, VariantChangeBase};
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.