https://www.xdconnects.com/static/js/cb-media-gallery.d53d2062.chunk.js

1(window.__LOADABLE_LOADED_CHUNKS__=window.__LOADABLE_LOADED_CHUNKS__||[]).push([[37],{"/Scy":function(e,t,a){e.exports=a("B1SK").wrapCssModule(e.i,a("S8QS"))},HKdb:function(e,t,a){e.exports=a("B1SK").wrapCssModule(e.i,a("PFbN"))},PFbN:function(e,t,a){(t=e.exports=a("I1BE")(!1)).push([e.i,".Thumbnails_thumbnails{margin:1em 0 0;overflow:hidden;padding:0 30px;text-align:center}.Thumbnails_cnt{display:inline-block;position:relative;vertical-align:bottom}.Thumbnails_cnt .Thumbnails_swipe-area>.Thumbnails_wrapper{overflow:hidden;width:100%}.Thumbnails_list{list-style:none;margin:0;padding:0;transition:-webkit-transform .3s;transition:transform .3s;transition:transform .3s,-webkit-transform .3s;white-space:nowrap}.Thumbnails_nav-controls{margin:0;visibility:hidden}.Thumbnails_nav-controls button{align-items:center;-webkit-appearance:textfield;background:none;border:none;bottom:1px;color:var(--theme-link_Color,#1f7bc9);cursor:pointer;display:flex;margin:0;outline-offset:-1px;padding:0;position:absolute;top:1px}@supports(-webkit-hyphens:none){.Thumbnails_nav-controls button{outline-offset:-5px}}.Thumbnails_nav-controls button .Thumbnails_icon-wrapper{display:inline-block;transition:-webkit-transform .15s;transition:transform .15s;transition:transform .15s,-webkit-transform .15s}.Thumbnails_nav-controls button .Thumbnails_icon{max-height:14px;max-width:14px}.Thumbnails_nav-controls button[disabled]{color:var(--theme-link_Disabled_Color,#b2b2b2)}.Thumbnails_nav-controls button.Thumbnails_next{left:100%;padding-left:8px;padding-right:5px}.Thumbnails_nav-controls button.Thumbnails_prev{padding-left:5px;padding-right:8px;right:100%}html.pointer-mouse .Thumbnails_nav-controls button:hover.Thumbnails_next:not([disabled]) .Thumbnails_icon-wrapper{-webkit-transform:translateX(5px);transform:translateX(5px)}html.pointer-mouse .Thumbnails_nav-controls button:hover.Thumbnails_prev:not([disabled]) .Thumbnails_icon-wrapper{-webkit-transform:translateX(-5px);transform:translateX(-5px)}@supports(not (-webkit-hyphens:none)) and (not (-moz-appearance:none)) and (list-style-type:\"*\"){@media(pointer:coarse){html:not(.pointer-mouse) .Thumbnails_nav-controls button:active.Thumbnails_next:not([disabled]) .Thumbnails_icon-wrapper{-webkit-transform:translateX(5px);transform:translateX(5px)}html:not(.pointer-mouse) .Thumbnails_nav-controls button:active.Thumbnails_prev:not([disabled]) .Thumbnails_icon-wrapper{-webkit-transform:translateX(-5px);transform:translateX(-5px)}}}.Thumbnails_thumbnail{box-sizing:initial;display:inline-flex;vertical-align:top}.Thumbnails_thumbnail button{-webkit-appearance:textfield;background:none;border:none;cursor:pointer;height:25px;outline-offset:1px;width:25px}.Thumbnails_thumbnail button img{display:none}.Thumbnails_thumbnail button .Thumbnails_icon{display:block;margin:7px;max-height:11px;max-width:11px}.Thumbnails_thumbnail button svg.Thumbnails_icon{background-color:var(--thumbnails-dotsColor,var(--theme-button_Hover_BackgroundColor,#2289e3));border-radius:50%;color:var(--thumbnails-dotsColor,var(--theme-button_Hover_BackgroundColor,#2289e3));opacity:.7}html.pointer-mouse .Thumbnails_thumbnail button svg.Thumbnails_icon:hover{background-color:var(--thumbnails-dotsActiveColor,var(--theme-button_BackgroundColor,#1f7bc9));color:var(--thumbnails-dotsActiveColor,var(--theme-button_BackgroundColor,#1f7bc9));opacity:1}@supports(not (-webkit-hyphens:none)) and (not (-moz-appearance:none)) and (list-style-type:\"*\"){@media(pointer:coarse){html:not(.pointer-mouse) .Thumbnails_thumbnail button svg.Thumbnails_icon:active{background-color:var(--thumbnails-dotsActiveColor,var(--theme-button_BackgroundColor,#1f7bc9));color:var(--thumbnails-dotsActiveColor,var(--theme-button_BackgroundColor,#1f7bc9));opacity:1}}}.Thumbnails_thumbnail.active button .Thumbnails_icon{color:var(--thumbnails-dotsActiveColor,var(--theme-button_BackgroundColor,#1f7bc9));margin:6px;max-height:13px;max-width:13px;opacity:1}.Thumbnails_thumbnails-as-images .Thumbnails_thumbnails{margin:2em 0 0;padding:0 20px}

1.Thumbnails_thumbnails-as-images .Thumbnails_nav-controls button .Thumbnails_icon{max-height:25px;max-width:25px}.Thumbnails_thumbnails-as-images .Thumbnails_nav-controls button.Thumbnails_next{padding-left:0}.Thumbnails_thumbnails-as-images .Thumbnails_nav-controls button.Thumbnails_prev{padding-right:0}.Thumbnails_thumbnails-as-images .Thumbnails_thumbnail.active button{border-color:var(--thumbnails-activeBorderColor,var(--theme-thumbnail_Active_BorderColor,#1f7bc9))}.Thumbnails_thumbnails-as-images .Thumbnails_thumbnail button{border-color:var(--thumbnails-borderColor,var(--theme-borderColor,#e6e6e6));border-radius:var(--thumbnails-cornerRadius);border-style:var(--thumbnails-borderStyle);border-width:var(--thumbnails-borderWidth);box-sizing:border-box;height:66px;margin:2px 14px;overflow:hidden;position:relative;transition:border-bottom-color .15s;width:66px}@supports(-webkit-hyphens:none){.Thumbnails_thumbnails-as-images .Thumbnails_thumbnail button{margin:4px}}.Thumbnails_thumbnails-as-images .Thumbnails_thumbnail button:before{content:normal;display:none}html.pointer-mouse .Thumbnails_thumbnails-as-images .Thumbnails_thumbnail button:hover{border-bottom-color:var(--thumbnails-activeBorderColor,var(--theme-thumbnail_Active_BorderColor,#1f7bc9))}html.pointer-mouse .Thumbnails_thumbnails-as-images .Thumbnails_thumbnail button:hover:after{height:2px}@supports(not (-webkit-hyphens:none)) and (not (-moz-appearance:none)) and (list-style-type:\"*\"){@media(pointer:coarse){html:not(.pointer-mouse) .Thumbnails_thumbnails-as-images .Thumbnails_thumbnail button:active{border-bottom-color:var(--thumbnails-activeBorderColor,var(--theme-thumbnail_Active_BorderColor,#1f7bc9))}html:not(.pointer-mouse) .Thumbnails_thumbnails-as-images .Thumbnails_thumbnail button:active:after{height:2px}}}.Thumbnails_thumbnails-as-images .Thumbnails_thumbnail button:after{background:var(--thumbnails-activeBorderColor,var(--theme-thumbnail_Active_BorderColor,#1f7bc9));bottom:0;content:\"\";display:block;height:0;left:0;pointer-events:none;position:absolute;right:0;transition:height .15s;z-index:2}.Thumbnails_thumbnails-as-images .Thumbnails_thumbnail button img{word-wrap:break-word;bottom:-100%;display:block;left:-100%;line-height:var(--theme-text_LineHeight,2);margin:auto;max-height:100%;max-width:100%;overflow:hidden;position:absolute;right:-100%;text-align:left;top:-100%;white-space:normal;z-index:1}.Thumbnails_thumbnails-as-images .Thumbnails_thumbnail button .Thumbnails_icon{display:none}.Thumbnails_video-icon-wrapper{align-items:center;bottom:0;display:flex;font-size:var(--theme-button_Big_Size,22px);justify-content:center;left:0;position:absolute;right:0;top:0;z-index:2}.Thumbnails_video-icon{fill:var(--theme-button_Color,#fff);max-height:1.5em;max-width:1.5em}.Thumbnails_virtual-view-icon{max-height:100%;max-width:100%}@media print{.Thumbnails_thumbnails{padding:0}.Thumbnails_nav-controls{display:none}}",""]),t.locals={thumbnailSize:"66",thumbnails:"Thumbnails_thumbnails",cnt:"Thumbnails_cnt","swipe-area":"Thumbnails_swipe-area",swipeArea:"Thumbnails_swipe-area",wrapper:"Thumbnails_wrapper",list:"Thumbnails_list","nav-controls":"Thumbnails_nav-controls",navControls:"Thumbnails_nav-controls","icon-wrapper":"Thumbnails_icon-wrapper",iconWrapper:"Thumbnails_icon-wrapper",icon:"Thumbnails_icon",next:"Thumbnails_next",prev:"Thumbnails_prev",thumbnail:"Thumbnails_thumbnail","thumbnails-as-images":"Thumbnails_thumbnails-as-images",thumbnailsAsImages:"Thumbnails_thumbnails-as-images","video-icon-wrapper":"Thumbnails_video-icon-wrapper",videoIconWrapper:"Thumbnails_video-icon-wrapper","video-icon":"Thumbnails_video-icon",videoIcon:"Thumbnails_video-icon","virtual-view-icon":"Thumbnails_virtual-view-icon",virtualViewIcon:"Thumbnails_virtual-view-icon"}},S8QS:function(e,t,a){(t=e.exports=a("I1BE")(!1)).push([e.i,".LargeGallery_slide{bottom:0;left:0;margin:auto;max-height:90%;max-width:calc(100% - 5rem);position:absolute;right:0;top:0}.LargeGallery_frame,.LargeGallery_slide:not(.LargeGallery_spinner):not(.LargeGallery_video-slide){background-color:var(--theme-page_Backgroun

1dColor,#fff);border:8px solid var(--theme-page_BackgroundColor,#fff);border-radius:3px}iframe.LargeGallery_slide{border:0;height:95%;width:95%}.LargeGallery_spinner,.LargeGallery_video-slide{align-items:center;display:flex;justify-content:center}.LargeGallery_video-slide{bottom:32px;pointer-events:none;top:16px}.LargeGallery_video-slide .LargeGallery_frame{pointer-events:auto}.LargeGallery_no-fixed-aspect-ratio{min-width:0;padding-bottom:0}@media (min-width:env(--theme-breakpoints_Medium,960)px),print{.LargeGallery_slide{max-width:calc(100% - 7rem)}.LargeGallery_frame,.LargeGallery_slide:not(.LargeGallery_spinner):not(.LargeGallery_video-slide){border-width:15px}}",""]),t.locals={slide:"LargeGallery_slide",frame:"LargeGallery_frame",spinner:"LargeGallery_spinner","video-slide":"LargeGallery_video-slide",videoSlide:"LargeGallery_video-slide","no-fixed-aspect-ratio":"LargeGallery_no-fixed-aspect-ratio",noFixedAspectRatio:"LargeGallery_no-fixed-aspect-ratio"}},eyRL:function(e,t,a){(t=e.exports=a("I1BE")(!1)).push([e.i,".MediaGallery_overlay{position:relative}.MediaGallery_media-gallery{min-width:70px;-webkit-user-select:none;user-select:none}.MediaGallery_media-gallery .MediaGallery_brand-image{margin-bottom:.75rem}.MediaGallery_media-gallery .MediaGallery_brand-image img{display:block;max-width:160px}.MediaGallery_preview-controls{display:none;text-align:center}.MediaGallery_preview-controls .MediaGallery_link{-webkit-appearance:textfield;background:none;border:none;color:var(--theme-link_Color,#1f7bc9);cursor:pointer;display:inline-block;line-height:1.6;margin:0;padding:0 .8em 0;transition:color .15s;white-space:normal}html.pointer-mouse .MediaGallery_preview-controls .MediaGallery_link:hover{color:var(--theme-link_Hover_Color,#2289e3);text-decoration:underline}@supports(not (-webkit-hyphens:none)) and (not (-moz-appearance:none)) and (list-style-type:\"*\"){@media(pointer:coarse){html:not(.pointer-mouse) .MediaGallery_preview-controls .MediaGallery_link:active{color:var(--theme-link_Hover_Color,#2289e3);text-decoration:underline}}}@supports(-webkit-hyphens:none){@media(pointer:coarse){.MediaGallery_preview-controls .MediaGallery_link:hover{-webkit-tap-highlight-color:var(--theme-link_Hover_Color,#2289e3)}}}.MediaGallery_preview-controls .MediaGallery_link:before{content:\"+ \"}.MediaGallery_preview-controls .MediaGallery_link-placeholder{display:inline-block;height:1.6em;vertical-align:bottom;width:16.6em}.MediaGallery_preview-controls[hidden]{visibility:hidden}.MediaGallery_overlap-gallery{bottom:0;display:block;left:0;position:absolute;right:0}@media (min-width:env(--theme-breakpoints_Small,600)px),print{.MediaGallery_media-gallery .MediaGallery_brand-image{margin-bottom:0;position:absolute;right:0;top:0;z-index:1}.MediaGallery_preview-controls{display:block;margin:2em 0}}.MediaGallery_thumbnails-as-images{/*!*/}",""]),t.locals={overlay:"MediaGallery_overlay","media-gallery":"MediaGallery_media-gallery",mediaGallery:"MediaGallery_media-gallery","brand-image":"MediaGallery_brand-image",brandImage:"MediaGallery_brand-image","preview-controls":"MediaGallery_preview-controls",previewControls:"MediaGallery_preview-controls",link:"MediaGallery_link","link-placeholder":"MediaGallery_link-placeholder",linkPlaceholder:"MediaGallery_link-placeholder","overlap-gallery":"MediaGallery_overlap-gallery",overlapGallery:"MediaGallery_overlap-gallery","thumbnails-as-images":"MediaGallery_thumbnails-as-images",thumbnailsAsImages:"MediaGallery_thumbnails-as-images"}},jAnt:function(e,t,a){e.exports=a("B1SK").wrapCssModule(e.i,a("s5Fw"))},lKCH:function(e,t,a){"use strict";a.r(t);var i=a("q1tI"),n=a("/MKj"),r=a("Hu+Q"),l=a("9hXd"),o=a("B1SK"),s=a("ntKj"),c=a.n(s),m=a("jAnt"),d=a.n(m),b=a("HKdb"),u=a.n(b),h=a("JtOw"),p=a.n(h),v=a("RXl/"),g=a("naJ1"),y=a("CXKz"),_=a("CbJN"),f=a("VTBJ"),j=a("i8i4"),x=a.n(j),w=a("A2a6"),O=a("nKUr"),G=20,k=e=>{var t,a,n,{src:r,initiatorNode:l}=e,o=Object(i.useRef)(null),s=Object(i.useRef)(null),c=!1,m=!1,b=.3,u=l.getBoundingClientRect(),h=u.width/u.height,p=function(e){var t=window.innerWidth-e.right,a=e.left>t,i=e.top;i<G&&(i=G);return{top:i,left:a?null:e.right+G,right:a?window.innerWidth-e.left+G:null,width:(a?e.left:t)-60,height:window.innerHeight-i-G}}

1(u),g=p.width/p.height,y={top:p.top,left:p.left,right:p.right,width:h>g?p.width:p.height*h,height:h>g?p.width/h:p.height},_={top:"".concat(y.top,"px"),left:y.left&&"".concat(y.left,"px"),right:y.right&&"".concat(y.right,"px"),width:"".concat(y.width,"px"),height:"".concat(y.height,"px")},j=Object(i.useCallback)((()=>{var e=n.top-a.top,i=n.left-a.left,r=n.width-a.width;a.top=a.top+.1*e,a.left=a.left+.1*i,a.width=a.width+.1*r;var l=Object(w.e)(a.left,a.top,'px');l.width="".concat(a.width,"px"),Object.assign(o.current.style,l),t=requestAnimationFrame(j)}),[]),k=Object(i.useCallback)(((e,t)=>{var i=function(e,t,a,i){var n=a.width*i,r=a.height*i,l=t-r/2;l<a.top&&(l=a.top);l>a.top+a.height-r&&(l=a.top+a.height-r);var o=e-n/2;o<a.left&&(o=a.left);o>a.left+a.width-n&&(o=a.left+a.width-n);return{top:l,left:o,width:n,height:r}}(e,t,u,b),r={top:"".concat(i.top,"px"),left:"".concat(i.left,"px"),width:"".concat(i.width,"px"),height:"".concat(i.height,"px")};Object.assign(s.current.style,r);var l=(e-u.left)/u.width,h=(t-u.top)/u.height;n=function(e,t,a,i){var n=a.width/i,r=a.height/i,l=a.height/2-r*t;l>0&&(l=0);l<a.height-r&&(l=a.height-r);var o=a.width/2-n*e;o>0&&(o=0);o<a.width-n&&(o=a.width-n);return{top:l,left:o,width:n}}(l,h,y,b),c||(c=!0,o.current.parentElement.classList.add(d.a.fadeIn),s.current.classList.add(d.a.fadeIn)),a||(a=Object(f.a)({},n),m||(m=!0,j()))}),[]),T=Object(i.useCallback)((e=>{k(e.clientX,e.clientY)}),[]),C=Object(i.useCallback)((e=>{var t=window.event||e,a=t.wheelDelta||-t.detail,i=b;a>0&&(i+=.1),a<0&&(i-=.1),i>1&&(i=1),i<.1&&(i=.1),b!==i&&(b=i,k(e.clientX,e.clientY)),e.stopImmediatePropagation(),e.stopPropagation(),e.preventDefault()}),[]),L=e=>{var t=e.target;['SELECT','INPUT','TEXTAREA'].includes(t.tagName)||t.isContentEditable||[' ','ArrowUp','ArrowDown','ArrowLeft','ArrowRight'].includes(e.key)&&e.preventDefault()},I=Object(i.useCallback)((()=>{var e=o.current;y.height=y.width*e.naturalHeight/e.naturalWidth,e.parentElement.style.height=y.height+'px',e.parentElement.classList.add('ready')}),[]);return Object(i.useEffect)((()=>(l.addEventListener('mousemove',T),l.addEventListener('mousewheel',C),l.addEventListener('DOMMouseScroll',C),()=>{l.removeEventListener('mousemove',T),l.removeEventListener('mousewheel',C),l.removeEventListener('DOMMouseScroll',C)})),[l]),Object(i.useEffect)((()=>(window.addEventListener('keydown',L),()=>{window.removeEventListener('keydown',L),t&&cancelAnimationFrame(t)})),[]),x.a.createPortal(Object(O.jsxs)(O.Fragment,{children:[Object(O.jsx)("div",{className:d.a.zoomLense,ref:s}),Object(O.jsxs)("div",{className:d.a.zoom,style:_,"aria-hidden":!0,children:[Object(O.jsx)("div",{className:d.a.spinner,children:Object(O.jsx)(v.default,{noLabel:!0})}),Object(O.jsx)("img",{src:r,alt:"",onLoad:I,ref:o})]})]}),document.getElementById('extras'))},T=Object(o.withStyles)(d.a)(Object(i.memo)(k));var C=Object(i.forwardRef)(((e,t)=>{var{imgProps:a,onLoad:n,index:r,showLargeGallery:l,zoomState:o,item:s,preventZoom:c}=e,[m,d]=o,b=t,u=!c&&m&&b.current?function(e){return(null===e||void 0===e?void 0:e.large)||null}(s):null,h=Object(i.useCallback)((()=>{b.current.addEventListener('mouseover',p),b.current.addEventListener('mousemove',v),n()}),[s]),p=Object(i.useCallback)((()=>{null!==s&&void 0!==s&&s.large&&d(!0)}),[s]),v=()=>{b.current.removeEventListener('mousemove',v),p()},g=()=>{!m&&p(),l&&l()},f=Object(i.useCallback)((()=>{d(!1)}),[s]);return Object(y.k)(y.j,f),Object(y.k)(y.g,f),Object(i.useEffect)((()=>{b.current.complete&&h()}),[]),Object(i.useEffect)((()=>()=>{b.current.removeEventListener('mouseover',p),b.current.removeEventListener('mousemove',v)}),[r]),Object(_.o)((()=>{d(!1)}),[r]),Object(O.jsxs)(O.Fragment,{children:[Object(O.jsx)("img",{src:a.src,title:a.title,alt:a.title,className:a.className,onLoad:h,onClick:g,onKeyUp:e=>{'Enter'===e.key&&g()},ref:b,onMouseDown:L,onMouseLeave:f,draggable:!1,onDragStart:I}),u&&Object(O.jsx)(T,{src:u,initiatorNode:b.current})]})}));function L(e){1===e.button&&e.preventDefault()}function I(e){e.preventDefault()}var E=a("q/sM"),N=a("95sM"),S=e=>{var[t,a]=Object(i.useState)(!1);return{vimeoNotFound:t,onVimeoError:Object(i.useCallback)((t=>{e(),t.message.includes('not found')&&a(!0)}),[]),setVimeoNotFound:a}},M=Object(i.forwardRef)(((e,t)=>{var{videoData:a,noImage:n,onLoad:r,onPlayerChange:l}=e,{vimeoNotFound:o,setVimeoNotFound:s,onVimeoError:c}=S(r);Object(i.useEffect)((()=>

1{l(null)}),[o]),Object(i.useEffect)((()=>s(!1)),[a]);var m=a.provider===N.a.Youtube,b=Object(i.useMemo)((()=>m?{onReady:r}:{loaded:r}),[m]);return Object(O.jsx)("div",{ref:t,className:d.a.videoContainer,children:m?Object(O.jsx)("div",{className:d.a.video,children:Object(O.jsx)(E.d,{videoId:a.videoId,enablejsapi:1,playsinline:1,modestbranding:1,events:b,onInit:l})}):o?Object(O.jsx)("img",{src:n,alt:"",className:d.a.noImage,onLoad:r}):Object(O.jsx)("div",{className:d.a.video,children:Object(O.jsx)(E.c,{videoId:a.videoId,transparent:!1,events:b,onInit:l,onError:c},a.videoId)})})})),A=Object(o.withStyles)(d.a)(M),R=a("240P"),B=Object(i.forwardRef)(((e,t)=>{var{showLargeGallery:a,onRendered:n}=e;return Object(i.useEffect)((()=>n())),Object(O.jsx)("div",{ref:t,className:d.a.virtualViewContainer,children:Object(O.jsx)(R.ub,{className:d.a.virtualViewIcon,onClick:a})})})),z=Object(o.withStyles)(d.a)(Object(i.memo)(B)),V=a("jT+1"),D=a("wqsk"),F=e=>{var{index:t,items:a,noImage:n,onChange:r,showLargeGallery:l,onPlayerChange:o,preventZoom:s}=e,{xs:c}=Object(D.f)(),m=Object(i.useRef)(null),b=Object(i.useRef)(0),[h,y]=Object(i.useState)(t),_=Object(i.useState)(!1),[f]=Object(g.h)(['Product_NoImage']).texts,j=a[h],x=Object(i.useCallback)((e=>{e===h||e<0||e>=a.length||(m.current.parentElement.classList.remove(d.a.fadeIn),clearTimeout(b.current),b.current=window.setTimeout((()=>{r&&r(e),y(e)}),d.a.fadeTime))}),[h]);Object(i.useEffect)((()=>{x(t)}),[t]);var w,G=Object(i.useCallback)((()=>{m.current.parentElement.classList.add(d.a.fadeIn)}),[]);return w=j&&j.type===V.b.VirtualView?Object(O.jsx)(z,{ref:m,showLargeGallery:l,onRendered:G},j.url):j&&j.type===V.b.Video?Object(O.jsx)(A,{videoData:j.videoData,ref:m,onLoad:G,onPlayerChange:o,noImage:n}):Object(O.jsx)(C,{imgProps:H(j,n,f,c),index:h,showLargeGallery:l,zoomState:_,item:j,onLoad:G,ref:m,preventZoom:s}),Object(O.jsxs)(p.a,{className:d.a.feature,allowMouseEvents:!0,onSwipeLeft:()=>{_[0]||x(h+1)},onSwipeRight:()=>{_[0]||x(h-1)},tolerance:u.a.thumbnailSize/2,children:[Object(O.jsx)("div",{className:d.a.spinner,children:Object(O.jsx)(v.default,{})}),w]})},P=Object(o.withStyles)(d.a,u.a)(Object(i.memo)(F));function H(e,t,a,i){return e?{src:!i&&e.mediumLarge||e.medium||e.small,title:e.title}:{src:t,title:a,className:d.a.noImage}}var K=a("8lQv"),W={[V.b.VirtualView]:'VirtualView_Message',[V.b.Video]:'VideoZoom_Message',[V.b.Image]:'ImageZoom_Message'},X=Object(o.withStyles)(c.a)((e=>{var{item:t,openLargeGallery:a,className:i}=e,n=t.type!==V.b.Image||!!t.large,{texts:[l],loaded:o}=Object(g.h)([W[t.type]]);return Object(O.jsx)("div",{className:Object(r.p)(c.a.previewControls,i),hidden:!n,children:o?Object(O.jsx)("button",{className:c.a.link,onClick:a,children:l}):Object(O.jsx)(K.a,{className:c.a.linkPlaceholder})})})),Z=e=>parseInt(e,10)||0,U=a("t6Zv"),Y=Object(o.withStyles)(u.a)((e=>{var{active:t}=e,a=t?R.B:R.A;return Object(O.jsx)(a,{className:u.a.icon})})),q=e=>Object(O.jsx)("img",{src:"https://img.youtube.com/vi/".concat(e.videoId,"/hqdefault.jpg"),alt:e.title}),J=a("d+Rp"),Q=a("67Y/"),$=a("9Z1F"),ee=a("F/XL"),te=e=>{var t=Object(n.useSelector)((e=>e.settings.product.noImage.small)),[a,r]=Object(i.useState)();return function(e,t,a){var{api:n}=Object(J.b)();Object(i.useEffect)((()=>{var i=n.fetch("https://vimeo.com/api/v2/video/".concat(e,".json")).pipe(Object(Q.a)((e=>{var[t]=e;return null===t||void 0===t?void 0:t.thumbnail_large})),Object($.a)((()=>Object(ee.a)(t)))).subscribe(a);return()=>i.unsubscribe()}),[])}(e.videoId,t,r),a?Object(O.jsx)("img",{src:a,alt:e.title}):null};var ae=Object(o.withStyles)(u.a)((e=>{var{item:{videoData:t,title:a=""}}=e;return Object(O.jsxs)(O.Fragment,{children:[Object(O.jsx)("span",{className:u.a.videoIconWrapper,children:Object(O.jsx)(R.S,{className:u.a.videoIcon})}),t.provider===N.a.Youtube?Object(O.jsx)(q,{videoId:t.videoId,title:a}):Object(O.jsx)(te,{videoId:t.videoId,title:a})]})})),ie=Object(o.withStyles)(u.a)((e=>{var{item:t}=e;switch(t.type){case V.b.VirtualView:return Object(O.jsx)(R.ub,{className:u.a.virtualViewIcon});case V.b.Video:return Object(O.jsx)(ae,{item:t});default:return Object(O.jsx)("img",{src:t.small,alt:t.title,title:t.title,draggable:"false"})}})),ne=e=>{var{items:t,index:a,onChange:n,bounds:l,thumbnailsAsImages:o,showLargeGallery:s}=e,c=Object(i.useRef)(null),m=re(a),[d,b,h]=Object(g.h)(['Aria_ThumbnailsPrev_Label','Aria_ThumbnailsNext_Label','Aria_ThumbnailsDot_Label']).texts,v=()=>{var e=m.listElement.getElementsByClassName('active')[0];e&&e.classList.remove('active'),m.listElement.getElementsByClassName(u.a.thumbnail)[m.active].classList.add('active'),m.btnPrevElement.disabled=m.active<=0,m.btnNextElement.disabled=m.active>=t.length-1;var a=function(e,t,a){return e>t-a?t-a:e}(m.active,t.length,m.itemsInView);Object.assign(m.listElement.style,Object(w.e)(-m.itemWidth*a,0,'px'))},_=()=>{var e=c.current.getElementsByClassName(u.a.cnt)[0];e.style.width='';var a=(e=>{if(!e)return null;var t=window.getComputedStyle(e);return e.clientWidth-Z(t.paddingLeft)-Z(t.paddingRight)-Z(t.borderLeft)-Z(t.borderRight)})(c.current);m.itemWidth=(e=>{if(!e)return null;var t=window.getComputedStyle(e);return e.clientWidth+Z(t.marginLeft)+Z(t.marginRight)+Z(t.borderLeft)+Z(t.borderRight)+Z(t.paddingLeft)+Z(t.paddingRight)})(m.listElement.firstElementChild),m.itemsInView=Math.floor(a/m.itemWidth),m.itemsInView>t.length&&(m.itemsInView=t.length),c.current.getElementsByClassName(u.a.navControls)[0].style.visibility=m.itemsInView<t.length?'visible':'hidden',e.style.width=m.itemWidth*m.itemsInView+'px',v()},f=Object(i.useCallback)((e=>{e!==m.active&&t[e]&&(m.active=e,v(),n&&n(m.active))}),[a]),j=()=>{f(m.active+1)},x=()=>{f(m.active-1)},G=()=>{m.listElement.getElementsByClassName(u.a.thumbnail)[m.active].firstElementChild.focus()};Object(y.k)(y.i,_),Object(i.useEffect)((()=>{f(a)}),[a]),Object(i.useEffect)((()=>{m.listElement=c.current.getElementsByClassName(u.a.list)[0],m.btnPrevElement=c.current.getElementsByClassName(u.a.prev)[0],m.btnNextElement=c.current.getElementsByClassName(u.a.next)[0];var e=setTimeout(_);return()=>clearTimeout(e)}),[t,l]);var k=m.active<=0?R.c:R.b,T=m.active>=t.length-1?R.e:R.d;return Object(O.jsx)("div",{className:Object(r.p)(u.a.thumbnails,o&&u.a.thumbnailsAsImages),ref:c,onKeyDown:e=>{switch(e.key){case'ArrowRight':e.preventDefault(),j(),G();break;case'ArrowLeft':e.preventDefault(),x(),G()}},role:"presentation",children:Object(O.jsxs)("div",{className:u.a.cnt,children:[Object(O.jsx)(p.a,{onSwipeRight:x,onSwipeLeft:j,allowMouseEvents:!0,className:u.a.swipeArea,tolerance:u.a.thumbnailSize/2,children:Object(O.jsx)("div",{className:u.a.wrapper,children:Object(O.jsx)("ul",{className:u.a.list,children:t.map(((e,t)=>Object(O.jsx)("li",{className:u.a.thumbnail,children:Object(O.jsx)("button",{tabIndex:m.active===t?0:-1,onClick:()=>((e,t)=>{f(t),e===V.b.VirtualView&&s()})(e.type,t),onKeyUp:e=>'Enter'===e.key&&f(t),"aria-keyshortcuts":"ArrowRight ArrowLeft","aria-label":Object(U.a)(h,[t+1]),children:o?Object(O.jsx)(ie,{item:e}):Object(O.jsx)(Y,{active:m.active===t})})},t)))})})}),Object(O.jsxs)("div",{className:u.a.navControls,children:[Object(O.jsx)("button",{className:u.a.prev,onClick:x,"aria-label":d,children:Object(O.jsx)("span",{className:u.a.iconWrapper,children:Object(O.jsx)(k,{className:u.a.icon})})}),Object(O.jsx)("button",{className:u.a.next,onClick:j,"aria-label":b,children:Object(O.jsx)("span",{className:u.a.iconWrapper,children:Object(O.jsx)(T,{className:u.a.icon})})})]})]})})},re=e=>{var t=Object(i.useRef)();return t.current||(t.current={itemWidth:0,itemsInView:1,active:e,listElement:null,btnPrevElement:null,btnNextElement:null}),t.current},le=Object(o.withStyles)(u.a)(Object(i.memo)(ne));var oe=a("TzXm"),se=a("zUHw"),ce=a("UcTk"),me=a("/Scy"),de=a.n(me),be=a("G5J1"),ue=(e,t,a)=>{var[n,r]=Object(i.useState)(a);return Object(y.k)(e||be.a,(e=>{e===t&&r(!0)}),!!e&&!n),n};var he=Object(o.withStyles)(de.a)((function(e){var{item:t,index:a,active:r,emitter:l}=e,o=Object(n.useSelector)((e=>e.settings.product.noImage)),[s,c]=Object(i.useState)(!1),m=ue(l,a,r),d=Object(i.useRef)(null),b=Object(i.useRef)(null),[u,h]=Object(i.useState)(),p=Object(i.useRef)(!1),g=Object(i.useCallback)((()=>c(!0)),[]),{vimeoNotFound:_,onVimeoError:f}=S(g);Object(i.useEffect)((()=>ve(b.current,d.current)),[m]),Object(i.useEffect)((()=>{r?p.current=!1:u&&s&&!p.current&&!_&&(Object(N.c)(u),p.current=!0)}),[r,_]),Object(y.k)(y.i,(()=>ve(b.current,d.current)));var{videoData:j}=t,x=j.provider===N.a.Youtube,w=Object(i.useMemo)((()=>x?{onReady:g}:{loaded:g}),[x]),G=Object(i.useCallback)((e=>h(e)),[]);return Object(O.jsxs)(O.Fragment,{children:[m&&(x?Object(O.jsx)("div",{className:"".concat(de.a.slide," ").concat(de.a.videoSlide),ref:b,children:Object(O.jsx)(E.d,{videoId:j.videoId,enablejsapi:1,playsinline:1,modestbranding:1,events:w,ref:d,onInit:G,className:de.a.frame})}):_?Object(O.jsx)("img",{className:de.a.slide,src:o.large||o.medium||o.small,alt:"",onLoad:g,draggable:"false",onDragStart:pe}):Object(O.jsx)("div",{className:"".concat(de.a.slide," ").concat(de.a.videoSlide),ref:b,children:Object(O.jsx)(E.c,{videoId:j.videoId,transparent:!1,events:w,ref:d,onInit:G,onError:f,className:de.a.frame},j.videoId)})),!s&&Object(O.jsx)("div",{className:"".concat(de.a.spinner," ").concat(de.a.slide),children:Object(O.jsx)(v.default,{})})]})}));function pe(e){e.preventDefault()}function ve(e,t){if(e&&t){var{width:a,height:i}=e.getBoundingClientRect();9*a/16>i?(t.classList.add(de.a.noFixedAspectRatio),t.style.height=i+'px',t.style.width=16*i/9+'px'):(t.classList.remove(de.a.noFixedAspectRatio),t.style.height='',t.style.width='')}}var ge=Object(o.withStyles)(de.a)((function(e){var{item:t,index:a,active:n,emitter:r}=e,[l,o]=Object(i.useState)(!1),s=ue(r,a,n);return Object(O.jsxs)(O.Fragment,{children:[s&&Object(O.jsx)("img",{className:de.a.slide,src:t.large,alt:t.title,title:t.title,onLoad:()=>o(!0),draggable:"false",onDragStart:ye}

1),!l&&Object(O.jsx)("div",{className:"".concat(de.a.spinner," ").concat(de.a.slide),children:Object(O.jsx)(v.default,{})})]})}));function ye(e){e.preventDefault()}var _e=Object(o.withStyles)(de.a)((e=>{var{item:t,index:a,active:n,emitter:r}=e,[l,o]=Object(i.useState)(!1),s=ue(r,a,n);return Object(O.jsxs)(O.Fragment,{children:[s&&Object(O.jsx)("iframe",{allow:"camera; gyroscope; accelerometer; magnetometer;",allowFullScreen:!0,className:de.a.slide,onLoad:()=>o(!0),src:t.url,title:t.title}),!l&&Object(O.jsx)("div",{className:"".concat(de.a.spinner," ").concat(de.a.slide),children:Object(O.jsx)(v.default,{})})]})})),fe=e=>{var{hide:t,items:a,index:n}=e,[r,l]=Object(i.useState)(n),o=Object(i.useCallback)((e=>l(e)),[]),s=Object(i.useMemo)((()=>a.map(((e,t)=>'url'in e?Object(O.jsx)(_e,{item:e,index:t,active:r===t}):'videoData'in e?Object(O.jsx)(he,{item:e,index:t,active:r===t}):Object(O.jsx)(ge,{item:e,index:t,active:r===t})))),[a,r]),c=Object(se.b)(n),{prev:m,next:d}=c,b=s.length,u=Object(i.useCallback)((e=>{b<=1||('ArrowLeft'!==e.key?'ArrowRight'!==e.key||d():m())}),[b]);return Object(O.jsx)(ce.a,{hide:t,onKeyDown:u,"aria-keyshortcuts":b>1?'ArrowRight ArrowLeft':null,children:b>1?Object(O.jsx)(se.a,{items:s,control:c,onSlideChange:o,noMouseSliding:!0,onScrimClick:t}):s[0]})},je=e=>{var{items:t,index:a,hide:n}=e,r=Object(i.useMemo)((()=>function(e,t){for(var a=0,i=[],n=0,r=0;r<e.length;r++){var l=e[r];'large'in l&&!l.large||(i.push(l),t===r&&(a=n),n++)}return{index:a,items:i}}(t,a)),[t,a]);return Object(O.jsx)(fe,{hide:n,items:r.items,index:r.index})};var xe=Object(o.withStyles)(c.a)((e=>{var{items:t,index:a=0,brandImage:n,bounds:r,noImage:l,preventZoom:o,style:s,thumbnailsAsImages:m}=e,{xs:d}=Object(D.f)(),[b,u]=Object(i.useState)(a<0?0:a),h=Object(i.useRef)(null),p=function(e){return e.filter((e=>e.type===V.b.VirtualView||e.type===V.b.Video||e.small))}(t),v=p[b],g=p.length,y=Object(oe.c)(),f=v&&v.type===V.b.VirtualView,j=v&&(v.type!==V.b.Image||!!v.large),x=Object(i.useRef)(j);j&&(x.current=!0);var w=e=>{e!==b&&(e<0||e>=g||u(e))};Object(i.useEffect)((()=>{h.current=null}),[b]),Object(_.o)((()=>{w(a)}),[a]);var G=Object(i.useCallback)((()=>{h.current&&Object(N.c)(h.current),y.show()}),[]),k=Object(i.useCallback)((e=>{h.current=e}),[]);return Object(O.jsxs)(O.Fragment,{children:[Object(O.jsxs)("div",{className:"".concat(c.a.mediaGallery," ").concat(m?c.a.thumbnailsAsImages:''),style:s,children:[Object(O.jsxs)("div",{className:c.a.overlay,children:[n&&Object(O.jsx)("div",{className:c.a.brandImage,children:Object(O.jsx)("img",{src:n,alt:"BrandImage"})}),Object(O.jsx)(P,{items:p,index:b,onChange:w,noImage:l,showLargeGallery:null!==v&&void 0!==v&&v.large||f?y.show:void 0,onPlayerChange:k,preventZoom:o||!m}),!!g&&x.current&&Object(O.jsx)(X,{item:v,openLargeGallery:G,className:d&&f?c.a.overlapGallery:null})]}),g>1&&Object(O.jsx)(le,{items:p,index:b,onChange:w,bounds:r,thumbnailsAsImages:m,showLargeGallery:y.show})]}),y.opened&&Object(O.jsx)(je,{hide:y.hide,items:p,index:b})]})}));var we=a("88at");t.default=e=>{var{model:t,isDesignerMode:a,bounds:o}=e,s=Object(n.useSelector)((e=>{var t,a;return null===(t=e.settings.product)||void 0===t||null===(a=t.noImage)||void 0===a?void 0:a.large})),{media:c,index:m,brandImage:d}=Object(i.useContext)(we.a),b=1===t.mainImage_ResizingMode,u={'--mainImage-height':b?'auto':t.mainImage_Height,'--mainImage-aspectRatio':b?t.mainImage_AspectRatio:'auto','--thumbnails-borderStyle':Object(l.a)(t.thumbnails_BorderStyle),'--thumbnails-borderColor':t.thumbnails_BorderColor,'--thumbnails-activeBorderColor':t.thumbnails_ActiveBorderColor,'--thumbnails-borderWidth':t.thumbnails_BorderWidth,'--thumbnails-cornerRadius':t.thumbnails_CornerRadius,'--thumbnails-dotsColor':t.thumbnails_DotsColor,'--thumbnails-dotsActiveColor':t.thumbnails_DotsActiveColor},h=Object(i.useMemo)(r.h,[c]);return Object(i.useEffect)((()=>{if('undefined'!==typeof document){var e=1===t.mainImage_ResizingMode;document.body.style.setProperty('--pdp-banner-margin',e?"calc(100% * (0.5 / (".concat(t.mainImage_AspectRatio,")))"):"calc(".concat(t.mainImage_Height?t.mainImage_Height:'320px'," / 2)")),document.body.style.setProperty('--pdp-banner-transform','translate3d(0,-50%,

10)')}}),[t.mainImage_ResizingMode,t.mainImage_AspectRatio,t.mainImage_Height]),Object(O.jsx)(xe,{items:c,noImage:s,index:m,brandImage:d,preventZoom:a,bounds:o,style:u,thumbnailsAsImages:0===t.thumbnails_Mode},h)}},ntKj:function(e,t,a){e.exports=a("B1SK").wrapCssModule(e.i,a("eyRL"))},s5Fw:function(e,t,a){(t=e.exports=a("I1BE")(!1)).push([e.i,".Gallery_feature{aspect-ratio:var(--mainImage-aspectRatio,auto);box-sizing:initial;height:var(--mainImage-height,320px);position:relative;width:100%}.Gallery_feature:not(:first-child:last-child){margin-bottom:2em}.Gallery_feature img{bottom:0;display:block;left:0;margin:auto;max-height:100%;max-width:100%;opacity:0;position:absolute;right:0;top:0;transition:opacity .2s}.Gallery_feature .Gallery_video-container,.Gallery_feature .Gallery_virtual-view-container{align-items:center;display:flex;height:100%;justify-content:center;opacity:0}.Gallery_feature .Gallery_virtual-view-container{flex-direction:column}.Gallery_feature .Gallery_video{align-items:center;aspect-ratio:16/9;display:flex;flex-grow:0;flex-shrink:0;height:100%;max-width:100%}.Gallery_feature .Gallery_spinner{left:50%;position:absolute;top:50%;-webkit-transform:translate(-1em,-1em);transform:translate(-1em,-1em);transition:opacity .2s .2s}.Gallery_feature.Gallery_fade-in .Gallery_video-container,.Gallery_feature.Gallery_fade-in .Gallery_virtual-view-container,.Gallery_feature.Gallery_fade-in img,.ssr-markup .Gallery_feature .Gallery_video-container,.ssr-markup .Gallery_feature .Gallery_virtual-view-container,.ssr-markup .Gallery_feature img{opacity:1}.Gallery_feature.Gallery_fade-in .Gallery_spinner,.ssr-markup .Gallery_feature .Gallery_spinner{opacity:0;transition-delay:0s}.Gallery_zoom{background-color:var(--theme-page_BackgroundColor,#fff);border:solid 2px var(--theme-borderColor,#e6e6e6);box-sizing:initial;margin:-2px 0 0 -2px;min-height:3em;min-width:3em;opacity:0;overflow:hidden;pointer-events:none;position:fixed;transition:opacity .2s;z-index:1}.Gallery_zoom.Gallery_fade-in{opacity:1}.Gallery_zoom .Gallery_spinner{left:50%;margin-left:-1em;margin-top:-1em;top:50%}.Gallery_zoom .Gallery_spinner,.Gallery_zoom img{position:absolute;transition:opacity .2s}.Gallery_zoom img{-webkit-backface-visibility:hidden;backface-visibility:hidden;display:block;height:auto;left:0;opacity:0;top:0}.Gallery_zoom.ready .Gallery_spinner{opacity:0}.Gallery_zoom.ready img{opacity:1}.Gallery_zoom-lense{background-color:hsla(0,0%,100%,.3);border:solid 1px var(--theme-borderColor,#e6e6e6);box-sizing:border-box;height:150px;left:0;opacity:0;pointer-events:none;position:fixed;top:0;transition:opacity .2s;width:100px;z-index:1}.Gallery_zoom-lense.Gallery_fade-in{opacity:1}.Gallery_virtual-view-icon{cursor:pointer;height:auto;max-height:100%;max-width:100%;width:240px}@media not all and (min-width:env(--theme-breakpoints_Small,600)px){.Gallery_virtual-view-container{box-sizing:border-box;padding-bottom:2em}}.Gallery_no-image{/*!*/}",""]),t.locals={fadeTime:"200",feature:"Gallery_feature","video-container":"Gallery_video-container",videoContainer:"Gallery_video-container","virtual-view-container":"Gallery_virtual-view-container",virtualViewContainer:"Gallery_virtual-view-container",video:"Gallery_video",spinner:"Gallery_spinner","fade-in":"Gallery_fade-in",fadeIn:"Gallery_fade-in",zoom:"Gallery_zoom","zoom-lense":"Gallery_zoom-lense",zoomLense:"Gallery_zoom-lense","virtual-view-icon":"Gallery_virtual-view-icon",virtualViewIcon:"Gallery_virtual-view-icon","no-image":"Gallery_no-image",noImage:"Gallery_no-image"}}}]);
2//# sourceMappingURL=cb-media-gallery.d53d2062.chunk.js.map