1(function(){if(customElements.get("ce-toaster")!==void 0&&customElements.get("ce-toast")!==void 0)return;class Toaster extends HTMLParsedElement{constructor(){super(),this.translateYOffset=null}parsedCallback(){this.initMediaQuery()}initMediaQuery(){const mediaQuery=window.matchMedia("(min-width: 768px)"),handleChangeMediaQuery=()=>{mediaQuery.matches?this.translateYOffset="16px":this.translateYOffset="-16px"};handleChangeMediaQuery(),mediaQuery.addEventListener("change",handleChangeMediaQuery)}makeToast(type,content,duration=3e3){const toast=document.createElement("ce-toast");toast.setAttribute("duration",duration),toast.setAttribute("offset",this.translateYOffset),toast.className="bg-background block mb-4 opacity-0 pointer-events-auto pl-4 pr-11 py-4 relative rounded-other shadow-toast w-1/1",toast.innerHTML=` 2 <output class="flex"> 3 <div class="flex-none pr-2"> 4 <div class="h-5 w-5"> 5 <svg viewBox="0 0 20 20" width="20"> 6 <use href="#icon-${type}-${Themu.settings.iconStyle}"></use> 7 </svg> 8 </div> 9 </div> 10 <div class="flex-1 pl-2"> 11 <p class="text-body-text text-sm"> 12 ${content} 13 </p> 14 </div> 15 </output> 16 <button 17 class="button button--square absolute -right-0.5 top-0.5 px-4.5 text-body-text" 18 tabindex="-1" 19 aria-hidden="true" 20 data-toast-button-dismiss 21 > 22 <svg viewBox="0 0 20 20" width="12"> 23 <use href="#icon-close-${Themu.settings.iconStyle}"></use> 24 </svg> 25 </button> 26 `,this.appendChild(toast)}}class Toast extends HTMLParsedElement{constructor(){super(),this.selectors={buttonDismiss:"[data-toast-button-dismiss]"},this.elements=null,this.duration=null,this.translateYOffset=null,this.animation=null,this.handleClickButtonDismiss=this.handleClickButtonDismiss.bind(this),this.handleMouseEnter=this.handleMouseEnter.bind(this),this.handleMouseLeave=this.handleMouseLeave.bind(this)}parsedCallback(){this.elements={buttonDismiss:this.querySelector(this.selectors.buttonDismiss)},this.duration=parseInt(this.getAttribute("duration")),this.translateYOffset=this.getAttribute("offset"),this.elements.buttonDismiss.addEventListener("click",this.handleClickButtonDismiss),this.addEventListener("mouseenter",this.handleMouseEnter),this.addEventListener("mouseleave",this.handleMouseLeave),this.createStartAnimation()}disconnectedCallback(){this.elements.buttonDismiss.removeEventListener("click",this.handleClickButtonDismiss),this.removeEventListener("mouseenter",this.handleMouseEnter),this.removeEventListener("mouseleave",this.handleMouseLeave)}createStartAnimation(){const keyframes=[{opacity:0,transform:`translateY(${this.translateYOffset})`,offset:0},{opacity:1,offset:.5},{opacity:1,transform:"translateY(0)",offset:1}],options={duration:Themu.prefersReducedMotion?0:300,easing:Themu.animation.easeIn,fill:"both"};this.animation=this.animate(keyframes,options),this.animation.addEventListener("finish",()=>{this.animation.commitStyles(),this.animation.cancel(),this.createMiddleAnimation()})}createMiddleAnimation(){const keyframes=[{opacity:1,transform:"translateY(0)",offset:0},{opacity:1,transform:"translateY(0)",offset:1}],options={duration:this.duration,fill:"both"};this.animation=this.animate(keyframes,options),this.animation.addEventListener("finish",()=>{this.animation.commitStyles(),this.animation.cancel(),this.createFinishAnimation()})}createFinishAnimation(){const keyframes=[{opacity:1,transform:"translateY(0)",offset:0},{opacity:0,offset:.5},{opacity:0,transform:`translateY(${this.translateYOffset})`,offset:1}],options={duration:Themu.prefersReducedMotion?0:300,easing:Themu.animation.easeOut,fill:"both"};this.animation=this.animate(keyframes,options),this.animation.addEventListener("finish",()=>{this.animation.commitStyles(),this.animation.cancel(),this.remove()})}handleClickButtonDismiss(){this.animation.cancel(),this.createFinishAnimation()}handleMouseEnter(){this.animation.pause()}handleMouseLeave(){this.animation.play()}}customElements.define("ce-toaster",Toaster),customElements.define("ce-toast",Toast)})(); 27//# sourceMappingURL=/cdn/shop/t/10/assets/ce-toaster.js.map?v=86659724044536918351728913784
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.