1import{NotificationManager}from"@theme/notification-manager";class NotificationsComponent{constructor(hostElement){this.host=hostElement,this.notificationManager=NotificationManager.getInstance(),this.state={queue:new Map},this.notificationManager.subscribe(this.onStateChange.bind(this))}onStateChange(queue){this.state.queue=queue,this.render(),this.onRender()}render(){this.host.innerHTML="",this.state.queue.forEach((item,id)=>{const notificationEl=document.createElement("div");notificationEl.className=`notification notification--${item.type} notification--${id}`;const titleSpan=document.createElement("span");titleSpan.className="notification__title f-body-2 f-alpha",titleSpan.textContent=item.title;const messageSpan=document.createElement("span");messageSpan.className="notification__message f-body-2",messageSpan.textContent=item.message,notificationEl.appendChild(titleSpan),notificationEl.appendChild(messageSpan),this.host.appendChild(notificationEl)})}onRender(){if(!this.state.queue||!this.state.queue.size)return;new Map(Array.from(this.state.queue.entries()).filter(([_,item])=>!item.isOpen)).forEach((item,id)=>{this.animateNotification(item,id)})}animateNotification(notification,id){const target=this.host.querySelector(`.notification--${id}`);if(target)if(this.state.queue.get(id).isOpen=!0,window.gsap){const tl=window.gsap.timeline({onComplete:()=>{this.notificationManager.delete(id)}});tl.to(target,{x:0,autoAlpha:1,duration:.33,ease:"power2.out"}),tl.to(target,{x:300,autoAlpha:0,duration:.33,ease:"power2.in"},`+=${notification.duration}`)}else requestAnimationFrame(()=>{target.style.transition="transform 0.33s ease-out, opacity 0.33s ease-out",target.style.transform="translateX(0)",target.style.opacity="1",target.style.visibility="visible"}),setTimeout(()=>{target.style.transition="transform 0.33s ease-in, opacity 0.33s ease-in",target.style.transform="translateX(300px)",target.style.opacity="0",setTimeout(()=>{this.notificationManager.delete(id)},330)},notification.duration*1e3)}}function initNotifications(){const notificationsEl=document.querySelector("notifications");notificationsEl&&(window.notificationsComponent=new NotificationsComponent(notificationsEl))}document.readyState==="loading"?document.addEventListener("DOMContentLoaded",initNotifications):initNotifications(),document.addEventListener("shopify:section:load",initNotifications);export{NotificationsComponent}; 2//# sourceMappingURL=/cdn/shop/t/468/assets/notifications-component.js.map?v=148669501659598187241788452602
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.