@dropins/storefront-pdp 0.5.0-beta1 → 0.5.0-beta3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsxs as X,jsx as n,Fragment as Ae}from"@dropins/tools/preact-jsx-runtime.js";import*as fe from"@dropins/tools/preact-compat.js";import{useState as G,Children as ue,useRef as Le,useMemo as Ne,useEffect as ne,useCallback as ie}from"@dropins/tools/preact-compat.js";import{debounce as xe,classes as I,VComponent as F,toLanguageTag as Me,Slot as ee}from"@dropins/tools/lib.js";import{Button as Pe,Icon as Se,Price as ge,Picker as qe,ColorSwatch as je,ImageSwatch as Xe,TextSwatch as Fe,Incrementer as Ge,Breadcrumbs as De,Image as Oe}from"@dropins/tools/components.js";import{useText as Y}from"@dropins/tools/i18n.js";import{cloneElement as Ye}from"@dropins/tools/preact.js";import{c as Te,d as Be}from"../chunks/getRefinedProduct.js";import{events as ke}from"@dropins/tools/event-bus.js";import{c as We}from"../chunks/initialize.js";import"@dropins/tools/fetch-graphql.js";const Ke=e=>fe.createElement("svg",{width:24,height:24,viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",...e},fe.createElement("path",{d:"M7.74512 9.87701L12.0001 14.132L16.2551 9.87701",stroke:"currentColor",strokeWidth:1.5,strokeLinecap:"square",strokeLinejoin:"round"})),Ve=e=>fe.createElement("svg",{width:24,height:24,viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",...e},fe.createElement("path",{vectorEffect:"non-scaling-stroke",d:"M18.3599 5.64001L5.62988 18.37",stroke:"currentColor"}),fe.createElement("path",{vectorEffect:"non-scaling-stroke",d:"M18.3599 18.37L5.62988 5.64001",stroke:"currentColor"})),Ze=24,Ee=16,ve=2,Qe="32";var ze=(e=>(e[e.small=16]="small",e[e.medium=24]="medium",e[e.large=64]="large",e))(ze||{});const ye=({show:e=1,scrollbar:o=!1,peak:m=!1,arrows:p=!1,controls:i="dots",arrowsOnMainImage:w=!1,loop:u=!1,gap:f=null,direction:l="horizontal",width:K="100%",height:c="100%",defaultIndex:v=0,className:z,children:x,thumbnails:U=null,isZoomed:Q,...le})=>{const ae=Y("PDP.Carousel.label").label,r=Y("PDP.Carousel.Slide.label").label,y=Y("PDP.Carousel.Previous.label").label,b=Y("PDP.Carousel.Next.label").label,N=Y("PDP.Carousel.Controls.label").label,L=Y("PDP.Carousel.Controls.Button.label").label,[P,g]=G(()=>$e(e)),s=Math.ceil(ue.count(x)/P),t=m?Ze:0,W=f?ze[f]:0,O=ue.count(x)%P,[D,ce]=G(u?te()?v-1:v+1:v),Z=Le([]),[R,se]=G(0),[re,be]=G(0),_e=Ne(()=>ue.toArray(U),[U]),H=Ne(()=>{const a=ue.toArray(x).reduce((h,M,A)=>A%P===0?[...h,[M]]:[...h.slice(0,-1),[...h[h.length-1],M]],[]);return!u||a.length===1?a:u&&ue.count(x)%P===0?[a[s-1]].concat(a).concat([a[0],a[1]]):[ue.toArray(x).slice(-P)].concat(a).concat([a[0],a[1]])},[x,P,s,u]),J=Le(null),de=Le(null),k=i==="thumbnailsRow"||i==="thumbnailsColumn";ne(()=>{const a=document.body,h=xe(()=>{var E,oe;se(((E=J.current)==null?void 0:E.offsetWidth)??0),be(((oe=J.current)==null?void 0:oe.offsetHeight)??0);const A=window.innerWidth,B=$e(e,A);B!==P&&g(B)},50),M=new ResizeObserver(h);return M.observe(a),()=>{M.unobserve(a)}},[P,e]);const C=ie(a=>{const h=u?a-1:a,M=Z==null?void 0:Z.current[0],A=(M==null?void 0:M.offsetWidth)+Ee,B=(M==null?void 0:M.offsetHeight)+Ee,E=de.current,oe=i==="thumbnailsRow",we=i==="thumbnailsColumn",he=oe?E==null?void 0:E.offsetWidth:E==null?void 0:E.offsetHeight,j=oe?A:B;(oe||we)&&he&&(j*(h+1)>he&&(E.style.scrollBehavior="smooth",oe?E.scrollLeft=te()?E.scrollWidth-E.clientWidth-(h+ve)*j:(h+ve)*j:E.scrollTop=(h+ve)*j),(te()&&(oe?E.scrollLeft:E.scrollTop)<=-j*h||!te()&&(oe?E.scrollLeft:E.scrollTop)>j*h)&&(E.style.scrollBehavior="smooth",oe?E.scrollLeft=te()?-(h-ve)*j:(h-ve)*j:E.scrollTop=(h-ve)*j))},[i,u]);ne(()=>{C(D)},[D,C]);const V=ie((a,h,M)=>{k&&C(a);const A=J.current,B=t?A.offsetWidth-t:A.offsetWidth-t+W;if(!Array.from(A.querySelectorAll("[data-index]")).filter(he=>{const j=Number(he.getAttribute("data-index"));return!isNaN(j)&&j>-1})[a])return;if(M){const he=a===0?s:0,j=B*(s+(O||P)/P);if(te()){if(A.scrollLeft<=0&&A.scrollLeft>-(B-5)){V(1,!0);return}if(A.scrollLeft<B-j&&A.scrollLeft>=-j){V(s,!0);return}A.style.scrollBehavior="auto",A.scrollLeft=he===0?0:-j,V(he===0?1:s,!0)}else{if(A.scrollLeft>=0&&A.scrollLeft<B-5){V(1,!0);return}if(A.scrollLeft>j-B&&A.scrollLeft<=j){V(s,!0);return}A.style.scrollBehavior="auto",A.scrollLeft=he===0?0:j,V(he===0?1:s,!0);return}}const we=(A.offsetWidth-W)/P*H[a].length-t;A.style.scrollBehavior=h?"smooth":"auto",A.scrollLeft=te()?-(H[a].length===P?B*a:B*(a-1)-we):H[a].length===P?B*a:B*(a-1)+we},[W,s,t,P,O,H,C,i]),pe=ie(()=>{if(u){const h=D-1;V(h,!0,te()?D===s-1:D===1);return}const a=D<=0?0:D-1;V(a,!0)},[D,V,u]),me=ie(()=>{const a=H.length-1;if(u){const M=D+1;V(M,!0,te()?D===0:D===s);return}const h=D>=a?a:D+1;V(h,!0)},[H.length,u,D,V,s]);ne(()=>{const a=h=>{h.key==="ArrowLeft"&&(h.preventDefault(),te()?me():pe()),h.key==="ArrowRight"&&(h.preventDefault(),te()?pe():me())};return window.addEventListener("keydown",a),()=>{window.removeEventListener("keydown",a)}},[me,pe]),ne(()=>{V(u?v+1:v,!1)},[v,V,u]);const d=xe(()=>{const a=J.current,h=t?a.offsetWidth-t:a.offsetWidth-t+W,M=Math.abs(a.scrollLeft)/h,A=Math.abs(Math.round(M)-M<1?Math.round(M):Math.ceil(M));if(k&&C(A),u){const B=h*(s+(O||P)/P),E=te()?-a.scrollLeft:a.scrollLeft;if(Math.ceil(Math.abs(E))>=Math.ceil(B)-5){a.style.scrollBehavior="auto",a.scrollLeft=te()?-a.offsetWidth+(Math.ceil(E)-Math.ceil(B)-t):a.offsetWidth+(Math.ceil(E)-Math.ceil(B)-t);return}if(Math.abs(E)===0){a.style.scrollBehavior="auto",a.scrollLeft=te()?-(B-a.offsetWidth+t):B-a.offsetWidth+t;return}}D!==A&&ce(A)},100);ne(()=>{const a=J.current;return a==null||a.addEventListener("scroll",d),()=>{a==null||a.removeEventListener("scroll",d)}},[d]);const _=(a,h,M)=>n(Pe,{className:I([["pdp-carousel__button",!a],[`pdp-carousel__button--${h}`,!a],[`pdp-carousel__button--${i}`,a]]),style:{"--height":`${re}px`},variant:"tertiary","aria-label":h==="next"?b:y,onClick:M,disabled:u?!1:h==="next"?D>=H.length-1:D<1,children:n(Se,{className:I([["pdp-carousel__button__icon",!a],[`pdp-carousel__button__icon--${h}`,!a],[`pdp-carousel__button__icon--${i}--${h}`,a]]),size:Qe,source:Ke})}),S=p&&H.length!=1&&_(k,"prev",pe),T=p&&H.length!=1&&_(k,"next",me),q=p&&H.length!=1&&_(!1,"prev",pe),$=p&&H.length!=1&&_(!1,"next",me);return X("div",{role:"region","aria-roledescription":ae,className:I(["pdp-carousel",["pdp-carousel--main-image-controls",w],["pdp-carousel--arrows",p&&!k],[`pdp-carousel--${i}`,k],z]),style:{"--flex-carousel":i==="thumbnailsColumn"?"row-reverse":"column","--gap":k?"0":"var(--spacing-small)","--width":K},...le,children:[n("div",{ref:J,className:I(["pdp-carousel__wrapper",`pdp-carousel__wrapper--${l}`,["pdp-carousel__wrapper--scrollbar",o],["pdp-carousel__wrapper--peak",m]]),style:{"--total-width":i==="thumbnailsColumn"?"81.6%":"100%","--height":i==="thumbnailsColumn"?"auto":c,"--gap":f?`var(--spacing-${f})`:"0px","--per-page":P},tabIndex:0,children:H.map((a,h)=>{const M=a.length<P;return n("div",{role:"group","aria-roledescription":r,"data-index":h,className:I(["pdp-carousel__slide",`pdp-carousel__slide--${l}`,["pdp-carousel__slide--active",D===h],["pdp-carousel__slide--orphan",M]]),style:{"--length":a.length},children:a},h)})}),!k&&X(Ae,{children:[S,T]}),k&&w&&X(Ae,{children:[q,$]}),i&&H.length!=1&&X("div",{className:I([[`pdp-carousel__controls__container--${i}`,k],["pdp-carousel__controls__container--no-arrows",!p||w]]),style:{"--width":i==="thumbnailsRow"?`${R}px`:K,"--height":`${re}px`,"--nr-thumbnails":_e.length},children:[(k||Q)&&!w&&S,n("div",{ref:de,className:I([[`pdp-carousel__controls__wrapper--${i}`,k],["pdp-carousel__controls__wrapper",k]]),children:n("div",{role:"group","aria-label":N,className:I(["pdp-carousel__controls",[`pdp-carousel__controls--${i}`,k]]),children:(u?H.slice(0,s):H).map((a,h)=>{const M=u?s:H.length,A=u?D-1===h:D===h;return k?X("label",{className:I(["pdp-carousel__thumbnail__container"]),ref:B=>{B&&(Z.current[h]=B)},children:[n("input",{type:"radio",name:"carousel-thumbnails","aria-label":L.replace("{key}",String(h+1)).replace("{total}",String(M)),checked:A&&R!==0,onChange:()=>{V(u?h+1:h,!0)},...le,className:I(["pdp-carousel__thumbnail",["pdp-carousel__thumbnail--selected",A&&R!==0]])}),n("span",{className:I(["pdp-carousel__thumbnail__span"]),children:_e[h]})]},h):n("button",{"aria-label":L.replace("{key}",String(h+1)).replace("{total}",String(M)),onClick:()=>{V(u?h+1:h,!0)},className:I(["pdp-carousel__controls__button",["pdp-carousel__controls__button--active",A]])},h)})})}),(k||Q)&&!w&&T]})]})};function $e(e,o=0){if(typeof e=="number")return e;const{small:m,medium:p,large:i}=e,u=[{breakpoint:1024,value:i},{breakpoint:786,value:p},{breakpoint:0,value:m}].find(({breakpoint:f})=>o>f);return u?u.value:m}function te(){return document.documentElement.dir==="rtl"}const Je=({title:e,breadcrumbs:o,galleryContent:m,infoContent:p,productContent:i,sku:w,outOfStock:u,shortDescription:f,description:l,attributes:K,images:c,options:v,price:z,specialPrice:x,className:U,children:Q,quantity:le,actions:ae,carouselConfig:r,zoomType:y="overlay",closeButton:b=!0,...N})=>{var ce,Z,R,se,re,be,_e,H,J;const L=Y("PDP.Product.RegularPrice.label").label,P=Y("PDP.Product.SpecialPrice.label").label,g=Y("PDP.Product.OutOfStock.label").label,s=Y("PDP.Product.Image.label").label,[t,W]=G(null),O=c!=null&&c.length?c.map((de,k)=>{var V;const C=((V=e==null?void 0:e.props)==null?void 0:V.children)&&(s==null?void 0:s.replace("{product}",e.props.children.toString()).replace("{key}",String(k+1)).replace("{total}",String(c.length)));return y==="zoom"?n(at,{closeButton:b,children:n(F,{node:de,loading:k===0?"eager":"lazy",alt:C},k)}):n(F,{node:de,loading:k===0?"eager":"lazy",alt:C,onClick:()=>W(k)},k)}):n("img",{src:"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7",className:"pdp-product__images__placeholder","aria-hidden":!0}),D=(ce=r==null?void 0:r.thumbnails)!=null&&ce.length?r.thumbnails.map((de,k)=>{var C;return n(F,{node:de,loading:(r==null?void 0:r.thumbnailsLoadingMode)||"lazy",alt:((C=e==null?void 0:e.props)==null?void 0:C.children)&&(s==null?void 0:s.replace("{product}",e.props.children.toString()).replace("{key}",String(k+1)).replace("{total}",String(c.length)))},k)}):n("img",{src:"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7",className:"pdp-product__images__placeholder","aria-hidden":!0});return X("div",{...N,className:I(["pdp-product",U]),children:[o&&n(F,{node:o,className:"pdp-product__breadcrumbs"}),X("div",{className:"pdp-product__column-container pdp-product__gallery-column",children:[n("div",{className:"pdp-product__column-body",children:(Z=r==null?void 0:r.controls)!=null&&Z.desktop?n(ye,{className:"pdp-product__overlay__carousel",arrows:(c==null?void 0:c.length)>1,controls:(c==null?void 0:c.length)>1?r.controls.desktop:"dots",arrowsOnMainImage:r==null?void 0:r.arrowsOnMainImage,loop:(r==null?void 0:r.loopable)&&(c==null?void 0:c.length)>1,peak:((R=r==null?void 0:r.thumbnails)==null?void 0:R.length)>1&&((se=r==null?void 0:r.peak)==null?void 0:se.desktop)||!1,gap:(r==null?void 0:r.gap)||null,width:"100%",height:"100%",defaultIndex:t||0,thumbnails:D,children:O}):n(Ce,{className:"pdp-product__images",gap:"small",children:O})}),m&&n(F,{node:m,className:"pdp-product__gallery-content"})]}),X("div",{className:"pdp-product__column-container pdp-product__content-column",children:[X("div",{className:"pdp-product__column-body",children:[X("div",{className:"pdp-product__header",children:[e&&n(F,{node:e,className:"pdp-product__title"}),w&&n(F,{node:w,className:"pdp-product__sku"})]}),X("div",{className:"pdp-product__prices",children:[x&&n(F,{node:x,className:I(["pdp-product__price-special","pdp-product__price"]),"aria-label":P,role:"text"}),z&&n(F,{node:z,className:I(["pdp-product__price-regular","pdp-product__price--grey"]),"aria-label":L,role:"text"})]}),(re=r==null?void 0:r.controls)!=null&&re.mobile&&((be=r==null?void 0:r.controls)==null?void 0:be.mobile)==="thumbnailsRow"?n(ye,{className:"pdp-product__images pdp-product__images--carousel pdp-product__images--carousel--thumbnails",width:"100%",height:"auto",arrows:(c==null?void 0:c.length)>1,controls:(c==null?void 0:c.length)>1?"thumbnailsRow":null,loop:(r==null?void 0:r.loopable)&&(c==null?void 0:c.length)>1,peak:((_e=r==null?void 0:r.thumbnails)==null?void 0:_e.length)>1&&((H=r==null?void 0:r.peak)==null?void 0:H.mobile)||!1,gap:(r==null?void 0:r.gap)||null,thumbnails:D,children:O}):n(ye,{className:"pdp-product__images pdp-product__images--carousel",peak:((J=r==null?void 0:r.peak)==null?void 0:J.mobile)&&(c==null?void 0:c.length)>1,gap:(r==null?void 0:r.gap)||null,width:"100%",height:"auto",arrows:(c==null?void 0:c.length)>1,controls:(c==null?void 0:c.length)>1?"dots":null,loop:(r==null?void 0:r.loopable)&&(c==null?void 0:c.length)>1,children:O}),X("div",{className:I(["pdp-product__actions",["pdp-product__actions--out-of-stock",u]]),children:[u&&n("div",{className:"pdp-product__out-of-stock__text",children:g}),v&&n(F,{node:v,className:I(["pdp-product__options"])}),le&&n("div",{className:"pdp-product__quantity",children:n(F,{node:le})}),ae&&n(F,{node:ae,className:I(["pdp-product__buttons"])})]}),f&&n(F,{node:f,className:I(["pdp-product__short_description"])}),l&&n(F,{node:l,className:I(["pdp-product__description"])}),K?n("div",{className:"pdp-product__attributes",children:K}):null]}),p&&n(F,{node:p,className:"pdp-product__info-content"})]}),i&&n(F,{node:i,className:"pdp-product__content"}),t===null?null:n(et,{className:"pdp-product__overlay",onClose:()=>W(null),centered:!0,children:n(ye,{className:"pdp-product__overlay__carousel",arrows:(c==null?void 0:c.length)>1,width:"100%",height:"100%",defaultIndex:t||0,loop:(r==null?void 0:r.loopable)&&(c==null?void 0:c.length)>1,controls:(c==null?void 0:c.length)>1?"dots":null,isZoomed:!0,children:O})})]})},Ce=({children:e,gap:o=null,className:m,style:p,...i})=>{const w=ue.count(e);return n("div",{...i,className:I(["pdp-gallery-grid",m]),style:{"--gap":o?`var(--spacing-${o})`:"0px",...p},children:ue.map(e,(u,f)=>n("div",{className:"pdp-gallery-grid__item",children:n(F,{node:u,loading:f===0?"eager":"lazy"},u.props.src)},w+f))})},Ie=({amount:e,currency:o,locale:m,variant:p,sale:i,minimumAmount:w,maximumAmount:u,className:f,...l})=>n(Ae,{children:e||w===u?n("div",{className:"pdp-price-range",...l,children:n(ge,{amount:e||w,currency:o,locale:m,variant:p,sale:i,className:f})}):X("div",{className:"pdp-price-range",...l,children:[n(ge,{amount:w,currency:o,locale:m,className:f}),n("span",{className:"pdp-price-range__label",children:"-"}),n(ge,{amount:u,currency:o,locale:m,className:f})]})}),et=({centered:e,onClose:o,className:m,children:p,...i})=>{const w=Y("PDP.Overlay.Close.label").label,u=ie(()=>{o==null||o()},[o]);return ne(()=>{const f=l=>{l.key==="Escape"&&u()};return document.addEventListener("keydown",f),()=>{document.removeEventListener("keydown",f)}},[u]),ne(()=>{const f=document.scrollingElement,l=f.style.overflow;return f.style.overflow="hidden",()=>{f.style.overflow=l}},[]),X("div",{...i,className:I(["pdp-overlay",["pdp-overlay--centered",e],m]),children:[n("div",{className:"pdp-overlay__content",children:p}),n(Pe,{"aria-label":w,variant:"tertiary",className:"pdp-overlay__close-button",onClick:u,icon:n(Ve,{})})]})},tt=["text","image","color","dropdown"],nt=e=>e.map(o=>({...o,text:o.label,disabled:!o.inStock}));function rt(e,o){return e.reduce((m,p)=>{const i=o==null?void 0:o.find(u=>u.items.find(f=>f.id===p));if(!i)return m;const w=i.items.find(u=>u.id===p);return{...m,[i.id]:{label:w.label,value:w.id}}},{})}const lt=({options:e,hideSelectedValue:o,disablePreselections:m,selectedUIDs:p,onValues:i,onErrors:w,defaultOptions:u,selectionsToUpdate:f,className:l,children:K,...c})=>{const v=Y("PDP.Swatches.Required.label").label,z=Y("PDP.Swatches.ChooseOption.label").label,[x,U]=G(()=>e==null?void 0:e.reduce((y,b)=>{const{items:N}=b,L=N==null?void 0:N.find(g=>u==null?void 0:u.includes(g.id)),P=N==null?void 0:N.find(g=>g.selected);return L?{...y,[b.id]:{label:L.label,value:L.id}}:P?{...y,[b.id]:{label:P.label,value:P.id}}:y},{}));ne(()=>{if(p){const r=rt(p,e);if(JSON.stringify(r)===JSON.stringify(x))return;Q(Object.keys(r)[0],r[Object.keys(r)[0]].label,p[0])}},[p]),ne(()=>{f==null||f.forEach(r=>{U(y=>{var L;const b=(L=r==null?void 0:r.items)==null?void 0:L.find(P=>P.selected);return b?{...y,[r.id]:{label:b==null?void 0:b.label,value:b==null?void 0:b.id}}:y})})},[f,U]),Ne(()=>{const r=e==null?void 0:e.reduce((y,b)=>{var L;let N=!1;return(L=b==null?void 0:b.items)==null||L.forEach(P=>{var s;((s=x[b.id])==null?void 0:s.value)===P.id&&(N=!0)}),b.required&&!N&&(y[b.id]=v),y},{});return w==null||w(r),r},[x]);const Q=ie((r,y,b)=>{U(N=>{const L={...N,[r]:{label:y,value:b}};return i==null||i(L,b),L})},[i]),le=(r,y)=>{var N;const b=((N=y.selectedOptions[0])==null?void 0:N.label)??"";Q(r,b,y.value)},ae=ie(({items:r,id:y,required:b,type:N,selected:L,label:P})=>(r==null?void 0:r.length)>0&&n("div",{className:I(["pdp-swatches__options"]),children:(N==null?void 0:N.toLowerCase())==="dropdown"?n(qe,{"aria-label":P,placeholder:m?z:void 0,handleSelect:g=>le(y,g.target),options:nt(r),value:L}):r==null?void 0:r.map(g=>{const s={key:g.id,id:g.id,name:y,value:g.value,label:g.label,groupAriaLabel:P,selected:L===g.id,outOfStock:!g.inStock,required:b===null?!0:b,onValue:()=>{Q(y,g.label,g.id)}};switch(N){case"text":return n(Fe,{...s,label:g.label});case"image":return n(Xe,{...s,src:g.value,alt:g.label});case"color":return n(je,{...s,size:"large",color:g.value});default:return console.warn(`Invalid swatch type ${N}`),null}})}),[Q]);return n("div",{...c,className:I(["pdp-swatches",l]),children:e==null?void 0:e.map(({type:r,label:y,id:b,multiple:N,required:L,items:P})=>{var g;return tt.includes(r)||console.warn(`Invalid swatch type ${r}`),N&&console.warn("Multiple selection swatches are not currently supported."),X("div",{id:`swatch-item-${b}`,"data-slot-key":`product-swatch--${b}`,className:"pdp-swatches__field",children:[n("div",{className:"pdp-swatches__field__label",children:x[b]?o?`${y}`:`${y}: ${x[b].label}`:y}),n(ae,{id:b,type:r,required:L,items:P,label:y,selected:(g=x[b])==null?void 0:g.value})]},`swatch-item-${b}`)})})},at=({children:e,scale:o=2,closeButton:m=!0})=>{const[p,i]=G(!1),[w,u]=G("pdp-zoom"),[f,l]=G(!1),[K,c]=G({x:0,y:0}),[v,z]=G({x:0,y:0}),[x,U]=G({x:0,y:0}),Q=s=>{!p||s.type!=="touchstart"||(c({x:s.touches[0].clientX,y:s.touches[0].clientY}),z({x:x.x,y:x.y}),l(!0))},le=s=>{var re;if(!f||s.type!=="touchmove")return;const t=(re=s.currentTarget)==null?void 0:re.getBoundingClientRect(),W=(100-100/o)/2,O=s.touches[0].clientX-K.x,D=s.touches[0].clientY-K.y,ce=O*100/(t.width*o),Z=D*100/(t.height*o),R=v.x+ce,se=v.y+Z;U({x:Math.max(-W,Math.min(R,W))||0,y:Math.max(-W,Math.min(se,W))||0}),s.preventDefault()},ae=s=>{var Z;const t=(Z=s.currentTarget)==null?void 0:Z.getBoundingClientRect(),W=(100-100/o)/2;let O;if("touches"in s)O=s.touches[0];else if(s instanceof MouseEvent)O=s;else return;const D=W-(O.clientX-t.left)/t.width*100,ce=W-(O.clientY-t.top)/t.height*100;U({x:Math.max(-W,Math.min(D,W))||0,y:Math.max(-W,Math.min(ce,W))||0})},r=s=>{if(!f){if(p){if(m&&"touches"in s){Q(s);return}m||i(!1)}else i(!0),ae(s);s.preventDefault()}},y=s=>{if(m&&"touches"in s){le(s);return}p&&ae(s)},b=()=>{if(m){l(!1);return}i(!1)},N=s=>{i(!1),s.stopPropagation()},L=p?`scale(${o}) translateX(${x.x}%) translateY(${x.y}%)`:"none",P=Y("PDP.Zoom.Close.label").label,g=Ye(ue.only(e),{draggable:!1,style:{"--transform":L}});return ne(()=>{u(p?`pdp-zoom ${m?"pdp-zoom--no-effects":"pdp-zoom--zoomed"}`:"pdp-zoom")},[p,m]),X("figure",{className:w,onClick:r,onMouseMove:y,onMouseLeave:b,onTouchStart:r,onTouchMove:y,onTouchEnd:b,children:[g,m&&p&&n(Pe,{"aria-label":P,variant:"tertiary",className:"pdp-zoom__close-button",icon:n(Ve,{}),onClick:N})]})};function ct(e,o="en_US"){if(!Ue(e))throw Error("Invalid date string");return e.split(" ")[1]||(e=`${e} 00:00:00`),new Date(e).toLocaleDateString(Me(o)).toString()}function Ue(e){if(![/^\d{4}-\d{2}-\d{2}$/,/^\d{1,2}\/\d{1,2}\/\d{4}$/,/^\d{2}\/\d{2}\/\d{4}$/,/^\d{4}\/\d{2}\/\d{2}$/,/^\d{1,2}\.\d{1,2}\.\d{4}$/,/^\d{4}-\d{2}-\d{2} \d{2}:\d{2}:\d{2}$/].some(p=>p.test(e)))return!1;const m=new Date(e);return!isNaN(m.getTime())}function ot(e){const o=new URLSearchParams(window.location.search);Object.entries(e).forEach(([p,i])=>{i===null?o.delete(p):o.set(p,String(i))});let m=window.location.pathname;m+=`?${o.toString()}`,m+=window.location.hash,window.history.replaceState({},"",m)}function it(){const e=new URLSearchParams(window.location.search),o={};return e.forEach((m,p)=>{o[p]=m}),o}function st(e){var o,m,p,i,w,u,f,l,K,c,v,z;return{productId:Number(e==null?void 0:e.externalId),name:e==null?void 0:e.name,sku:(e==null?void 0:e.variantSku)||(e==null?void 0:e.sku),topLevelSku:e==null?void 0:e.sku,specialToDate:void 0,specialFromDate:void 0,newToDate:void 0,newFromDate:void 0,createdAt:void 0,updatedAt:void 0,manufacturer:void 0,countryOfManufacture:void 0,categories:void 0,productType:void 0,pricing:{regularPrice:((m=(o=e==null?void 0:e.prices)==null?void 0:o.regular)==null?void 0:m.amount)||0,minimalPrice:(i=(p=e==null?void 0:e.prices)==null?void 0:p.final)==null?void 0:i.minimumAmount,maximalPrice:(u=(w=e==null?void 0:e.prices)==null?void 0:w.final)==null?void 0:u.maximumAmount,specialPrice:(l=(f=e==null?void 0:e.prices)==null?void 0:f.final)==null?void 0:l.amount,tierPricing:void 0,currencyCode:((c=(K=e==null?void 0:e.prices)==null?void 0:K.final)==null?void 0:c.currency)||"USD"},canonicalUrl:e==null?void 0:e.url,mainImageUrl:(z=(v=e==null?void 0:e.images)==null?void 0:v[0])==null?void 0:z.url}}const dt={PRODUCT_CONTEXT:"productContext"},ht={PRODUCT_PAGE_VIEW:"product-page-view"};function He(){return window.adobeDataLayer=window.adobeDataLayer||[],window.adobeDataLayer}function ut(e,o){const m=He();m.push({[e]:null}),m.push({[e]:o})}function pt(e,o){He().push(p=>{const i=p.getState?p.getState():{};p.push({event:e,eventInfo:{...i,...o}})})}function Re(e){const o=st(e);ut(dt.PRODUCT_CONTEXT,o),pt(ht.PRODUCT_PAGE_VIEW)}const mt=({sku:e,hideSku:o,hideQuantity:m,hideShortDescription:p,hideDescription:i,hideAttributes:w,hideURLParams:u,hideSelectedOptionValue:f,slots:l,children:K,initialData:c,carousel:v,optionsConfig:z,useACDL:x,onAddToCart:U,zoomType:Q,closeButton:le=!0,disableDropdownPreselection:ae,...r})=>{var C,V,pe,me;const y=Y("PDP.Product.AddToCart.label").label,b=Y("PDP.Product.Incrementer.label").label,N=Y("PDP.Product.Details.label").label,[L,P]=G(We.getConfig().defaultLocale||"en-US"),[g,s]=G(),[t=null,W]=G(c),[O,D]=G(()=>{const d={sku:e,quantity:1};return t!=null&&t.optionUIDs&&(d.optionsUIDs=t.optionUIDs),d}),[ce,Z]=G(()=>{var d,_;return!(t!=null&&t.options&&((d=t==null?void 0:t.options)==null?void 0:d.length)>0&&((_=t==null?void 0:t.optionUIDs)==null?void 0:_.length)!==(t==null?void 0:t.options.length))}),R={data:t,values:O,valid:ce};function se(d){return d==null?void 0:d.some(_=>(_==null?void 0:_.typename)==="ProductViewOptionValueProduct")}ne(()=>{const d=ke.on("pdp/setValues",_=>{D(S=>({...S,..._}))});return()=>{d==null||d.off()}},[]),ne(()=>{const d=ke.on("locale",_=>{_!==L&&(P(_),Te(e).then(W))});return()=>{d==null||d.off()}},[L,e]),ne(()=>{x&&c&&Object.keys(c).length>0&&Re(c)},[c]);const re=ie(d=>{D(_=>({..._,...d}))},[]);ne(()=>{ke.emit("pdp/values",O)},[JSON.stringify(O)]);const be=ie(d=>{var T,q;let _=Object.keys(d).map($=>d[$].value).filter($=>$!==void 0);!u&&(t!=null&&t.options)&&!se(t.options)&&ot({optionsUIDs:_.join(",")}),re({optionsUIDs:_}),Z((_==null?void 0:_.length)===((T=t==null?void 0:t.options)==null?void 0:T.length));const S=(q=t==null?void 0:t.options)==null?void 0:q.some($=>se([$]));Be(e,_,z==null?void 0:z.anchorOptions,S).then($=>{var a;W($),(a=z==null?void 0:z.anchorOptions)!=null&&a.length&&_e($,_),x&&($==null?void 0:$.variantSku)!==e&&Re($)})},[e]),_e=ie((d,_)=>{var q;const S=(d==null?void 0:d.optionUIDs)??[];_.every($=>S.includes($))||(s(d==null?void 0:d.options),re({optionsUIDs:S}),Z((S==null?void 0:S.length)===((q=d==null?void 0:d.options)==null?void 0:q.length)))},[e]),H=ie(d=>{Object.keys(d).length!==0&&Z(!1)},[]),J=Ne(()=>{var d;return(d=t==null?void 0:t.attributes)==null?void 0:d.map(({label:_,value:S},T)=>{const q=Ue(S)?ct(S,L):S.toString();return X("li",{children:[_,": ",n("span",{dangerouslySetInnerHTML:{__html:q}})]},T)})},[t==null?void 0:t.attributes,L]),de=!m&&(t!=null&&t.inStock)?n(ee,{name:"Quantity",slot:l==null?void 0:l.Quantity,context:{...R},children:n(Ge,{name:"quantity",defaultValue:O.quantity.toString(),value:O.quantity.toString(),min:1,"aria-label":b,className:"pdp-product__quantity",onValue:d=>{re({quantity:Number(d)})}},"quantity")}):void 0,k=()=>{if(t!=null&&t.options)return n(ee,{name:"Options",slot:l==null?void 0:l.Options,context:{...R},children:n(lt,{selectedUIDs:O.optionsUIDs,options:t.options,defaultOptions:O.optionsUIDs,selectionsToUpdate:g,hideSelectedValue:f,disablePreselections:ae,onValues:be,onErrors:H})})};return n("div",{...r,children:n(Je,{title:n(ee,{name:"Title",slot:l==null?void 0:l.Title,context:{...R},children:t==null?void 0:t.name}),sku:o?void 0:n(ee,{name:"SKU",slot:l==null?void 0:l.SKU,context:{...R},children:t==null?void 0:t.sku}),options:k(),breadcrumbs:(l==null?void 0:l.Breadcrumbs)&&n(ee,{name:"Breadcrumbs",slot:l==null?void 0:l.Breadcrumbs,context:{...R,setSeparator(d){this._registerMethod((..._)=>{const S=d(..._),T=S&&n(Se,{source:S});this._setProps(q=>({...q,separator:T,children:[n(De,{separator:T,categories:q.categories})]}))})},appendLink(d){this._registerMethod((..._)=>{const{text:S,...T}=d(..._),q=n("a",{...T,children:S});this._setProps($=>{const a=[...$.categories||[],q];return{...$,categories:a,children:[n(De,{separator:$.separator,categories:a})]}})})},appendHTMLElement(d){this._registerMethod((..._)=>{const S=d(..._),T=this._htmlElementToVNode(S);this._setProps(q=>{const $=[...q.categories||[],T];return{...q,categories:$,children:[n(De,{separator:q.separator,categories:$})]}})})}}}),quantity:de,actions:n(ee,{name:"Actions",slot:l==null?void 0:l.Actions,context:{...R,appendButton(d){this._registerMethod((..._)=>{const S=d(..._);if(!S)return;const{text:T,icon:q,...$}=S,a=n(Pe,{type:"button",...$,icon:q&&n(Se,{source:q}),children:T});this._setProps(h=>({children:[...h.children||[],a]}))})}},children:!(l!=null&&l.Actions)&&n(Pe,{size:"medium",type:"submit",icon:n(Se,{source:"Cart"}),disabled:!(t!=null&&t.inStock)||!ce,"aria-label":y,onClick:()=>U==null?void 0:U(O),children:y})}),shortDescription:p?void 0:n(ee,{name:"ShortDescription",slot:l==null?void 0:l.ShortDescription,context:{...R},children:n("div",{dangerouslySetInnerHTML:{__html:(t==null?void 0:t.shortDescription)??""}})}),description:i?void 0:n(ee,{name:"Description",slot:l==null?void 0:l.Description,context:{...R},children:n("div",{dangerouslySetInnerHTML:{__html:(t==null?void 0:t.description)??""}})}),images:((C=t==null?void 0:t.images)==null?void 0:C.map(({label:d,url:_})=>{var S,T;return n(Oe,{title:d,alt:d,src:_,width:((S=v==null?void 0:v.imageParams)==null?void 0:S.width)??960,height:((T=v==null?void 0:v.imageParams)==null?void 0:T.height)??1191,params:(v==null?void 0:v.imageParams)??{width:960}},_)}))??[],specialPrice:(V=t==null?void 0:t.prices)!=null&&V.visible?n(ee,{name:"SpecialPrice",slot:l==null?void 0:l.SpecialPrice,context:{...R},children:n(Ie,{...t.prices.final,locale:Me(L)})}):void 0,price:(pe=t==null?void 0:t.prices)!=null&&pe.visible&&t.prices.regular&&t.prices.final.amount!==(t==null?void 0:t.prices.regular.amount)?n(ee,{name:"RegularPrice",slot:l==null?void 0:l.RegularPrice,context:{...R},children:n(Ie,{...t.prices.regular,locale:Me(L)})}):void 0,zoomType:Q,closeButton:le,carouselConfig:{...v,thumbnails:v&&Object.keys(v).length?((me=t==null?void 0:t.images)==null?void 0:me.map(({label:d,url:_})=>{var S,T;return n(Oe,{title:d,alt:d,src:_,width:((S=v==null?void 0:v.thumbnailParams)==null?void 0:S.width)??200,height:((T=v==null?void 0:v.thumbnailParams)==null?void 0:T.height)??248,params:(v==null?void 0:v.thumbnailParams)??{width:200}},_)}))??[]:[]},outOfStock:!(t!=null&&t.inStock),attributes:w?void 0:n(ee,{name:"Attributes",slot:l==null?void 0:l.Attributes,context:{...R},children:J!=null&&J.length?X(Ae,{children:[N,n("ul",{children:J})]}):null}),galleryContent:(l==null?void 0:l.GalleryContent)&&n(ee,{name:"GalleryContent",slot:l.GalleryContent,context:{...R}}),infoContent:(l==null?void 0:l.InfoContent)&&n(ee,{name:"InfoContent",slot:l.InfoContent,context:{...R}}),productContent:(l==null?void 0:l.Content)&&n(ee,{name:"Content",slot:l.Content,context:{...R}})})})};mt.getInitialData=async function({sku:e,optionsConfig:o}){var f,l,K,c,v,z,x;function m(U){return U.some(Q=>Q.__typename==="ProductViewOptionValueProduct")}let p;const i=We.getConfig(),w=((f=it().optionsUIDs)==null?void 0:f.split(","))||((c=(K=(l=i==null?void 0:i.models)==null?void 0:l.ProductDetails)==null?void 0:K.initialData)==null?void 0:c.optionsUIDs),u=(z=(v=i==null?void 0:i.models)==null?void 0:v.ProductDetails)==null?void 0:z.initialData;return u&&Object.keys(u).length>0&&(p=(x=u.options)==null?void 0:x.some(U=>m(U==null?void 0:U.values))),w!=null&&w.length?await Be(e,w,o==null?void 0:o.anchorOptions,p):await Te(e)};export{mt as ProductDetails,mt as default};
|
|
1
|
+
import{jsxs as j,jsx as n,Fragment as Ae}from"@dropins/tools/preact-jsx-runtime.js";import*as fe from"@dropins/tools/preact-compat.js";import{useState as G,Children as he,useRef as Le,useMemo as Ne,useEffect as C,useCallback as se}from"@dropins/tools/preact-compat.js";import{debounce as Oe,classes as $,VComponent as F,toLanguageTag as Me,Slot as Q}from"@dropins/tools/lib.js";import{Button as Pe,Icon as Se,Price as ge,Picker as qe,ColorSwatch as je,ImageSwatch as Xe,TextSwatch as Fe,Incrementer as Ge,Breadcrumbs as De,Image as xe}from"@dropins/tools/components.js";import{useText as X}from"@dropins/tools/i18n.js";import{cloneElement as Ye}from"@dropins/tools/preact.js";import{c as Te,d as Be}from"../chunks/getRefinedProduct.js";import{events as ke}from"@dropins/tools/event-bus.js";import{c as We}from"../chunks/initialize.js";import"@dropins/tools/fetch-graphql.js";const Ke=e=>fe.createElement("svg",{width:24,height:24,viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",...e},fe.createElement("path",{d:"M7.74512 9.87701L12.0001 14.132L16.2551 9.87701",stroke:"currentColor",strokeWidth:1.5,strokeLinecap:"square",strokeLinejoin:"round"})),Ve=e=>fe.createElement("svg",{width:24,height:24,viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",...e},fe.createElement("path",{vectorEffect:"non-scaling-stroke",d:"M18.3599 5.64001L5.62988 18.37",stroke:"currentColor"}),fe.createElement("path",{vectorEffect:"non-scaling-stroke",d:"M18.3599 18.37L5.62988 5.64001",stroke:"currentColor"})),Ze=24,Ee=16,ve=2,Qe="32";var ze=(e=>(e[e.small=16]="small",e[e.medium=24]="medium",e[e.large=64]="large",e))(ze||{});const ye=({show:e=1,scrollbar:i=!1,peak:m=!1,arrows:p=!1,controls:s="dots",arrowsOnMainImage:y=!1,loop:u=!1,gap:P=null,direction:a="horizontal",width:Y="100%",height:o="100%",defaultIndex:b=0,className:R,children:M,thumbnails:W=null,isZoomed:Z,...re})=>{const le=X("PDP.Carousel.label").label,r=X("PDP.Carousel.Slide.label").label,w=X("PDP.Carousel.Previous.label").label,_=X("PDP.Carousel.Next.label").label,L=X("PDP.Carousel.Controls.label").label,O=X("PDP.Carousel.Controls.Button.label").label,[v,g]=G(()=>$e(e)),d=Math.ceil(he.count(M)/v),E=m?Ze:0,t=P?ze[P]:0,V=he.count(M)%v,[S,ae]=G(u?J()?b-1:b+1:b),K=Le([]),[te,z]=G(0),[ce,ue]=G(0),_e=Ne(()=>he.toArray(W),[W]),U=Ne(()=>{const l=he.toArray(M).reduce((c,D,N)=>N%v===0?[...c,[D]]:[...c.slice(0,-1),[...c[c.length-1],D]],[]);return!u||l.length===1?l:u&&he.count(M)%v===0?[l[d-1]].concat(l).concat([l[0],l[1]]):[he.toArray(M).slice(-v)].concat(l).concat([l[0],l[1]])},[M,v,d,u]),oe=Le(null),ne=Le(null),k=s==="thumbnailsRow"||s==="thumbnailsColumn";C(()=>{const l=document.body,c=Oe(()=>{var x,ie;z(((x=oe.current)==null?void 0:x.offsetWidth)??0),ue(((ie=oe.current)==null?void 0:ie.offsetHeight)??0);const N=window.innerWidth,I=$e(e,N);I!==v&&g(I)},50),D=new ResizeObserver(c);return D.observe(l),()=>{D.unobserve(l)}},[v,e]);const ee=se(l=>{const c=u?l-1:l,D=K==null?void 0:K.current[0],N=(D==null?void 0:D.offsetWidth)+Ee,I=(D==null?void 0:D.offsetHeight)+Ee,x=ne.current,ie=s==="thumbnailsRow",we=s==="thumbnailsColumn",de=ie?x==null?void 0:x.offsetWidth:x==null?void 0:x.offsetHeight,q=ie?N:I;(ie||we)&&de&&(q*(c+1)>de&&(x.style.scrollBehavior="smooth",ie?x.scrollLeft=J()?x.scrollWidth-x.clientWidth-(c+ve)*q:(c+ve)*q:x.scrollTop=(c+ve)*q),(J()&&(ie?x.scrollLeft:x.scrollTop)<=-q*c||!J()&&(ie?x.scrollLeft:x.scrollTop)>q*c)&&(x.style.scrollBehavior="smooth",ie?x.scrollLeft=J()?-(c-ve)*q:(c-ve)*q:x.scrollTop=(c-ve)*q))},[s,u]);C(()=>{ee(S)},[S,ee]);const T=se((l,c,D)=>{k&&ee(l);const N=oe.current,I=E?N.offsetWidth-E:N.offsetWidth-E+t;if(!Array.from(N.querySelectorAll("[data-index]")).filter(de=>{const q=Number(de.getAttribute("data-index"));return!isNaN(q)&&q>-1})[l])return;if(D){const de=l===0?d:0,q=I*(d+(V||v)/v);if(J()){if(N.scrollLeft<=0&&N.scrollLeft>-(I-5)){T(1,!0);return}if(N.scrollLeft<I-q&&N.scrollLeft>=-q){T(d,!0);return}N.style.scrollBehavior="auto",N.scrollLeft=de===0?0:-q,T(de===0?1:d,!0)}else{if(N.scrollLeft>=0&&N.scrollLeft<I-5){T(1,!0);return}if(N.scrollLeft>q-I&&N.scrollLeft<=q){T(d,!0);return}N.style.scrollBehavior="auto",N.scrollLeft=de===0?0:q,T(de===0?1:d,!0);return}}const we=(N.offsetWidth-t)/v*U[l].length-E;N.style.scrollBehavior=c?"smooth":"auto",N.scrollLeft=J()?-(U[l].length===v?I*l:I*(l-1)-we):U[l].length===v?I*l:I*(l-1)+we},[t,d,E,v,V,U,ee,s]),pe=se(()=>{if(u){const c=S-1;T(c,!0,J()?S===d-1:S===1);return}const l=S<=0?0:S-1;T(l,!0)},[S,T,u]),me=se(()=>{const l=U.length-1;if(u){const D=S+1;T(D,!0,J()?S===0:S===d);return}const c=S>=l?l:S+1;T(c,!0)},[U.length,u,S,T,d]);C(()=>{const l=c=>{c.key==="ArrowLeft"&&(c.preventDefault(),J()?me():pe()),c.key==="ArrowRight"&&(c.preventDefault(),J()?pe():me())};return window.addEventListener("keydown",l),()=>{window.removeEventListener("keydown",l)}},[me,pe]),C(()=>{T(u?b+1:b,!1)},[b,T,u]);const be=Oe(()=>{const l=oe.current,c=E?l.offsetWidth-E:l.offsetWidth-E+t,D=Math.abs(l.scrollLeft)/c,N=Math.abs(Math.round(D)-D<1?Math.round(D):Math.ceil(D));if(k&&ee(N),u){const I=c*(d+(V||v)/v),x=J()?-l.scrollLeft:l.scrollLeft;if(Math.ceil(Math.abs(x))>=Math.ceil(I)-5){l.style.scrollBehavior="auto",l.scrollLeft=J()?-l.offsetWidth+(Math.ceil(x)-Math.ceil(I)-E):l.offsetWidth+(Math.ceil(x)-Math.ceil(I)-E);return}if(Math.abs(x)===0){l.style.scrollBehavior="auto",l.scrollLeft=J()?-(I-l.offsetWidth+E):I-l.offsetWidth+E;return}}S!==N&&ae(N)},100);C(()=>{const l=oe.current;return l==null||l.addEventListener("scroll",be),()=>{l==null||l.removeEventListener("scroll",be)}},[be]);const h=(l,c,D)=>n(Pe,{className:$([["pdp-carousel__button",!l],[`pdp-carousel__button--${c}`,!l],[`pdp-carousel__button--${s}`,l]]),style:{"--height":`${ce}px`},variant:"tertiary","aria-label":c==="next"?_:w,onClick:D,disabled:u?!1:c==="next"?S>=U.length-1:S<1,children:n(Se,{className:$([["pdp-carousel__button__icon",!l],[`pdp-carousel__button__icon--${c}`,!l],[`pdp-carousel__button__icon--${s}--${c}`,l]]),size:Qe,source:Ke})}),f=p&&U.length!=1&&h(k,"prev",pe),A=p&&U.length!=1&&h(k,"next",me),B=p&&U.length!=1&&h(!1,"prev",pe),H=p&&U.length!=1&&h(!1,"next",me);return j("div",{role:"region","aria-roledescription":le,className:$(["pdp-carousel",["pdp-carousel--main-image-controls",y],["pdp-carousel--arrows",p&&!k],[`pdp-carousel--${s}`,k],R]),style:{"--flex-carousel":s==="thumbnailsColumn"?"row-reverse":"column","--gap":k?"0":"var(--spacing-small)","--width":Y},...re,children:[n("div",{ref:oe,className:$(["pdp-carousel__wrapper",`pdp-carousel__wrapper--${a}`,["pdp-carousel__wrapper--scrollbar",i],["pdp-carousel__wrapper--peak",m]]),style:{"--total-width":s==="thumbnailsColumn"?"81.6%":"100%","--height":s==="thumbnailsColumn"?"auto":o,"--gap":P?`var(--spacing-${P})`:"0px","--per-page":v},tabIndex:0,children:U.map((l,c)=>{const D=l.length<v;return n("div",{role:"group","aria-roledescription":r,"data-index":c,className:$(["pdp-carousel__slide",`pdp-carousel__slide--${a}`,["pdp-carousel__slide--active",S===c],["pdp-carousel__slide--orphan",D]]),style:{"--length":l.length},children:l},c)})}),!k&&j(Ae,{children:[f,A]}),k&&y&&j(Ae,{children:[B,H]}),s&&U.length!=1&&j("div",{className:$([[`pdp-carousel__controls__container--${s}`,k],["pdp-carousel__controls__container--no-arrows",!p||y]]),style:{"--width":s==="thumbnailsRow"?`${te}px`:Y,"--height":`${ce}px`,"--nr-thumbnails":_e.length},children:[(k||Z)&&!y&&f,n("div",{ref:ne,className:$([[`pdp-carousel__controls__wrapper--${s}`,k],["pdp-carousel__controls__wrapper",k]]),children:n("div",{role:"group","aria-label":L,className:$(["pdp-carousel__controls",[`pdp-carousel__controls--${s}`,k]]),children:(u?U.slice(0,d):U).map((l,c)=>{const D=u?d:U.length,N=u?S-1===c:S===c;return k?j("label",{className:$(["pdp-carousel__thumbnail__container"]),ref:I=>{I&&(K.current[c]=I)},children:[n("input",{type:"radio",name:"carousel-thumbnails","aria-label":O.replace("{key}",String(c+1)).replace("{total}",String(D)),checked:N&&te!==0,onChange:()=>{T(u?c+1:c,!0)},...re,className:$(["pdp-carousel__thumbnail",["pdp-carousel__thumbnail--selected",N&&te!==0]])}),n("span",{className:$(["pdp-carousel__thumbnail__span"]),children:_e[c]})]},c):n("button",{"aria-label":O.replace("{key}",String(c+1)).replace("{total}",String(D)),onClick:()=>{T(u?c+1:c,!0)},className:$(["pdp-carousel__controls__button",["pdp-carousel__controls__button--active",N]])},c)})})}),(k||Z)&&!y&&A]})]})};function $e(e,i=0){if(typeof e=="number")return e;const{small:m,medium:p,large:s}=e,u=[{breakpoint:1024,value:s},{breakpoint:786,value:p},{breakpoint:0,value:m}].find(({breakpoint:P})=>i>P);return u?u.value:m}function J(){return document.documentElement.dir==="rtl"}const Je=({title:e,breadcrumbs:i,galleryContent:m,infoContent:p,productContent:s,sku:y,outOfStock:u,shortDescription:P,description:a,attributes:Y,images:o,options:b,price:R,specialPrice:M,className:W,children:Z,quantity:re,actions:le,carouselConfig:r,zoomType:w="overlay",closeButton:_=!0,...L})=>{var ae,K,te,z,ce,ue,_e,U,oe;const O=X("PDP.Product.RegularPrice.label").label,v=X("PDP.Product.SpecialPrice.label").label,g=X("PDP.Product.OutOfStock.label").label,d=X("PDP.Product.Image.label").label,[E,t]=G(null),V=o!=null&&o.length?o.map((ne,k)=>{var T;const ee=((T=e==null?void 0:e.props)==null?void 0:T.children)&&(d==null?void 0:d.replace("{product}",e.props.children.toString()).replace("{key}",String(k+1)).replace("{total}",String(o.length)));return w==="zoom"?n(at,{closeButton:_,children:n(F,{node:ne,loading:k===0?"eager":"lazy",alt:ee},k)}):n(F,{node:ne,loading:k===0?"eager":"lazy",alt:ee,onClick:()=>t(k)},k)}):n("img",{src:"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7",className:"pdp-product__images__placeholder","aria-hidden":!0}),S=(ae=r==null?void 0:r.thumbnails)!=null&&ae.length?r.thumbnails.map((ne,k)=>{var ee;return n(F,{node:ne,loading:(r==null?void 0:r.thumbnailsLoadingMode)||"lazy",alt:((ee=e==null?void 0:e.props)==null?void 0:ee.children)&&(d==null?void 0:d.replace("{product}",e.props.children.toString()).replace("{key}",String(k+1)).replace("{total}",String(o.length)))},k)}):n("img",{src:"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7",className:"pdp-product__images__placeholder","aria-hidden":!0});return j("div",{...L,className:$(["pdp-product",W]),children:[i&&n(F,{node:i,className:"pdp-product__breadcrumbs"}),j("div",{className:"pdp-product__column-container pdp-product__gallery-column",children:[n("div",{className:"pdp-product__column-body",children:(K=r==null?void 0:r.controls)!=null&&K.desktop?n(ye,{className:"pdp-product__overlay__carousel",arrows:(o==null?void 0:o.length)>1,controls:(o==null?void 0:o.length)>1?r.controls.desktop:"dots",arrowsOnMainImage:r==null?void 0:r.arrowsOnMainImage,loop:(r==null?void 0:r.loopable)&&(o==null?void 0:o.length)>1,peak:((te=r==null?void 0:r.thumbnails)==null?void 0:te.length)>1&&((z=r==null?void 0:r.peak)==null?void 0:z.desktop)||!1,gap:(r==null?void 0:r.gap)||null,width:"100%",height:"100%",defaultIndex:E||0,thumbnails:S,children:V}):n(Ce,{className:"pdp-product__images",gap:"small",children:V})}),m&&n(F,{node:m,className:"pdp-product__gallery-content"})]}),j("div",{className:"pdp-product__column-container pdp-product__content-column",children:[j("div",{className:"pdp-product__column-body",children:[j("div",{className:"pdp-product__header",children:[e&&n(F,{node:e,className:"pdp-product__title"}),y&&n(F,{node:y,className:"pdp-product__sku"})]}),j("div",{className:"pdp-product__prices",children:[M&&n(F,{node:M,className:$(["pdp-product__price-special","pdp-product__price"]),"aria-label":v,role:"text"}),R&&n(F,{node:R,className:$(["pdp-product__price-regular","pdp-product__price--grey"]),"aria-label":O,role:"text"})]}),(ce=r==null?void 0:r.controls)!=null&&ce.mobile&&((ue=r==null?void 0:r.controls)==null?void 0:ue.mobile)==="thumbnailsRow"?n(ye,{className:"pdp-product__images pdp-product__images--carousel pdp-product__images--carousel--thumbnails",width:"100%",height:"auto",arrows:(o==null?void 0:o.length)>1,controls:(o==null?void 0:o.length)>1?"thumbnailsRow":null,loop:(r==null?void 0:r.loopable)&&(o==null?void 0:o.length)>1,peak:((_e=r==null?void 0:r.thumbnails)==null?void 0:_e.length)>1&&((U=r==null?void 0:r.peak)==null?void 0:U.mobile)||!1,gap:(r==null?void 0:r.gap)||null,thumbnails:S,children:V}):n(ye,{className:"pdp-product__images pdp-product__images--carousel",peak:((oe=r==null?void 0:r.peak)==null?void 0:oe.mobile)&&(o==null?void 0:o.length)>1,gap:(r==null?void 0:r.gap)||null,width:"100%",height:"auto",arrows:(o==null?void 0:o.length)>1,controls:(o==null?void 0:o.length)>1?"dots":null,loop:(r==null?void 0:r.loopable)&&(o==null?void 0:o.length)>1,children:V}),j("div",{className:$(["pdp-product__actions",["pdp-product__actions--out-of-stock",u]]),children:[u&&n("div",{className:"pdp-product__out-of-stock__text",children:g}),b&&n(F,{node:b,className:$(["pdp-product__options"])}),re&&n("div",{className:"pdp-product__quantity",children:n(F,{node:re})}),le&&n(F,{node:le,className:$(["pdp-product__buttons"])})]}),P&&n(F,{node:P,className:$(["pdp-product__short_description"])}),a&&n(F,{node:a,className:$(["pdp-product__description"])}),Y?n("div",{className:"pdp-product__attributes",children:Y}):null]}),p&&n(F,{node:p,className:"pdp-product__info-content"})]}),s&&n(F,{node:s,className:"pdp-product__content"}),E===null?null:n(et,{className:"pdp-product__overlay",onClose:()=>t(null),centered:!0,children:n(ye,{className:"pdp-product__overlay__carousel",arrows:(o==null?void 0:o.length)>1,width:"100%",height:"100%",defaultIndex:E||0,loop:(r==null?void 0:r.loopable)&&(o==null?void 0:o.length)>1,controls:(o==null?void 0:o.length)>1?"dots":null,isZoomed:!0,children:V})})]})},Ce=({children:e,gap:i=null,className:m,style:p,...s})=>{const y=he.count(e);return n("div",{...s,className:$(["pdp-gallery-grid",m]),style:{"--gap":i?`var(--spacing-${i})`:"0px",...p},children:he.map(e,(u,P)=>n("div",{className:"pdp-gallery-grid__item",children:n(F,{node:u,loading:P===0?"eager":"lazy"},u.props.src)},y+P))})},Ie=({amount:e,currency:i,locale:m,variant:p,sale:s,minimumAmount:y,maximumAmount:u,className:P,...a})=>n(Ae,{children:e||y===u?n("div",{className:"pdp-price-range",...a,children:n(ge,{amount:e||y,currency:i,locale:m,variant:p,sale:s,className:P})}):j("div",{className:"pdp-price-range",...a,children:[n(ge,{amount:y,currency:i,locale:m,className:P}),n("span",{className:"pdp-price-range__label",children:"-"}),n(ge,{amount:u,currency:i,locale:m,className:P})]})}),et=({centered:e,onClose:i,className:m,children:p,...s})=>{const y=X("PDP.Overlay.Close.label").label,u=se(()=>{i==null||i()},[i]);return C(()=>{const P=a=>{a.key==="Escape"&&u()};return document.addEventListener("keydown",P),()=>{document.removeEventListener("keydown",P)}},[u]),C(()=>{const P=document.scrollingElement,a=P.style.overflow;return P.style.overflow="hidden",()=>{P.style.overflow=a}},[]),j("div",{...s,className:$(["pdp-overlay",["pdp-overlay--centered",e],m]),children:[n("div",{className:"pdp-overlay__content",children:p}),n(Pe,{"aria-label":y,variant:"tertiary",className:"pdp-overlay__close-button",onClick:u,icon:n(Ve,{})})]})},tt=["text","image","color","dropdown"],nt=e=>e.map(i=>({...i,text:i.label,disabled:!i.inStock}));function rt(e,i){return e.reduce((m,p)=>{const s=i==null?void 0:i.find(u=>u.items.find(P=>P.id===p));if(!s)return m;const y=s.items.find(u=>u.id===p);return{...m,[s.id]:{label:y.label,value:y.id}}},{})}const lt=({options:e,hideSelectedValue:i,disablePreselections:m,selectedUIDs:p,onValues:s,onErrors:y,defaultOptions:u,selectionsToUpdate:P,className:a,children:Y,...o})=>{const b=X("PDP.Swatches.Required.label").label,R=X("PDP.Swatches.ChooseOption.label").label,[M,W]=G(()=>e==null?void 0:e.reduce((w,_)=>{const{items:L}=_,O=L==null?void 0:L.find(g=>u==null?void 0:u.includes(g.id)),v=L==null?void 0:L.find(g=>g.selected);return O?{...w,[_.id]:{label:O.label,value:O.id}}:v?{...w,[_.id]:{label:v.label,value:v.id}}:w},{}));C(()=>{var r;if(p){const w=rt(p,e);if(JSON.stringify(w)===JSON.stringify(M))return;Z(Object.keys(w)[0],(r=w[Object.keys(w)[0]])==null?void 0:r.label,p[0])}},[p]),C(()=>{P==null||P.forEach(r=>{W(w=>{var O;const _=(O=r==null?void 0:r.items)==null?void 0:O.find(v=>v.selected);return _?{...w,[r.id]:{label:_==null?void 0:_.label,value:_==null?void 0:_.id}}:w})})},[P,W]),Ne(()=>{const r=e==null?void 0:e.reduce((w,_)=>{var O;let L=!1;return(O=_==null?void 0:_.items)==null||O.forEach(v=>{var d;((d=M[_.id])==null?void 0:d.value)===v.id&&(L=!0)}),_.required&&!L&&(w[_.id]=b),w},{});return y==null||y(r),r},[M]);const Z=se((r,w,_)=>{W(L=>{let O={...L,...r&&{[r]:{label:w,value:_}}};return w===R&&delete O[r],s==null||s(O,_),O})},[s]),re=(r,w)=>{var L;const _=((L=w.selectedOptions[0])==null?void 0:L.label)??"";Z(r,_,w.value)},le=se(({items:r,id:w,required:_,type:L,selected:O,label:v})=>(r==null?void 0:r.length)>0&&n("div",{className:$(["pdp-swatches__options"]),children:(L==null?void 0:L.toLowerCase())==="dropdown"?n(qe,{"aria-label":v,placeholder:m?R:void 0,handleSelect:g=>re(w,g.target),options:nt(r),value:O}):r==null?void 0:r.map(g=>{const d={key:g.id,id:g.id,name:w,value:g.value,label:g.label,groupAriaLabel:v,selected:O===g.id,outOfStock:!g.inStock,required:_===null?!0:_,onValue:()=>{Z(w,g.label,g.id)}};switch(L){case"text":return n(Fe,{...d,label:g.label});case"image":return n(Xe,{...d,src:g.value,alt:g.label});case"color":return n(je,{...d,size:"large",color:g.value});default:return console.warn(`Invalid swatch type ${L}`),null}})}),[Z]);return n("div",{...o,className:$(["pdp-swatches",a]),children:e==null?void 0:e.map(({type:r,label:w,id:_,multiple:L,required:O,items:v})=>{var g;return tt.includes(r)||console.warn(`Invalid swatch type ${r}`),L&&console.warn("Multiple selection swatches are not currently supported."),j("div",{id:`swatch-item-${_}`,"data-slot-key":`product-swatch--${_}`,className:"pdp-swatches__field",children:[n("div",{className:"pdp-swatches__field__label",children:M[_]?i?`${w}`:`${w}: ${M[_].label}`:w}),n(le,{id:_,type:r,required:O,items:v,label:w,selected:(g=M[_])==null?void 0:g.value})]},`swatch-item-${_}`)})})},at=({children:e,scale:i=2,closeButton:m=!0})=>{const[p,s]=G(!1),[y,u]=G("pdp-zoom"),[P,a]=G(!1),[Y,o]=G({x:0,y:0}),[b,R]=G({x:0,y:0}),[M,W]=G({x:0,y:0}),Z=d=>{!p||d.type!=="touchstart"||(o({x:d.touches[0].clientX,y:d.touches[0].clientY}),R({x:M.x,y:M.y}),a(!0))},re=d=>{var ce;if(!P||d.type!=="touchmove")return;const E=(ce=d.currentTarget)==null?void 0:ce.getBoundingClientRect(),t=(100-100/i)/2,V=d.touches[0].clientX-Y.x,S=d.touches[0].clientY-Y.y,ae=V*100/(E.width*i),K=S*100/(E.height*i),te=b.x+ae,z=b.y+K;W({x:Math.max(-t,Math.min(te,t))||0,y:Math.max(-t,Math.min(z,t))||0}),d.preventDefault()},le=d=>{var K;const E=(K=d.currentTarget)==null?void 0:K.getBoundingClientRect(),t=(100-100/i)/2;let V;if("touches"in d)V=d.touches[0];else if(d instanceof MouseEvent)V=d;else return;const S=t-(V.clientX-E.left)/E.width*100,ae=t-(V.clientY-E.top)/E.height*100;W({x:Math.max(-t,Math.min(S,t))||0,y:Math.max(-t,Math.min(ae,t))||0})},r=d=>{if(!P){if(p){if(m&&"touches"in d){Z(d);return}m||s(!1)}else s(!0),le(d);d.preventDefault()}},w=d=>{if(m&&"touches"in d){re(d);return}p&&le(d)},_=()=>{if(m){a(!1);return}s(!1)},L=d=>{s(!1),d.stopPropagation()},O=p?`scale(${i}) translateX(${M.x}%) translateY(${M.y}%)`:"none",v=X("PDP.Zoom.Close.label").label,g=Ye(he.only(e),{draggable:!1,style:{"--transform":O}});return C(()=>{u(p?`pdp-zoom ${m?"pdp-zoom--no-effects":"pdp-zoom--zoomed"}`:"pdp-zoom")},[p,m]),j("figure",{className:y,onClick:r,onMouseMove:w,onMouseLeave:_,onTouchStart:r,onTouchMove:w,onTouchEnd:_,children:[g,m&&p&&n(Pe,{"aria-label":v,variant:"tertiary",className:"pdp-zoom__close-button",icon:n(Ve,{}),onClick:L})]})};function ct(e,i="en_US"){if(!Ue(e))throw Error("Invalid date string");return e.split(" ")[1]||(e=`${e} 00:00:00`),new Date(e).toLocaleDateString(Me(i)).toString()}function Ue(e){if(![/^\d{4}-\d{2}-\d{2}$/,/^\d{1,2}\/\d{1,2}\/\d{4}$/,/^\d{2}\/\d{2}\/\d{4}$/,/^\d{4}\/\d{2}\/\d{2}$/,/^\d{1,2}\.\d{1,2}\.\d{4}$/,/^\d{4}-\d{2}-\d{2} \d{2}:\d{2}:\d{2}$/].some(p=>p.test(e)))return!1;const m=new Date(e);return!isNaN(m.getTime())}function ot(e){const i=new URLSearchParams(window.location.search);Object.entries(e).forEach(([p,s])=>{s===null?i.delete(p):i.set(p,String(s))});let m=window.location.pathname;m+=`?${i.toString()}`,m+=window.location.hash,window.history.replaceState({},"",m)}function it(){const e=new URLSearchParams(window.location.search),i={};return e.forEach((m,p)=>{i[p]=m}),i}function st(e){var i,m,p,s,y,u,P,a,Y,o,b,R;return{productId:Number(e==null?void 0:e.externalId),name:e==null?void 0:e.name,sku:(e==null?void 0:e.variantSku)||(e==null?void 0:e.sku),topLevelSku:e==null?void 0:e.sku,specialToDate:void 0,specialFromDate:void 0,newToDate:void 0,newFromDate:void 0,createdAt:void 0,updatedAt:void 0,manufacturer:void 0,countryOfManufacture:void 0,categories:void 0,productType:void 0,pricing:{regularPrice:((m=(i=e==null?void 0:e.prices)==null?void 0:i.regular)==null?void 0:m.amount)||0,minimalPrice:(s=(p=e==null?void 0:e.prices)==null?void 0:p.final)==null?void 0:s.minimumAmount,maximalPrice:(u=(y=e==null?void 0:e.prices)==null?void 0:y.final)==null?void 0:u.maximumAmount,specialPrice:(a=(P=e==null?void 0:e.prices)==null?void 0:P.final)==null?void 0:a.amount,tierPricing:void 0,currencyCode:((o=(Y=e==null?void 0:e.prices)==null?void 0:Y.final)==null?void 0:o.currency)||"USD"},canonicalUrl:e==null?void 0:e.url,mainImageUrl:(R=(b=e==null?void 0:e.images)==null?void 0:b[0])==null?void 0:R.url}}const dt={PRODUCT_CONTEXT:"productContext"},ht={PRODUCT_PAGE_VIEW:"product-page-view"};function He(){return window.adobeDataLayer=window.adobeDataLayer||[],window.adobeDataLayer}function ut(e,i){const m=He();m.push({[e]:null}),m.push({[e]:i})}function pt(e,i){He().push(p=>{const s=p.getState?p.getState():{};p.push({event:e,eventInfo:{...s,...i}})})}function Re(e){const i=st(e);ut(dt.PRODUCT_CONTEXT,i),pt(ht.PRODUCT_PAGE_VIEW)}const mt=({sku:e,hideSku:i,hideQuantity:m,hideShortDescription:p,hideDescription:s,hideAttributes:y,hideURLParams:u,hideSelectedOptionValue:P,slots:a,children:Y,initialData:o,carousel:b,optionsConfig:R,useACDL:M,onAddToCart:W,zoomType:Z,closeButton:re=!0,disableDropdownPreselection:le,...r})=>{var T,pe,me,be;const w=X("PDP.Product.AddToCart.label").label,_=X("PDP.Product.Incrementer.label").label,L=X("PDP.Product.Details.label").label,O=X("PDP.Swatches.ChooseOption.label").label,[v,g]=G(We.getConfig().defaultLocale||"en-US"),[d,E]=G(),[t=null,V]=G(o),[S,ae]=G(()=>{const h={sku:e,quantity:1};return t!=null&&t.optionUIDs&&(h.optionsUIDs=t.optionUIDs),h}),[K,te]=G(()=>{var h,f;return!(t!=null&&t.options&&((h=t==null?void 0:t.options)==null?void 0:h.length)>0&&((f=t==null?void 0:t.optionUIDs)==null?void 0:f.length)!==(t==null?void 0:t.options.length))}),z={data:t,values:S,valid:K};function ce(h){return h==null?void 0:h.some(f=>(f==null?void 0:f.typename)==="ProductViewOptionValueProduct")}C(()=>{const h=ke.on("pdp/setValues",f=>{ae(A=>({...A,...f}))});return()=>{h==null||h.off()}},[]),C(()=>{const h=ke.on("locale",f=>{f!==v&&(g(f),Te(e).then(V))});return()=>{h==null||h.off()}},[v,e]),C(()=>{M&&o&&Object.keys(o).length>0&&Re(o)},[o]);const ue=se(h=>{ae(f=>({...f,...h}))},[]);C(()=>{ke.emit("pdp/values",S)},[JSON.stringify(S)]);const _e=se(h=>{var B,H;let f=Object.entries(h).filter(([l,c])=>c.label!==O).map(([l,c])=>h[l].value).filter(l=>l!==void 0);!u&&(t!=null&&t.options)&&!ce(t.options)&&ot({optionsUIDs:f.join(",")}),ue({optionsUIDs:f}),te((f==null?void 0:f.length)===((B=t==null?void 0:t.options)==null?void 0:B.length));const A=(H=t==null?void 0:t.options)==null?void 0:H.some(l=>ce([l]));Be(e,f,R==null?void 0:R.anchorOptions,A).then(l=>{var c;V(l),(c=R==null?void 0:R.anchorOptions)!=null&&c.length&&U(l,f),M&&(l==null?void 0:l.variantSku)!==e&&Re(l)})},[e]),U=se((h,f)=>{var H;const A=(h==null?void 0:h.optionUIDs)??[];f.every(l=>A.includes(l))||(E(h==null?void 0:h.options),ue({optionsUIDs:A}),te((A==null?void 0:A.length)===((H=h==null?void 0:h.options)==null?void 0:H.length)))},[e]),oe=se(h=>{Object.keys(h).length!==0&&te(!1)},[]),ne=Ne(()=>{var h;return(h=t==null?void 0:t.attributes)==null?void 0:h.map(({label:f,value:A},B)=>{const H=Ue(A)?ct(A,v):A.toString();return j("li",{children:[f,": ",n("span",{dangerouslySetInnerHTML:{__html:H}})]},B)})},[t==null?void 0:t.attributes,v]),k=!m&&(t!=null&&t.inStock)?n(Q,{name:"Quantity",slot:a==null?void 0:a.Quantity,context:{...z},children:n(Ge,{name:"quantity",defaultValue:S.quantity.toString(),value:S.quantity.toString(),min:1,"aria-label":_,className:"pdp-product__quantity",onValue:h=>{ue({quantity:Number(h)})}},"quantity")}):void 0,ee=()=>{if(t!=null&&t.options)return n(Q,{name:"Options",slot:a==null?void 0:a.Options,context:{...z},children:n(lt,{selectedUIDs:S.optionsUIDs,options:t.options,defaultOptions:S.optionsUIDs,selectionsToUpdate:d,hideSelectedValue:P,disablePreselections:le,onValues:_e,onErrors:oe})})};return n("div",{...r,children:n(Je,{title:n(Q,{name:"Title",slot:a==null?void 0:a.Title,context:{...z},children:t==null?void 0:t.name}),sku:i?void 0:n(Q,{name:"SKU",slot:a==null?void 0:a.SKU,context:{...z},children:t==null?void 0:t.sku}),options:ee(),breadcrumbs:(a==null?void 0:a.Breadcrumbs)&&n(Q,{name:"Breadcrumbs",slot:a==null?void 0:a.Breadcrumbs,context:{...z,setSeparator(h){this._registerMethod((...f)=>{const A=h(...f),B=A&&n(Se,{source:A});this._setProps(H=>({...H,separator:B,children:[n(De,{separator:B,categories:H.categories})]}))})},appendLink(h){this._registerMethod((...f)=>{const{text:A,...B}=h(...f),H=n("a",{...B,children:A});this._setProps(l=>{const c=[...l.categories||[],H];return{...l,categories:c,children:[n(De,{separator:l.separator,categories:c})]}})})},appendHTMLElement(h){this._registerMethod((...f)=>{const A=h(...f),B=this._htmlElementToVNode(A);this._setProps(H=>{const l=[...H.categories||[],B];return{...H,categories:l,children:[n(De,{separator:H.separator,categories:l})]}})})}}}),quantity:k,actions:n(Q,{name:"Actions",slot:a==null?void 0:a.Actions,context:{...z,appendButton(h){this._registerMethod((...f)=>{const A=h(...f);if(!A)return;const{text:B,icon:H,...l}=A,c=n(Pe,{type:"button",...l,icon:H&&n(Se,{source:H}),children:B});this._setProps(D=>({children:[...D.children||[],c]}))})}},children:!(a!=null&&a.Actions)&&n(Pe,{size:"medium",type:"submit",icon:n(Se,{source:"Cart"}),disabled:!(t!=null&&t.inStock)||!K,"aria-label":w,onClick:()=>W==null?void 0:W(S),children:w})}),shortDescription:p?void 0:n(Q,{name:"ShortDescription",slot:a==null?void 0:a.ShortDescription,context:{...z},children:n("div",{dangerouslySetInnerHTML:{__html:(t==null?void 0:t.shortDescription)??""}})}),description:s?void 0:n(Q,{name:"Description",slot:a==null?void 0:a.Description,context:{...z},children:n("div",{dangerouslySetInnerHTML:{__html:(t==null?void 0:t.description)??""}})}),images:((T=t==null?void 0:t.images)==null?void 0:T.map(({label:h,url:f})=>{var A,B;return n(xe,{title:h,alt:h,src:f,width:((A=b==null?void 0:b.imageParams)==null?void 0:A.width)??960,height:((B=b==null?void 0:b.imageParams)==null?void 0:B.height)??1191,params:(b==null?void 0:b.imageParams)??{width:960}},f)}))??[],specialPrice:(pe=t==null?void 0:t.prices)!=null&&pe.visible?n(Q,{name:"SpecialPrice",slot:a==null?void 0:a.SpecialPrice,context:{...z},children:n(Ie,{...t.prices.final,locale:Me(v)})}):void 0,price:(me=t==null?void 0:t.prices)!=null&&me.visible&&t.prices.regular&&t.prices.final.amount!==(t==null?void 0:t.prices.regular.amount)?n(Q,{name:"RegularPrice",slot:a==null?void 0:a.RegularPrice,context:{...z},children:n(Ie,{...t.prices.regular,locale:Me(v)})}):void 0,zoomType:Z,closeButton:re,carouselConfig:{...b,thumbnails:b&&Object.keys(b).length?((be=t==null?void 0:t.images)==null?void 0:be.map(({label:h,url:f})=>{var A,B;return n(xe,{title:h,alt:h,src:f,width:((A=b==null?void 0:b.thumbnailParams)==null?void 0:A.width)??200,height:((B=b==null?void 0:b.thumbnailParams)==null?void 0:B.height)??248,params:(b==null?void 0:b.thumbnailParams)??{width:200}},f)}))??[]:[]},outOfStock:!(t!=null&&t.inStock),attributes:y?void 0:n(Q,{name:"Attributes",slot:a==null?void 0:a.Attributes,context:{...z},children:ne!=null&&ne.length?j(Ae,{children:[L,n("ul",{children:ne})]}):null}),galleryContent:(a==null?void 0:a.GalleryContent)&&n(Q,{name:"GalleryContent",slot:a.GalleryContent,context:{...z}}),infoContent:(a==null?void 0:a.InfoContent)&&n(Q,{name:"InfoContent",slot:a.InfoContent,context:{...z}}),productContent:(a==null?void 0:a.Content)&&n(Q,{name:"Content",slot:a.Content,context:{...z}})})})};mt.getInitialData=async function({sku:e,optionsConfig:i}){var P,a,Y,o,b,R,M;function m(W){return W.some(Z=>Z.__typename==="ProductViewOptionValueProduct")}let p;const s=We.getConfig(),y=((P=it().optionsUIDs)==null?void 0:P.split(","))||((o=(Y=(a=s==null?void 0:s.models)==null?void 0:a.ProductDetails)==null?void 0:Y.initialData)==null?void 0:o.optionsUIDs),u=(R=(b=s==null?void 0:s.models)==null?void 0:b.ProductDetails)==null?void 0:R.initialData;return u&&Object.keys(u).length>0&&(p=(M=u.options)==null?void 0:M.some(W=>m(W==null?void 0:W.values))),y!=null&&y.length?await Be(e,y,i==null?void 0:i.anchorOptions,p):await Te(e)};export{mt as ProductDetails,mt as default};
|
package/package.json
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"name": "@dropins/storefront-pdp", "version": "0.5.0-
|
|
1
|
+
{"name": "@dropins/storefront-pdp", "version": "0.5.0-beta3", "@dropins/tools": "0.33.0"}
|