"use strict";(self.webpackChunkUmbracoVuePrototype=self.webpackChunkUmbracoVuePrototype||[]).push([[1089],{4865:(t,i,e)=>{e.d(i,{Z:()=>r});var n=e(7537),o=e.n(n),s=e(3645),a=e.n(s)()(o());a.push([t.id,".watchlist-overlay{position:fixed;z-index:10;bottom:0;overflow:visible !important}.watchlist-overlay .watchlist-button-container{position:relative;display:flex;align-items:center;justify-content:center}.watchlist-overlay .watchlist-button-container button{padding:0px !important;animation:width 1s,height 1s,opacity 1s;line-height:1}.watchlist-overlay .watchlist-button-container button span{transition:font-size .15s;font-size:100%}.watchlist-overlay .watchlist-button-container button .iconEnlarged{font-size:140%}@media(max-width: 991px){.watchlist-overlay .watchlist-button-container{position:relative;width:var(--containerMobileWidth);height:var(--containerMobileHeight)}.watchlist-overlay .watchlist-button-container button{width:var(--mobileWidth);height:var(--mobileHeight);font-size:var(--mobileSize)}}@media(min-width: 992px){.watchlist-overlay .watchlist-button-container{position:relative;width:var(--containerDesktopWidth);height:var(--containerDesktopHeight)}.watchlist-overlay .watchlist-button-container button{width:var(--desktopWidth);height:var(--desktopHeight);font-size:var(--desktopSize)}}","",{version:3,sources:["webpack://./Scripts/src/vue-components/_overlays/watchlist/style.scss"],names:[],mappings:"AAAA,mBACE,cAAA,CACA,UAAA,CACA,QAAA,CACA,2BAAA,CACA,+CACE,iBAAA,CACA,YAAA,CACA,kBAAA,CACA,sBAAA,CACA,sDACE,sBAAA,CACA,uCAAA,CACA,aAAA,CACA,2DACE,yBAAA,CACA,cAAA,CAEF,oEACE,cAAA,CAIN,yBACE,+CACE,iBAAA,CACA,iCAAA,CACA,mCAAA,CACA,sDACE,wBAAA,CACA,0BAAA,CACA,2BAAA,CAAA,CAIN,yBACE,+CACE,iBAAA,CACA,kCAAA,CACA,oCAAA,CACA,sDACE,yBAAA,CACA,2BAAA,CACA,4BAAA,CAAA",sourcesContent:[".watchlist-overlay {\r\n  position: fixed;\r\n  z-index: 10;\r\n  bottom: 0;\r\n  overflow: visible !important;\r\n  .watchlist-button-container {\r\n    position: relative;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    button {\r\n      padding: 0px !important;\r\n      animation: width 1s, height 1s, opacity 1s;\r\n      line-height: 1;\r\n      span {\r\n        transition: font-size 0.15s;\r\n        font-size: 100%;\r\n      }\r\n      .iconEnlarged {\r\n        font-size: 140%;\r\n      }\r\n    }\r\n  }\r\n  @media (max-width: 991px) {\r\n    .watchlist-button-container {\r\n      position: relative;\r\n      width: var(--containerMobileWidth);\r\n      height: var(--containerMobileHeight);\r\n      button {\r\n        width: var(--mobileWidth);\r\n        height: var(--mobileHeight);\r\n        font-size: var(--mobileSize);\r\n      }\r\n    }\r\n  }\r\n  @media (min-width: 992px) {\r\n    .watchlist-button-container {\r\n      position: relative;\r\n      width: var(--containerDesktopWidth);\r\n      height: var(--containerDesktopHeight);\r\n      button {\r\n        width: var(--desktopWidth);\r\n        height: var(--desktopHeight);\r\n        font-size: var(--desktopSize);\r\n      }\r\n    }\r\n  }\r\n}\r\n"],sourceRoot:""}]);const r=a},8159:(t,i,e)=>{e.d(i,{Z:()=>h});var n=e(655),o=e(6252),s=e(4437);class a{constructor(t){this.animationEnable=(0,s.G)().boolean(t.animationEnable,!1),this.animationAlwaysRunOnLoad=(0,s.G)().boolean(t.animationAlwaysRunOnLoad,!1),this.animationDelay=(0,s.G)().number(t.animationDelay,.2),this.animationDuration=(0,s.G)().number(t.animationDuration,.3),this.animationDirection=(0,s.G)().string(t.animationDirection,"bottom")}}var r=e(4572);const h=(0,o.aZ)({data:()=>({backgroundUrl:"",componentModel:{},componentWidth:0,isDesktopSize:!0,themeId:"",elementContainer:{},entryAnimations:{},entryAnimationStyle:{},loadState:{},observer:{},observerFirstRun:!0}),watch:{loadState(t,i){1==t&&this.entryAnimations.animationEnable&&this.setupEntryAnimationObserver(this.runEntryAnimations)}},beforeUnmount:function(){window.removeEventListener("resize",this.handleResize)},mounted(){const t=this.$el.parentElement.getAttribute("umbracomodel");this.componentModel="null"!==t&&null!=t?JSON.parse(t):{},this.componentModel.entryAnimations||(this.componentModel.entryAnimations={}),this.initiateEntryAnimations(),this.elementContainer=this.$el.closest(".component-margins");const i=window.innerWidth;this.initiateMargins(i),this.initiatePadding(i),this.initiateHeight(),this.initiateResizeListener(),(0,r.y)().addLoadedModule(),this.loadState=(0,r.y)().getLoadState()},onUnmounted(){if(this.entryAnimations.animationEnable)try{this.observer.unobserve(this.elementContainer)}catch(t){}},methods:{delay(t){return(0,n.mG)(this,void 0,void 0,(function*(){return new Promise((i=>setTimeout(i,t)))}))},handleResize(t){this.componentWidth=this.$el.clientWidth,this.resizeWindow()},resizeWindow(){const t=window.innerWidth;t>991!==this.isDesktopSize&&(this.initiateMargins(t),this.initiatePadding(t),this.calculateSize(t))},initiateResizeListener(){window.addEventListener("resize",this.handleResize),this.$el&&(this.componentWidth=this.$el.clientWidth);const t=window.innerWidth;this.calculateSize(t)},calculateSize(t){this.isDesktopSize=t>991},initiateMargins(t){t>991?this.setMargins(this.componentModel.moduleMargin):this.setMargins(this.componentModel.moduleMarginMobile)},initiatePadding(t){t>991?this.setPadding(this.componentModel.modulePadding):this.setPadding(this.componentModel.modulePaddingMobile)},setMargins(t){null!==this.elementContainer&&t&&(this.elementContainer.style.marginTop=t.top?(0,s.G)().size(t.top,"0px"):"0px",this.elementContainer.style.marginBottom=t.bottom?(0,s.G)().size(t.bottom,"0px"):"0px",this.elementContainer.style.marginLeft=t.left?(0,s.G)().size(t.left,"0px"):"0px",this.elementContainer.style.marginRight=t.right?(0,s.G)().size(t.right,"0px"):"0px")},setPadding(t){null!==this.elementContainer&&t&&(this.elementContainer.style.paddingTop=t.top?(0,s.G)().size(t.top,"0px"):"0px",this.elementContainer.style.paddingBottom=t.bottom?(0,s.G)().size(t.bottom,"0px"):"0px",this.elementContainer.style.paddingLeft=t.left?(0,s.G)().size(t.left,"0px"):"0px",this.elementContainer.style.paddingRight=t.right?(0,s.G)().size(t.right,"0px"):"0px")},initiateHeight(){if(null!==this.elementContainer){let t;t=this.componentModel.moduleHeight?(0,s.G)().size(this.componentModel.moduleHeight,"auto"):"auto",this.elementContainer.style.height=t,(t.includes("vh")||t.includes("vmax"))&&(this.elementContainer.style.maxHeight="2300px"),this.elementContainer.style.overflow="hidden"}},initiateEntryAnimations(){if(this.entryAnimations=new a(this.componentModel.entryAnimations),this.entryAnimations.animationEnable)switch(this.entryAnimationStyle.opacity="0!important",this.entryAnimations.animationDirection){case"bottom":this.entryAnimationStyle.bottom="-20vh";break;case"top":this.entryAnimationStyle.top="-20vh";break;case"left":this.entryAnimationStyle.left="-20vw";break;case"right":this.entryAnimationStyle.right="-20vw"}},setupEntryAnimationObserver(){return(0,n.mG)(this,void 0,void 0,(function*(){this.entryAnimations.animationAlwaysRunOnLoad&&(this.observerFirstRun=!1),this.observer=new IntersectionObserver((t=>{t[0].isIntersecting&&this.runEntryAnimations(),this.observerFirstRun=!1}),{threshold:[.3]}),this.observer.observe(this.elementContainer)}))},runEntryAnimations(){return(0,n.mG)(this,void 0,void 0,(function*(){switch(this.observerFirstRun?this.entryAnimationStyle.transition="none!important":this.entryAnimationStyle.transition="opacity "+this.entryAnimations.animationDuration+"s ease-in-out "+this.entryAnimations.animationDelay+"s,bottom "+this.entryAnimations.animationDuration+"s ease-in-out "+this.entryAnimations.animationDelay+"s,top "+this.entryAnimations.animationDuration+"s ease-in-out "+this.entryAnimations.animationDelay+"s,left "+this.entryAnimations.animationDuration+"s ease-in-out "+this.entryAnimations.animationDelay+"s,right "+this.entryAnimations.animationDuration+"s ease-in-out "+this.entryAnimations.animationDelay+"s",this.entryAnimationStyle.opacity="1",this.entryAnimations.animationDirection){case"bottom":this.entryAnimationStyle.bottom="0px";break;case"top":this.entryAnimationStyle.top="-0px";break;case"left":this.entryAnimationStyle.left="-0px";break;case"right":this.entryAnimationStyle.right="-0px"}this.observer.unobserve(this.elementContainer);try{let t=this.entryAnimations.animationDuration+this.entryAnimations.animationDelay;yield this.delay(1e3*t),this.entryAnimationStyle={}}catch(t){this.entryAnimationStyle={},console.log("Core mixin addition failed.")}}))}}})},1089:(t,i,e)=>{e.r(i),e.d(i,{default:()=>z});var n=e(6252),o=e(3577);var s=e(655),a=e(196),r=e(1162),h=e(8159),l=e(4437);class d{constructor(t){this.buttonStyle=(0,l.G)().string(t.buttonStyle,"Default"),this.buttonStyle="b"+this.buttonStyle,this.desktopWidth=(0,l.G)().string(t.desktopWidth,"75px"),this.desktopHeight=(0,l.G)().string(t.desktopHeight,"75px"),this.desktopSize=(0,l.G)().string(t.desktopSize,"30px"),this.mobileWidth=(0,l.G)().string(t.mobileWidth,"50px"),this.mobileHeight=(0,l.G)().string(t.mobileHeight,"50px"),this.mobileSize=(0,l.G)().string(t.mobileSize,"20px"),this.buttonPos=(0,l.G)().string(t.buttonPos,"r")}}const m=(0,n.aZ)({mixins:[h.Z],setup:()=>({watchlistState:(0,r.z)().state()}),data:()=>({typedModel:{},watchlistRedirectLink:"",containerStyle:{},positionStyle:{},iconAnimationState:!1,previousWatchlistLength:-1}),computed:{buttonStyle:function(){return this.watchlistState.list.length>0?{"--desktopWidth":this.typedModel.desktopWidth,"--desktopHeight":this.typedModel.desktopHeight,"--desktopSize":this.typedModel.desktopSize,"--mobileWidth":this.typedModel.mobileWidth,"--mobileHeight":this.typedModel.mobileHeight,"--mobileSize":this.typedModel.mobileSize,opacity:1}:{"--desktopWidth":"0px","--desktopHeight":"0px","--desktopSize":"0px","--mobileWidth":"0px","--mobileHeight":"0px","--mobileSize":"0px",opacity:0}},iconAnimationClass:function(){const t=this.watchlistState.list.length;return this.previousWatchlistLength!==t&&(this.iconAnimationState=!0,this.previousWatchlistLength=t),this.iconAnimationState?(this.flipAnimationState(),"iconEnlarged"):""}},beforeMount(){this.typedModel=new d(this.componentModel)},mounted(){this.typedModel=new d(this.componentModel),this.initiateLink(),this.initiateContainerStyle(),"r"===this.typedModel.buttonPos&&(this.positionStyle={right:0})},methods:{initiateLink(){this.watchlistRedirectLink=(0,a.T)().get("watchlistRedirect")},initiateContainerStyle(){this.containerStyle={"--containerDesktopWidth":this.typedModel.desktopWidth,"--containerDesktopHeight":this.typedModel.desktopHeight,"--containerMobileWidth":this.typedModel.mobileWidth,"--containerMobileHeight":this.typedModel.mobileHeight}},redirectToWishlist(){window.location.href=this.watchlistRedirectLink},flipAnimationState(){return(0,s.mG)(this,void 0,void 0,(function*(){yield this.delay(100),this.iconAnimationState=!1}))}}});var A=e(3379),c=e.n(A),p=e(7795),y=e.n(p),u=e(569),b=e.n(u),g=e(3565),C=e.n(g),v=e(9216),w=e.n(v),S=e(4589),f=e.n(S),k=e(4865),x={};x.styleTagTransform=f(),x.setAttributes=C(),x.insert=b().bind(null,"head"),x.domAPI=y(),x.insertStyleElement=w();c()(k.Z,x);k.Z&&k.Z.locals&&k.Z.locals;const z=(0,e(3744).Z)(m,[["render",function(t,i,e,s,a,r){return(0,n.wg)(),(0,n.iD)("div",{class:"watchlist-overlay component-margins",style:(0,o.j5)(t.positionStyle)},[(0,n._)("div",{class:"watchlist-button-container",style:(0,o.j5)(t.containerStyle)},[(0,n._)("button",{name:"Shortlist",style:(0,o.j5)(t.buttonStyle),class:(0,o.C_)(t.typedModel.buttonStyle),onClick:i[0]||(i[0]=(...i)=>t.redirectToWishlist&&t.redirectToWishlist(...i))},[(0,n._)("span",{class:(0,o.C_)(["icon-star",t.iconAnimationClass])},null,2)],6)],4)],4)}]])}}]);
//# sourceMappingURL=source-maps-1.2/1089.df1aa74f6c2b57f505c3.map