https://www.mustela.tw/cdn/shop/t/4/assets/ClrzNotifications.min.MZoYTyNL.js

1import{D as n}from"./DeferWebComponent.min.BrKhvwE6.js";class c extends n{constructor(){super(),this.btnsOpen=[...document.querySelectorAll("[data-clrz-notifications-open]")],this.btnsClose=[...document.querySelectorAll("[data-clrz-notifications-close]")],this.popinContainer=document.querySelector("[data-clrz-notifications-popin-container]"),this.cards=[...document.querySelectorAll("[data-clrz-notifications-card]")],this.popins=[...document.querySelectorAll("[data-clrz-notifications-popin]")],this.notificationBadge=document.querySelector("[data-clrz-notifications-badge]"),this.elCardRead=[...document.querySelectorAll("[data-clrz-notifications-card-not-read]")],this.elALinks=[...document.querySelectorAll("a[data-clrz-link-card]")],this.elCardTitles=[...document.querySelectorAll("[data-clrz-notifications-card-title]")],this.lastScrollTop=0,this.wasOpen=!1,this.cardRead=[],this.isMobile=window.matchMedia("(max-width: 767px)").matches,this.focusableEls=[],this.firstFocusableEl=null,this.lastFocusableEl=null,this.previouslyFocusedEl=null}ready(){var t;this.cards.length>0&&this.notificationBadge.classList.remove("u-opacity-0"),this.btnsOpen.forEach(e=>{e.addEventListener("click",this.toggleNotifications.bind(this))}),this.btnsClose.forEach(e=>{e.addEventListener("click",this.toggleNotifications.bind(this))}),this.elALinks.forEach(e=>{e.addEventListener("click",i=>this.manageLink(i,e))}),this.isMobile&&document.addEventListener("click",e=>this.manageCloseMobile(e)),this.cardRead=((t=localStorage.getItem("card-read"))==null?void 0:t.split(","))||[],this.markAsRead(),this.updateOpenButtonsAriaLabel(),window.addEventListener("scroll",this.handleScroll.bind(this)),document.addEventListener("keydown",this.handleKeydown.bind(this)),this.setAttribute("role","dialog"),this.setAttribute("aria-modal","true"),this.setAttribute("aria-hidden","true"),this.toggleAttribute("inert",!0),this.setAttribute("aria-label",this.elCardTitles.map(e=>e.getAttribute("data-clrz-notifications-card-title")))}toggleNotifications(t=void 0){const i=!(t===!1)&&!this.classList.contains("is-open");this.classList.toggle("is-open",i),this.setAttribute("aria-hidden",i?"false":"true"),this.toggleAttribute("inert",!i),this.style.height=i?"auto":"0px",this.headerHeight=document.querySelector("header").getBoundingClientRect().bottom,this.notificationTop=i?Math.max(0,this.headerHeight):-this.getBoundingClientRect().bottom,this.style.top=`${this.notificationTop}px`,this.notifPosY=this.headerHeight+this.getBoundingClientRect().height,this.notifPosY>=window.innerHeight?(this.style.overflow="scroll",this.style.bottom="10px"):this.style.overflowY==="scroll"&&(this.style.overflowY="hidden",this.style.bottom="auto"),this.wasOpen=i,i?(this.previouslyFocusedEl=document.activeElement,this.trapFocus(),this.focusFirstElement(),this.disableScroll()):(this.releaseFocus(),this.enableScroll(),this.previouslyFocusedEl&&this.previouslyFocusedEl.focus()),i&&(this.cards.forEach(a=>{const s=a.getAttribute("data-clrz-notifications-card");!a.getAttribute("data-clrz-notifications-link")&&!this.cardRead.includes(s)&&this.cardRead.push(s)}),localStorage.setItem("card-read",this.cardRead),setTimeout(()=>this.markAsRead(),2500))}handleScroll(){const t=window.pageYOffset||document.documentElement.scrollTop;t>this.lastScrollTop&&this.classList.contains("is-open")&&this.toggleNotifications(!1),this.lastScrollTop=Math.max(t,0)}handleKeydown(t){t.key==="Escape"&&this.classList.contains("is-open")&&this.toggleNotifications(!1),t.key==="Tab"&&this.classList.contains("is-open")&&this.handleTabKey(t)}trapFocus(){this.focusableEls=Array.from(this.querySelectorAll('a[href], button:not([disabled]), textarea, input, select, [tabindex]:not([tabindex="-1"])')),this.firstFocusableEl=this.focusableEls[0],this.lastFocusableEl=this.focusableEls[this.focusableEls.length-1]}releaseFocus(){this.focusableEls=[],this.firstFocusableEl=null,this.lastFocusableEl=null}handleTabKey(t){this.focusableEls.length!==0&&(t.shiftKey&&document.activeElement===this.firstFocusableEl?(t.preventDefault(),this.lastFocusableEl.focu

1s()):!t.shiftKey&&document.activeElement===this.lastFocusableEl&&(t.preventDefault(),this.firstFocusableEl.focus()))}focusFirstElement(){this.firstFocusableEl&&this.firstFocusableEl.focus()}disableScroll(){document.body.style.overflow="hidden"}enableScroll(){document.body.style.overflow=""}markAsRead(){this.cardRead.forEach(t=>{var e;(e=this.querySelector(`[data-clrz-notifications-card-not-read="${t}"]`))==null||e.setAttribute("hidden",!0)}),this.checkAllNotificationsRead()}checkAllNotificationsRead(){this.elCardRead.every(e=>e.hasAttribute("hidden"))&&this.notificationBadge.setAttribute("hidden",!0),this.updateOpenButtonsAriaLabel()}updateOpenButtonsAriaLabel(){var s,l;const t=(s=this.btnsOpen[0])==null?void 0:s.getAttribute("data-clrz-notifications-label-new"),e=(l=this.btnsOpen[0])==null?void 0:l.getAttribute("data-clrz-notifications-label-none");if(!t||!e)return;const a=this.cards.length>0&&this.notificationBadge&&!this.notificationBadge.hasAttribute("hidden")?t:e;this.btnsOpen.forEach(o=>o.setAttribute("aria-label",a))}manageLink(t,e){t.preventDefault();const i=e.getAttribute("data-clrz-link-card");this.cardRead.includes(i)||(this.cardRead.push(i),localStorage.setItem("card-read",this.cardRead)),window.location.href=e.getAttribute("href")}manageCloseMobile(t){this.clickOutside=t.target.closest("clrz-notifications")==null,this.clickonBell=t.target.closest("[data-clrz-notifications-open]")!==null,this.isOpen=this.classList.contains("is-open"),this.clickOutside&&this.isOpen&&!this.clickonBell&&this.toggleNotifications(!1)}}customElements.define("clrz-notifications",c);export{c as default};
2//# sourceMappingURL=ClrzNotifications.min.MZoYTyNL.js.map