https://www.harrys.com/assets/ProductGallery-BX996KDW.js

1import{j as m}from"./jsx-runtime-D_zvdyIk.js";import{r as n,g as ne,A as re}from"./chunk-EPOLDU6W-Swgka7OG.js";import{c as T}from"./index-BA4hAz4b.js";import{C as oe,a as se}from"./index-JDffPxlL.js";import{P as X}from"./ProductFormProvider-CHeN8v3p.js";import{e as ie,f as G}from"./index-Cu8wK6UM.js";import{u as ae}from"./useFsFlagWithOverride-CY6Mtefe.js";import{C as le}from"./ClientOnly-Bkpfe0Ef.js";import{F as ce}from"./icon-close-D-AgyuSI.js";import{l as ee}from"./jsonFormattedLogging--O2vLfmv.js";import{u as ue}from"./useTranslation-CdKpIms3.js";import{u as de}from"./load-script-CHxPAPuh.js";import{s as fe,I as W}from"./Image-CCu1P5m6.js";import{E as pe}from"./ExternalVideo-CYBKkXRp.js";const me=n.forwardRef((t,u)=>{var o;const{data:i,previewImageOptions:r,id:h=i.id,playsInline:g=!0,controls:d=!0,sourceProps:f={},...b}=t,e=fe({src:((o=i.previewImage)==null?void 0:o.url)??"",...r});if(!i.sources)throw new Error("<Video/> requires a 'data.sources' array");return m.jsx("video",{...b,id:h,playsInline:g,controls:d,poster:e,ref:u,children:i.sources.map(a=>{if(!(a!=null&&a.url&&(a!=null&&a.mimeType)))throw new Error("<Video/> needs 'source.url' and 'source.mimeType'");return n.createElement("source",{...f,key:a.url,src:a.url,type:a.mimeType})})})});function he(t){var u,o,i;const[r,h]=n.useState(void 0),g=n.useCallback(l=>{h(l)},[]),{data:d,children:f,className:b,...e}=t,a=de("https://unpkg.com/@google/[email protected]/dist/model-viewer.min.js",{module:!0});return n.useEffect(()=>{const l={error:e.onError,load:e.onLoad,preload:e.onPreload,"model-visibility":e.onModelVisibility,progress:e.onProgress,"ar-status":e.onArStatus,"ar-tracking":e.onArTracking,"quick-look-button-tapped":e.onQuickLookButtonTapped,"camera-change":e.onCameraChange,"environment-change":e.onEnvironmentChange,play:e.onPlay,pause:e.onPause,"scene-graph-ready":e.onSceneGraphReady};if(r)return Object.entries(l).forEach(([c,x])=>{x&&r.addEventListener(c,x)}),()=>{r!=null&&Object.entries(l).forEach(([c,x])=>{x&&r.removeEventListener(c,x)})}},[r,e.onArStatus,e.onArTracking,e.onCameraChange,e.onEnvironmentChange,e.onError,e.onLoad,e.onModelVisibility,e.onPause,e.onPlay,e.onPreload,e.onProgress,e.onQuickLookButtonTapped,e.onSceneGraphReady]),a!=="done"?null:(o=(u=d.sources)==null?void 0:u[0])!=null&&o.url?m.jsx("model-viewer",{ref:g,...e,class:b,id:e.id??d.id,src:d.sources[0].url,alt:d.alt??null,"camera-controls":e.cameraControls??!0,poster:(e.poster||((i=d.previewImage)==null?void 0:i.url))??null,autoplay:e.autoplay??!0,loading:e.loading,reveal:e.reveal,ar:e.ar,"ar-modes":e.arModes,"ar-scale":e.arScale,"ar-placement":e.arPlacement,"ios-src":e.iosSrc,"touch-action":e.touchAction,"disable-zoom":e.disableZoom,"orbit-sensitivity":e.orbitSensitivity,"auto-rotate":e.autoRotate,"auto-rotate-delay":e.autoRotateDelay,"rotation-per-second":e.rotationPerSecond,"interaction-policy":e.interactionPolicy,"interaction-prompt":e.interactionPrompt,"interaction-prompt-style":e.interactionPromptStyle,"interaction-prompt-threshold":e.interactionPromptThreshold,"camera-orbit":e.cameraOrbit,"camera-target":e.cameraTarget,"field-of-view":e.fieldOfView,"max-camera-orbit":e.maxCameraOrbit,"min-camera-orbit":e.minCameraOrbit,"max-field-of-view":e.maxFieldOfView,"min-field-of-view":e.minFieldOfView,bounds:e.bounds,"interpolation-decay":e.interpolationDecay??100,"skybox-image":e.skyboxImage,"environment-image":e.environmentImage,exposure:e.exposure,"shadow-intensity":e.shadowIntensity??0,"shadow-softness":e.shadowSoftness??0,"animation-name":e.animationName,"animation-crossfade-duration":e.animationCrossfadeDuration,"variant-name":e.variantName,orientation:e.orientation,scale:e.scale,children:f}):(console.error("<ModelViewer/> requires 'data.sources' prop to be an array, with an object that has a property 'url' on it. Rendering 'null'"),null)}function J(t,u,o){return Math.min(Math.max(t,u),o)}function $(t){return typeof t=="number"&&!isNaN(t)}function te(t={}){let r,h=[],g,d=0,f=0,b=0,e=!1,a,l;function c(s){r=s;const w=r.selectedScrollSnap(),{scrollBody:y,containerRect:V,axis:C}=r.internalEngine(),R=C.measureSize(V);g=J(R*.75,200,500),e=!1,h=r.scrollSnapList().map((S,P)=>P===w?1:0),a=y.settled,l=r.scrollProgress,y.settled=I,r.scrollProgress=p,r.on("select",L).on("slideFocus",O).on("pointerDown",E).on("pointerUp",z),k(),O()}function x(){const{scrollBody:s}=r.internalEngine();s.settled=a,r.scrollProgress=l,r.off("select",L).off("slideFocus",O).off("pointerDown",E).off("pointerUp",z),r.slideNodes().forEac

1h(w=>{const y=w.style;y.opacity="",y.transform="",y.pointerEvents="",w.getAttribute("style")||w.removeAttribute("style")})}function O(){const s=r.selectedScrollSnap();F(s,1)}function z(){e=!1}function E(){e=!1,d=0,f=0}function L(){const s=r.internalEngine().scrollBody.duration();f=s?0:1,e=!0,s||O()}function _(s){const{axis:w}=r.internalEngine();return`translate${w.scroll.toUpperCase()}(${w.direction(s)}px)`}function k(){const{translate:s,slideLooper:w}=r.internalEngine();s.clear(),s.toggleActive(!1),w.loopPoints.forEach(({translate:y})=>{y.clear(),y.toggleActive(!1)})}function B(s){const{scrollSnaps:w,location:y,target:V}=r.internalEngine();!$(s)||h[s]<.5||(y.set(w[s]),V.set(y))}function F(s,w){r.scrollSnapList().forEach((V,C)=>{const R=Math.abs(w),S=h[C],P=C===s,N=P?S+R:S-R,Z=J(N,0,1);h[C]=Z;const U=P&&e,H=r.previousScrollSnap();U&&(h[H]=1-Z),P&&j(s,Z),M(C)})}function M(s){const w=r.internalEngine().slideRegistry[s],{scrollSnaps:y,containerRect:V}=r.internalEngine(),C=h[s];w.forEach(R=>{const S=r.slideNodes()[R].style,P=parseFloat(C.toFixed(2)),N=P>0,Z=N?y[s]:V.width+2,U=_(Z);N&&(S.transform=U),S.opacity=P.toString(),S.pointerEvents=C>.5?"auto":"none",N||(S.transform=U)})}function j(s,w){const{index:y,dragHandler:V,scrollSnaps:C}=r.internalEngine(),R=V.pointerDown(),S=1/(C.length-1);let P=s,N=R?r.selectedScrollSnap():r.previousScrollSnap();if(R&&P===N){const H=Math.sign(d)*-1;P=N,N=y.clone().set(N).add(H).get()}const Z=N*S,U=(P-N)*S;b=Z+U*w}function D(){const{dragHandler:s,index:w,scrollBody:y}=r.internalEngine(),V=r.selectedScrollSnap();if(!s.pointerDown())return V;const C=Math.sign(y.velocity()),R=Math.sign(d),S=w.clone().set(V).add(C*-1).get();return!C||!R?null:R===C?S:V}function A(s){const{dragHandler:w,scrollBody:y}=s.internalEngine(),V=w.pointerDown(),C=y.velocity(),R=y.duration(),S=D(),P=!$(S);if(V){if(!C)return;d+=C,f=Math.abs(C/g),B(S)}if(!V){if(!R||P)return;

1f+=(1-h[S])/R,f*=.68}P||F(S,f)}function I(){const{target:s,location:w}=r.internalEngine(),y=s.get()-w.get(),V=Math.abs(y)>=1,C=D(),R=!$(C);return A(r),R||V?!1:h[C]>.999}function p(){return b}return{name:"fade",options:t,init:c,destroy:x}}te.globalOptions=void 0;const ge=({title:t,titleId:u,...o},i)=>n.createElement("svg",{width:29,height:28,viewBox:"0 0 29 28",fill:"none",xmlns:"http://www.w3.org/2000/svg",ref:i,"aria-labelledby":u,...o},t?n.createElement("title",{id:u},t):null,n.createElement("g",{id:"SVG Export 12 1",clipPath:"url(#clip0_14313_49785)"},n.createElement("path",{id:"Vector",d:"M14.5 28C22.232 28 28.5 21.732 28.5 14C28.5 6.26801 22.232 0 14.5 0C6.76801 0 0.5 6.26801 0.5 14C0.5 21.732 6.76801 28 14.5 28Z",fill:"currentColor",fillOpacity:.8}),n.createElement("path",{id:"Vector_2",fillRule:"evenodd",clipRule:"evenodd",d:"M22.8709 13.9998L10.1328 6.64551V21.3541L22.8709 13.9998ZM20.7479 13.9998L11.1943 8.48409V19.5156L20.7479 13.9998Z",fill:"#666666"})),n.createElement("defs",null,n.createElement("clipPath",{id:"clip0_14313_49785"},n.createElement("rect",{width:28,height:28,fill:"currentColor",transform:"translate(0.5)"})))),we=n.forwardRef(ge),q={variantMedia:[],globalMedia:[],selectedVariantMedia:[]},xe=(t=[],u,o)=>{const i=n.useMemo(()=>o&&u?u.nodes.map(a=>{var l;return(l=a.image)==null?void 0:l.url}):[],[o,u]);if(!t||t.length===0)return q;if(!o)return{...q,globalMedia:t,selectedVariantMedia:t};const r=t.findIndex(a=>{var l,c;return a.__typename==="MediaImage"&&((l=a.image)==null?void 0:l.url)===o||((c=a.previewImage)==null?void 0:c.url)===o}),h=i.indexOf(o),g=i.find((a,l)=>l>h&&a!==o),d=t.findIndex(a=>{var l,c;return a.__typename==="MediaImage"&&((l=a.image)==null?void 0:l.url)===g||((c=a.previewImage)==null?void 0:c.url)===g});if(r===-1)return{...q,globalMedia:t,selectedVariantMedia:t};const f=t.slice(r,d),b=t.findIndex(a=>{var l,c;return a.__typename==="MediaImage"&&i.includes((l=a.image)==null?void 0:l.url)||i.includes((c=a.previewImage)==null?void 0:c.url)}),e=t.slice(0,b);return{variantMedia:f,globalMedia:e,selectedVariantMedia:f.concat(e)}};function ye(t,u){const o=n.useRef(null),i=n.useRef(null);i.current=u;const r=n.useRef(null);n.useEffect(()=>{h()});const h=n.useCallback(()=>{const g=r.current,d=i.current,f=g||(d?"nodeType"in d?d:d.current:null);o.current&&o.current.element===f&&o.current.subscriber===t||(o.current&&o.current.cleanup&&o.current.cleanup(),o.current={element:f,subscriber:t,cleanup:f?t(f):void 0})},[t]);return n.useEffect(()=>()=>{o.current&&o.current.cleanup&&(o.current.cleanup(),o.current=null)},[]),n.useCallback(g=>{r.current=g,h()}

1,[h])}function Q(t,u,o){return t[u]?t[u][0]?t[u][0][o]:t[u][o]:u==="contentBoxSize"?t.contentRect[o==="inlineSize"?"width":"height"]:void 0}function ve(t={}){const u=t.onResize,o=n.useRef(void 0);o.current=u;const i=t.round||Math.round,r=n.useRef(void 0),[h,g]=n.useState({width:void 0,height:void 0}),d=n.useRef(!1);n.useEffect(()=>(d.current=!1,()=>{d.current=!0}),[]);const f=n.useRef({width:void 0,height:void 0}),b=ye(n.useCallback(e=>{var a;if(!r.current||r.current.box!==t.box||r.current.round!==i){const l=((a=e.ownerDocument.defaultView)==null?void 0:a.ResizeObserver)??ResizeObserver;r.current={box:t.box,round:i,instance:new l(c=>{if(d.current)return;const x=c[0],O=t.box==="border-box"?"borderBoxSize":t.box==="device-pixel-content-box"?"devicePixelContentBoxSize":"contentBoxSize",z=Q(x,O,"inlineSize"),E=Q(x,O,"blockSize"),L=z===void 0?void 0:i(z),_=E===void 0?void 0:i(E);if(f.current.width!==L||f.current.height!==_){const k={width:L,height:_};f.current.width=L,f.current.height=_,o.current?o.current({...k,entry:x}):g(k)}})}}return r.current.instance.observe(e,{box:t.box}),()=>{r.current&&r.current.instance.unobserve(e)}},[t.box,i]),t.ref);return n.useMemo(()=>({ref:b,width:h.width,height:h.height}),[b,h.width,h.height])}const Ce=({title:t,titleId:u,...o},i)=>n.createElement("svg",{width:24,height:24,viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",ref:i,"aria-labelledby":u,...o},t?n.createElement("title",{id:u},t):null,n.createElement("mask",{id:"mask0_64_1598",style:{maskType:"alpha"},maskUnits:"userSpaceOnUse",x:0,y:0,width:24,height:24},n.createElement("path",{d:"M12.8132 13.0001V6.00012H15.5532C16.3132 6.00012 16.9866 6.15679 17.5732 6.47012C18.1599 6.77679 18.6132 7.19679 18.9332 7.73012C19.2532 8.26346 19.4132 8.85346 19.4132 9.50012C19.4132 10.1468 19.2532 10.7368 18.9332 11.2701C18.6132 11.8035 18.1599 12.2268 17.5732 12.5401C16.9866 12.8468 16.3132 13.0001 15.5532 13.0001H12.8132ZM15.5532 11.5701C16.0199 11.5701 16.4299 11.4835 16.7832 11.3101C17.1366 11.1301 17.4099 10.8835 17.6032 10.5701C17.7966 10.2568 17.8932 9.90012 17.8932 9.50012C17.8932 9.10012 17.7966 8.74346 17.6032 8.43012C17.4099 8.11679 17.1366 7.87346 16.7832 7.70012C16.4299 7.52012 16.0199 7.43012 15.5532 7.43012H14.3332V11.5701H15.5532Z",fill:"#001D48"}),n.createElement("path",{d:"M7.49729 13.1501C6.89729 13.1501 6.38062 13.0568 5.94729 12.8701C5.52062 12.6834 5.18395 12.4301 4.93729 12.1101C4.69729 11.7834 4.54062 11.4101 4.46729 10.9901H5.98729C6.02062 11.1434 6.09395 11.2801 6.20729 11.4001C6.32729 11.5134 6.49395 11.6068 6.70729 11.6801C6.92062 11.7468 7.18062 11.7801 7.48729 11.7801C7.82729 11.7801 8.10395 11.7434 8.31729 11.6701C8.53729 11.5901 8.69395 11.4834 8.78729 11.3501C8.88729 11.2168 8.93729 11.0668 8.93729 10.9001C8.93729 10.7401 8.88729 10.5968 8.78729 10.4701C8.69395 10.3434 8.54395 10.2434 8.33729 10.1701C8.13729 10.0968 7.88062 10.0601 7.56729 10.0601H6.58729V8.8301H7.51729C7.80395 8.8301 8.03729 8.79676 8.21729 8.7301C8.40395 8.65676 8.54062 8.5601 8.62729 8.4401C8.71395 8.31343 8.75729 8.1701 8.75729 8.0101C8.75729 7.86343 8.71062 7.7301 8.61729 7.6101C8.53062 7.4901 8.39395 7.39676 8.20729 7.3301C8.02062 7.25677 7.78062 7.2201 7.48729 7.2201C7.20062 7.2201 6.95395 7.25343 6.74729 7.3201C6.54062 7.3801 6.38062 7.46676 6.26729 7.5801C6.15395 7.68676 6.08395 7.8101 6.05729 7.9501H4.53729C4.58395 7.55676 4.73062 7.2001 4.97729 6.8801C5.23062 6.5601 5.57062 6.3101 5.99729 6.1301C6.43062 5.94343 6.92395 5.8501 7.47729 5.8501C8.06395 5.8501 8.56729 5.94343 8.98729 6.1301C9.41395 6.3101 9.73395 6.55343 9.94729 6.8601C10.1673 7.16676 10.2773 7.49676 10.2773 7.8501C10.2773 8.10343 10.224 8.33343 10.1173 8.5401C10.0106 8.74676 9.85395 8.92676 9.64729 9.0801C9.44062 9.23343 9.19062 9.3601 8.89729 9.4601V9.2501C9.19729 9.31677 9.46395 9.4301 9.69729 9.5901C9.93062 9.74343 10.114 9.94343 10.2473 10.1901C10.3873 10.4301 10.4573 10.7134 10.4573 11.0401C10.4573 11.4201 10.3473 11.7701 10.1273 12.0901C9.90729 12.4101 9.57395 12.6668 9.12729 12.8601C8.68062 13.0534 8.13729 13.1501 7.49729 13.1501Z",fill:"#001D48"}),n.createElement("path",{d:"M12 17.5002C11.7239 17.5002 11.5 17.724 11.5 18.0002C11.5 18.2763 11.7239 18.5002 12 18.5002V18.0002V17.5002ZM6.5 17.3313L6.62913 17.8143C6.78374 17.773 6.90921 17.6602 6.96667 17.5108C7.02412 17.3614 7.00661 17.1936 6.91956 17.0593L6.5 17.3313ZM5.81956 15.3625C5.66935 15.1307 5.35974 15.0647 5.12802 15.2149C4.89631 15.3651 4.83023 15.6747 4.98044 15.9064L5.4 15.6344L5.81956 15.3625ZM4.17087 17.4364C3.90409 17.5077 3.74564 17.7818 3.81696 18.0486C3.88828 18.3154 4.16236 18.4738 4.42913 

118.4025L4.3 17.9195L4.17087 17.4364ZM21.4113 9.79752C21.1824 9.643 20.8716 9.70327 20.7171 9.93213C20.5626 10.161 20.6228 10.4718 20.8517 10.6263L21.1315 10.2119L21.4113 9.79752ZM3.1483 10.6263C3.37717 10.4718 3.43743 10.161 3.28291 9.93213C3.12839 9.70327 2.8176 9.643 2.58874 9.79752L2.86852 10.2119L3.1483 10.6263ZM23 13.0005H22.5C22.5 14.0645 21.5283 15.1911 19.5713 16.0806C17.6594 16.9496 14.983 17.5002 12 17.5002V18.0002V18.5002C15.0921 18.5002 17.9158 17.9315 19.9851 16.991C22.0092 16.071 23.5 14.6978 23.5 13.0005H23ZM6.5 17.3313L6.62714 16.8477C5.02405 16.4262 3.71691 15.8295 2.82235 15.1397C1.92361 14.4467 1.5 13.7103 1.5 13.0005H1H0.5C0.5 14.1413 1.18244 15.138 2.21172 15.9316C3.24518 16.7285 4.68804 17.3719 6.37286 17.8149L6.5 17.3313ZM6.5 17.3313L6.91956 17.0593L5.81956 15.3625L5.4 15.6344L4.98044 15.9064L6.08044 17.6033L6.5 17.3313ZM6.5 17.3313L6.37087 16.8483L4.17087 17.4364L4.3 17.9195L4.42913 18.4025L6.62913 17.8143L6.5 17.3313ZM21.1315 10.2119L20.8517 10.6263C21.9699 11.3813 22.5 12.2085 22.5 13.0005H23H23.5C23.5 11.7274 22.6529 10.6358 21.4113 9.79752L21.1315 10.2119ZM1 13.0005H1.5C1.5 12.2085 2.0301 11.3813 3.1483 10.6263L2.86852 10.2119L2.58874 9.79752C1.34715 10.6358 0.5 11.7274 0.5 13.0005H1Z",fill:"#001D48"})),n.createElement("g",{mask:"url(#mask0_64_1598)"},n.createElement("rect",{width:24,height:24,fill:"white"}))),be=n.forwardRef(Ce),Y=n.createContext({modelViewerRef:null,showModelViewer:!1,setShowModelViewer:()=>{}}),Ee=({product:t,className:u})=>{var E,L,_,k,B,F;const[o,i]=n.useState(null),[r,h]=n.useState(!1),{modelViewerRef:g,showModelViewer:d,setShowModelViewer:f}=n.useContext(Y),{t:b}=ue("product"),{width:e,height:a}=ve({ref:g});n.useEffect(()=>{var M,j;d?(h(!0),ie(((M=t==null?void 0:t.selectedVariant)==null?void 0:M.id)||"")):r&&G(((j=t==null?void 0:t.selectedVariant)==null?void 0:j.id)||"")},[d]),n.useEffect(()=>{f(!1),i(null)},[f,(E=t==null?void 0:t.selectedVariant)==null?void 0:E.id]);const{modelGlb:l,modelHdr:c}=(t==null?void 0:t.selectedVariant)||{},x=n.useMemo(()=>{var M,j,D;return{...(l==null?void 0:l.reference)??{},alt:`3D Model render for ${(M=t==null?void 0:t.selectedVariant)==null?void 0:M.title}`,sources:(D=(j=l==null?void 0:l.reference)==null?void 0:j.sources)==null?void 0:D.filter(A=>A.format==="glb"),loading:"eager"}},[l==null?void 0:l.reference,(L=t==null?void 0:t.selectedVariant)==null?void 0:L.title]);n.useEffect(()=>{var M;if(!o){if(x.sources&&x.sources.length===0){i(new Error("No GLB source found for 3D model")),f(!1);return}if((M=c==null?void 0:c.reference)!=null&&M.url)try{new URL(c.reference.url)}catch(j){ee({error:j instanceof Error?j:new Error("Unknown error"),location:"ModelViewer",details:{modelHdrUrl:c.reference.url,msg:"Failed to parse modelHdr URL"}}),i(new Error("Failed to parse environment image URL"))}}},[o,x.sources,(_=c==null?void 0:c.reference)==null?void 0:_.url,f]);const O=n.useMemo(()=>{var M,j;try{if(!((M=c==null?void 0:c.reference)!=null&&M.url))return null;const D=new URL((j=c==null?void 0:c.reference)==null?void 0:j.url);return(D==null?void 0:D.origin)+(D==null?void 0:D.pathname)}catch{return null}},[(k=c==null?void 0:c.reference)==null?void 0:k.url]);return!ae("show_3d_model_on_pdp",!1)||o||!e||!a||!((F=(B=l==null?void 0:l.reference)==null?void 0:B.sources)!=null&&F.length)||!O?null:m.jsxs("div",{className:T("absolute inset-0",!d&&"pointer-events-none",u),style:{width:e?`${e}px`:"100%",height:a?`${a}px`:"100%"},children:[d&&m.jsx(Se,{modelData:x,environmentImageUrl:O,setError:i}),m.jsx("button",{className:T("bg-button-secondary border-neutral-1 border rounded-full text-neutral-1 shadow-depth-low","pointer-events-auto","text-button-s font-bold text-center","absolute top-0 right-0","h-md min-w-2xl box-content m-2xs px-2xs"),"aria-label":b(d?"modelViewer.a11y.hide3DModel":"modelViewer.a11y.viewIn3D"),onClick:()=>f(!d),children:d?m.jsxs("span",{className:"flex flex-nowrap gap-2xs items-center text-neutral-1 w-fit mx-auto uppercase",children:[b("modelViewer.hide3DModel")," ",m.jsx(ce,{className:"with-icon size-s grow-0 shrink-0"})]}):m.jsxs("span",{className:"flex flex-nowrap gap-2xs items-center text-neutral-1 w-fit mx-auto uppercase",children:[b("modelViewer.viewIn3D")," ",m.jsx(be,{height:24,width:24,className:"with-icon size-sm grow-0 shrink-0 -mt-[2px]"})]})})]})},Se=({modelData:t,environmentImageUrl:u,setError:o})=>{const{setShowModelViewer:i}=n.useContext(Y);return m.jsx(le,{children:m.jsx(he,{disableZoom:!0,data:t,maxCameraOrbit:"auto 120deg auto",minCameraOrbit:"auto 60deg auto",environmentImage:u,exposure:.87,className:"relative w-full h-full bg-neutral-2",onError:r=>{ee({error:new Error("Error in ModelViewer component"),location:"ModelViewer",details:{...(r==null?void 0:r.detail)||{msg:"No detail provided"}}}),o(new Error("Error loading 3D model")),i(!1)}})})},K=({media:t,variantImages:u,variantImageUrl:o,fallbackImage:i,thumbnailPosition:r="left",showThumbnails:h=!0,carouselItemClassName:g,imageAndVideoClassName:d,onPdp:f=!1,dotsVariant:b="below"})=>{const{selectedVariantMedia:e}=xe(t,u,o),[a,l]=n.useState(0),[c,x]=n.useState(),[O,z]=n.useState(!0),E=n.useRef(null),[L,_]=n.useState(!1),k=n.useRef(null),{product:B}=n.useContext(X),F=n.useCallback(p=>{c&&(l(p),c.scrollTo(p))},[c]),M=n.useMemo(()=>((e==null?void 0:e.length)>0?e:[{__typename:"MediaImage",image:i,previewImage:i,alt:i==null?void 0:i.altText,id:(i==null?void 0:i.id)||"fallback-image"}]).map(v=>v.__typename==="MediaImage"?{...v,isVideo:!1,image:v.image}:{...v,isVideo:v.__typename==="ExternalVideo"||v.__typename==="Video",image:v.previewImage}),[e,i]),j=JSON.stringify(M);n.useEffect(()=>{F(0)},[j,F]);const D=n.useCallback(p=>{p&&E.current!==p&&(E.current=p,p.muted=!0,window.matchMedia("(prefers-reduced-motion: reduce)").matches||p.play().catch(()=>{}))},[]),A=p=>{if(!((p==null?void 0:p.__typename)==="ExternalVideo"&&(p==null?void 0:p.host)==="YOUTUBE"))return{};const s=p.embedUrl.split("/").pop();return{embedUrl:p.embedUrl+`?mute=1&playlist=${s}`}},I=r==="bottom";return m.jsxs("div",{className:T("flex",{"flex-col":I,"flex-row gap-s":!I}),children:[h&&m.jsx("div",{className:T("hidden",{"md:flex flex-col gap-2 w-12 order-none":!I,"md:flex gap-2 overflow-auto pt-2 w-full order-last justify-center":I}),children:M.map((p,v)=>m.jsxs("button",{onClick:()=>{var s;L&&(_(!1),G(((s=B==null?void 0:B.selectedVariant)==null?void 0:s.id)||"")),F(v)},onMouseEnter:()=>{L||F(v)},className:T("relative",{"w-12 h-12 aspect-square":!I,"w-16 h-16 aspect-square shrink-0":I}),type:"button",children:[p.image&&m.jsx(W,{loading:"lazy",data:p.image,aspectRatio:"1",width:I?64:60,height:I?64:60,sizes:"48px",className:T("object-cover border",{"w-12 h-12":!I,"w-16 h-16":I,"border-gray-1":v===a,"border-transparent":v!==a})}),p.isVideo&&m.jsx("div",{className:"absolute inset-1/2 -translate-x-1/2 -translate-y-1/2 text-neutral-1 opacity-85 with-icon w-7 h-7",children:m.jsx(we,{})})]},p.id||v))}),m.jsx(Y.Provider,{value:{modelViewerRef:k,showModelViewer:L,setShowModelViewer:_},children:m.jsxs("div",{ref:k,children:[m.jsx(oe,{opts:{align:"start",slidesToScroll:1},setApi:x,emblaApi:c,className:T({"order-none":!I,"order-first":I}),setSelectedIndex:l,plugins:[te()],navDotsClassName:"md:hidden",dotsVariant:b,children:M.map((p,v)=>{const s=p.image;return m.jsx(se,{className:T("relative size-full aspect-square",g),children:p.isVideo?m.jsxs("button",{onClick:w=>{w.preventDefault(),E.current?E.current.paused?(E.current.play(),z(!0)):(E.current.pause(),z(!1)):z(!O)},className:"before:block before:z-10 before:content-[''] before:inset-0 before:h-full before:w-full before:absolute relative w-full h-full md:pointer-events-none",children:[p.__typename==="ExternalVideo"&&m.jsx(pe,{data:{...p,...A(p)},options:{controls:0,muted:1,autoplay:a===v?1:0,loop:1,playsinline:1,rel:0},height:"100%",width:"100%",className:"pointer-events-none aspect-video h-auto",rel:"

10",loading:v===0?"eager":"lazy"}),p.__typename==="Video"&&a===v&&m.jsx(me,{data:p,height:"100%",width:"100%",autoPlay:!0,muted:!0,playsInline:!0,loop:!0,controls:!1,ref:D,className:T("object-cover size-full max-h-full object-center",d)})]}):s&&m.jsx(W,{loading:v===0?"eager":"lazy",fetchPriority:v===0?"high":"auto",data:s,aspectRatio:void 0,height:(s==null?void 0:s.height)||"100%",width:(s==null?void 0:s.width)||"100%",sizes:"(min-width: 48em) 60vw, 90vw",className:T("max-h-full fadeIn",d)})},p.id||(s==null?void 0:s.id))})}),a===0&&m.jsx(Ee,{product:B})]})})]})};function Te({className:t,thumbnailPosition:u="left",showThumbnails:o=!0,carouselItemClassName:i,imageAndVideoClassName:r,onPdp:h=!1}){var e,a,l,c;const{product:g,productVariantsMedia:d}=n.useContext(X),f=ne("root");if(!g||!((e=g.selectedVariant)!=null&&e.image))return null;const b=(a=f==null?void 0:f.featureFlags)!=null&&a.enableCarouselIslandDots&&((l=g==null?void 0:g.carouselTrackerStyle)==null?void 0:l.value)==="island"?"island":"below";return m.jsx("div",{className:`${t}`,children:m.jsx(n.Suspense,{fallback:m.jsx(K,{fallbackImage:(c=g.selectedVariant)==null?void 0:c.image,thumbnailPosition:u,showThumbnails:o,carouselItemClassName:i,imageAndVideoClassName:r,onPdp:h,dotsVariant:b}),children:m.jsx(re,{resolve:d,children:x=>{var O,z,E,L,_;return m.jsx(K,{media:(O=x==null?void 0:x.product)==null?void 0:O.media.nodes,variantImages:(z=x==null?void 0:x.product)==null?void 0:z.variantImages,variantImageUrl:(L=(E=g.selectedVariant)==null?void 0:E.image)==null?void 0:L.url,fallbackImage:(_=g.selectedVariant)==null?void 0:_.image,thumbnailPosition:u,showThumbnails:o,carouselItemClassName:i,imageAndVideoClassName:r,onPdp:h,dotsVariant:b})}})})})}export{Te as P};
2//# sourceMappingURL=ProductGallery-BX996KDW.js.map