@dropins/storefront-pdp 3.2.0 → 3.3.0
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.
- package/CHANGELOG.md +36 -0
- package/api/graphql/ProductOptionFragment.graphql.d.ts +1 -1
- package/api.js +5 -5
- package/api.js.map +1 -1
- package/chunks/components.js +1 -1
- package/chunks/components.js.map +1 -1
- package/components/Swatches/Swatches.d.ts +6 -0
- package/containers/ProductAttributes.js +1 -1
- package/containers/ProductAttributes.js.map +1 -1
- package/containers/ProductDetails/ProductDetails.d.ts +1 -0
- package/containers/ProductDetails.js +1 -1
- package/containers/ProductDetails.js.map +1 -1
- package/containers/ProductGallery.js +1 -1
- package/containers/ProductGallery.js.map +1 -1
- package/containers/ProductOptions.js +1 -1
- package/containers/ProductOptions.js.map +1 -1
- package/containers/ProductPrice.js +1 -1
- package/containers/ProductQuantity.js +1 -1
- package/containers/ProductQuantity.js.map +1 -1
- package/data/models/product-model.d.ts +5 -1
- package/data/models/values-model.d.ts +2 -0
- package/fragments.js +1 -0
- package/fragments.js.map +1 -1
- package/i18n/en_US.json.d.ts +3 -0
- package/lib/bundle-option-quantities.d.ts +16 -0
- package/package.json +1 -1
- package/render.js +3 -2
- package/render.js.map +1 -1
package/chunks/components.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/*! Copyright 2026 Adobe
|
|
2
2
|
All Rights Reserved. */
|
|
3
|
-
import{debounce as xe,classes as A,VComponent as O}from"@dropins/tools/lib.js";import{useText as k}from"@dropins/tools/i18n.js";import*as he from"@dropins/tools/preact-compat.js";import{useState as V,Children as ce,useRef as re,useMemo as we,useEffect as U,useCallback as le,useLayoutEffect as qe}from"@dropins/tools/preact-compat.js";import{jsxs as $,jsx as t,Fragment as Pe}from"@dropins/tools/preact-jsx-runtime.js";import{Button as ge,Icon as Oe,Price as _e,Checkbox as Xe,Picker as ke,ColorSwatch as Ye,ImageSwatch as ze,TextSwatch as Fe,Field as He,TextArea as Ge,Input as Ie}from"@dropins/tools/components.js";import{cloneElement as je}from"@dropins/tools/preact.js";import{useState as Ae,useCallback as Ze,useMemo as Ke,useEffect as Se}from"@dropins/tools/preact-hooks.js";const Je=r=>he.createElement("svg",{width:24,height:24,viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",...r},he.createElement("path",{vectorEffect:"non-scaling-stroke",d:"M7.74512 9.87701L12.0001 14.132L16.2551 9.87701",stroke:"currentColor",strokeWidth:1,strokeLinecap:"square",strokeLinejoin:"round"})),$e=r=>he.createElement("svg",{width:24,height:24,viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",...r},he.createElement("path",{vectorEffect:"non-scaling-stroke",d:"M18.3599 5.64001L5.62988 18.37",stroke:"currentColor"}),he.createElement("path",{vectorEffect:"non-scaling-stroke",d:"M18.3599 18.37L5.62988 5.64001",stroke:"currentColor"})),Qe=24,Le=16,Ve="32";var De=(r=>(r[r.small=16]="small",r[r.medium=24]="medium",r[r.large=64]="large",r))(De||{});const be=({show:r=1,scrollbar:s=!1,peak:i=!1,arrows:a=!1,controls:n="dots",arrowsOnMainImage:b=!1,loop:o=!1,gap:f=null,direction:S="horizontal",width:Y="100%",height:p="100%",defaultIndex:E=0,className:J,children:T,thumbnails:W=null,isZoomed:z,...j})=>{const Z=k("PDP.Carousel.label").label,y=k("PDP.Carousel.Slide.label").label,w=k("PDP.Carousel.Previous.label").label,e=k("PDP.Carousel.Next.label").label,h=k("PDP.Carousel.Controls.label").label,u=k("PDP.Carousel.Controls.Button.label").label,[m,x]=V(()=>Ee(r)),l=Math.ceil(ce.count(T)/m),_=i?Qe:0,g=f?De[f]:0,v=ce.count(T)%m,[N,q]=V(o?te()?E-1:E+1:E),F=re([]),[B,ie]=V(0),[ne,ue]=V(0),de=we(()=>ce.toArray(W),[W]),c=we(()=>{const d=ce.toArray(T).reduce((P,R,L)=>L%m===0?[...P,[R]]:[...P.slice(0,-1),[...P[P.length-1],R]],[]);return!o||d.length===1?d:o&&ce.count(T)%m===0?[d[l-1]].concat(d).concat([d[0],d[1]]):[ce.toArray(T).slice(-m)].concat(d).concat([d[0],d[1]])},[T,m,l,o]),I=re(null),X=re(null),D=n==="thumbnailsRow"||n==="thumbnailsColumn";U(()=>{const d=I.current;if(!d)return;const P=xe(()=>{ie(d.offsetWidth??0),ue(d.offsetHeight??0);const L=window.innerWidth,G=Ee(r,L);G!==m&&x(G)},50),R=new ResizeObserver(P);return R.observe(d),()=>{R.unobserve(d)}},[m,r]);const H=le(d=>{const P=o?d-1:d,R=F==null?void 0:F.current[0],L=(R==null?void 0:R.offsetWidth)+Le,G=(R==null?void 0:R.offsetHeight)+Le,K=X.current,pe=n==="thumbnailsRow",me=n==="thumbnailsColumn",se=pe?K==null?void 0:K.offsetWidth:K==null?void 0:K.offsetHeight,ee=pe?L:G;if((pe||me)&&se){const Te=Math.floor((pe?K.clientWidth:K.clientHeight)/ee),We=Math.floor(Te/2),fe=(P-We)*ee;K.style.scrollBehavior="smooth",pe?K.scrollLeft=te()?-(K.scrollWidth-K.clientWidth-fe):fe:K.scrollTop=fe}},[n,o]);U(()=>{H(N)},[N,H]);const M=le((d,P,R)=>{D&&H(d);const L=I.current,G=_?L.offsetWidth-_:L.offsetWidth-_+g;if(!Array.from(L.querySelectorAll("[data-index]")).filter(se=>{const ee=Number(se.getAttribute("data-index"));return!isNaN(ee)&&ee>-1})[d])return;if(R){const se=d===0?l:0,ee=G*(l+(v||m)/m);if(te()){if(L.scrollLeft<=0&&L.scrollLeft>-(G-5)){M(1,!0);return}if(L.scrollLeft<G-ee&&L.scrollLeft>=-ee){M(l,!0);return}L.style.scrollBehavior="auto",L.scrollLeft=se===0?0:-ee,M(se===0?1:l,!0)}else{if(L.scrollLeft>=0&&L.scrollLeft<G-5){M(1,!0);return}if(L.scrollLeft>ee-G&&L.scrollLeft<=ee){M(l,!0);return}L.style.scrollBehavior="auto",L.scrollLeft=se===0?0:ee,M(se===0?1:l,!0);return}}const me=(L.offsetWidth-g)/m*c[d].length-_;L.style.scrollBehavior=P?"smooth":"auto",L.scrollLeft=te()?-(c[d].length===m?G*d:G*(d-1)-me):c[d].length===m?G*d:G*(d-1)+me},[g,l,_,m,v,c,H,n]),Q=le(()=>{if(o){const P=N-1;M(P,!0,te()?N===l-1:N===1);return}const d=N<=0?0:N-1;M(d,!0)},[N,M,o]),C=le(()=>{const d=c.length-1;if(o){const R=N+1;M(R,!0,te()?N===0:N===l);return}const P=N>=d?d:N+1;M(P,!0)},[c.length,o,N,M,l]);U(()=>{const d=P=>{P.key==="ArrowLeft"&&(te()?C():Q()),P.key==="ArrowRight"&&(te()?Q():C())};return window.addEventListener("keydown",d),()=>{window.removeEventListener("keydown",d)}},[C,Q]),qe(()=>{M(o?E+1:E,!1)},[E,M,o,B]);const oe=xe(()=>{const d=I.current,P=_?d.offsetWidth-_:d.offsetWidth-_+g,R=Math.abs(d.scrollLeft)/P,L=Math.abs(Math.round(R)-R<1?Math.round(R):Math.ceil(R));if(D&&H(L),o){const G=P*(l+(v||m)/m),K=te()?-d.scrollLeft:d.scrollLeft;if(Math.ceil(Math.abs(K))>=Math.ceil(G)-5){d.style.scrollBehavior="auto",d.scrollLeft=te()?-d.offsetWidth+(Math.ceil(K)-Math.ceil(G)-_):d.offsetWidth+(Math.ceil(K)-Math.ceil(G)-_);return}if(Math.abs(K)===0){d.style.scrollBehavior="auto",d.scrollLeft=te()?-(G-d.offsetWidth+_):G-d.offsetWidth+_;return}}N!==L&&q(L)},100);U(()=>{const d=I.current;return d==null||d.addEventListener("scroll",oe),()=>{d==null||d.removeEventListener("scroll",oe)}},[oe]);const ae=(d,P,R)=>t(ge,{className:A([["pdp-carousel__button",!d],[`pdp-carousel__button--${P}`,!d],[`pdp-carousel__button--${n}`,d]]),style:{"--height":`${ne}px`},variant:"tertiary","aria-label":P==="next"?e:w,onClick:R,disabled:o?!1:P==="next"?N>=c.length-1:N<1,children:t(Oe,{className:A([["pdp-carousel__button__icon",!d],[`pdp-carousel__button__icon--${P}`,!d],[`pdp-carousel__button__icon--${n}--${P}`,d]]),size:Ve,source:Je})}),Ne=a&&c.length!=1&&ae(D,"prev",Q),ye=a&&c.length!=1&&ae(D,"next",C),Re=a&&c.length!=1&&ae(!1,"prev",Q),Be=a&&c.length!=1&&ae(!1,"next",C);return $("div",{role:"region","aria-roledescription":Z,className:A(["pdp-carousel",["pdp-carousel--main-image-controls",b],["pdp-carousel--arrows",a&&!D],[`pdp-carousel--${n}`,D],J]),style:{"--flex-carousel":n==="thumbnailsColumn"?"row-reverse":"column","--gap":D?"0":"var(--spacing-small)","--width":Y},...j,children:[t("div",{ref:I,className:A(["pdp-carousel__wrapper",`pdp-carousel__wrapper--${S}`,["pdp-carousel__wrapper--scrollbar",s],["pdp-carousel__wrapper--peak",i]]),style:{"--total-width":n==="thumbnailsColumn"?"81.6%":"100%","--height":n==="thumbnailsColumn"?"auto":p,"--gap":f?`var(--spacing-${f})`:"0px","--per-page":m},tabIndex:0,children:c.map((d,P)=>{const R=d.length<m;return t("div",{role:"group","aria-roledescription":y,"data-index":P,className:A(["pdp-carousel__slide",`pdp-carousel__slide--${S}`,["pdp-carousel__slide--active",N===P],["pdp-carousel__slide--orphan",R],["pdp-carousel__slide--hidden",B===0]]),style:{"--length":d.length},children:d},P)})}),!D&&$(Pe,{children:[Ne,ye]}),D&&b&&$(Pe,{children:[Re,Be]}),n&&c.length!=1&&$("div",{className:A([[`pdp-carousel__controls__container--${n}`,D],["pdp-carousel__controls__container--no-arrows",!a||b]]),style:{"--width":n==="thumbnailsRow"?`${B}px`:Y,"--height":`${ne}px`,"--nr-thumbnails":de.length},children:[(D||z)&&!b&&Ne,t("div",{ref:X,className:A([[`pdp-carousel__controls__wrapper--${n}`,D],["pdp-carousel__controls__wrapper",D]]),children:t("div",{role:"group","aria-label":h,className:A(["pdp-carousel__controls",[`pdp-carousel__controls--${n}`,D]]),children:(o?c.slice(0,l):c).map((d,P)=>{const R=o?l:c.length,L=o?N-1===P:N===P;return D?$("label",{className:A(["pdp-carousel__thumbnail__container"]),ref:G=>{G&&(F.current[P]=G)},children:[t("input",{type:"radio",name:"carousel-thumbnails","aria-label":u.replace("{key}",String(P+1)).replace("{total}",String(R)),checked:L&&B!==0,onChange:()=>{M(o?P+1:P,!0)},...j,className:A(["pdp-carousel__thumbnail",["pdp-carousel__thumbnail--selected",L&&B!==0]])}),t("span",{className:A(["pdp-carousel__thumbnail__span"]),children:de[P]})]},P):t("button",{"aria-label":u.replace("{key}",String(P+1)).replace("{total}",String(R)),onClick:()=>{M(o?P+1:P,!0)},className:A(["pdp-carousel__controls__button",["pdp-carousel__controls__button--active",L]])},P)})})}),(D||z)&&!b&&ye]})]})};function Ee(r,s=0){if(typeof r=="number")return r;const{small:i,medium:a,large:n}=r,o=[{breakpoint:1024,value:n},{breakpoint:786,value:a},{breakpoint:0,value:i}].find(({breakpoint:f})=>s>f);return o?o.value:i}function te(){return document.documentElement.dir==="rtl"}const _t=({title:r,breadcrumbs:s,galleryContent:i,infoContent:a,productContent:n,sku:b,outOfStock:o,shortDescription:f,description:S,attributes:Y,images:p,options:E,giftCardOptions:J,downloadableOptions:T,price:W,specialPrice:z,className:j,children:Z,quantity:y,actions:w,carouselConfig:e,zoomType:h="overlay",closeButton:u=!0,...m})=>{var B,ie,ne,ue,de,c,I,X,D;const x=k("PDP.Product.RegularPrice.label").label,l=k("PDP.Product.SpecialPrice.label").label,_=k("PDP.Product.OutOfStock.label").label,g=k("PDP.Product.Image.label").label,[v,N]=V(null),q=p!=null&&p.length?p.map((H,M)=>{var C;const Q=((C=r==null?void 0:r.props)==null?void 0:C.children)&&(g==null?void 0:g.replace("{product}",r.props.children.toString()).replace("{key}",String(M+1)).replace("{total}",String(p.length)));return h==="zoom"?t(lt,{closeButton:u,children:t(O,{node:H,loading:M===0?"eager":"lazy",alt:Q},M)}):t(O,{node:H,loading:M===0?"eager":"lazy",alt:Q,onClick:()=>N(M)},M)}):t("img",{src:"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7",className:"pdp-product__images__placeholder","aria-hidden":!0}),F=(B=e==null?void 0:e.thumbnails)!=null&&B.length?e.thumbnails.map((H,M)=>{var Q;return t(O,{node:H,loading:(e==null?void 0:e.thumbnailsLoadingMode)||"lazy",alt:((Q=r==null?void 0:r.props)==null?void 0:Q.children)&&(g==null?void 0:g.replace("{product}",r.props.children.toString()).replace("{key}",String(M+1)).replace("{total}",String(p.length)))},M)}):t("img",{src:"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7",className:"pdp-product__images__placeholder","aria-hidden":!0});return $("div",{...m,className:A(["pdp-product",j]),children:[s&&t(O,{node:s,className:"pdp-product__breadcrumbs"}),$("div",{className:"pdp-product__column-container pdp-product__gallery-column",children:[t("div",{className:"pdp-product__column-body",children:(ie=e==null?void 0:e.controls)!=null&&ie.desktop?t(be,{className:"pdp-product__overlay__carousel",arrows:(p==null?void 0:p.length)>1,controls:(p==null?void 0:p.length)>1?e.controls.desktop:"dots",arrowsOnMainImage:e==null?void 0:e.arrowsOnMainImage,loop:(e==null?void 0:e.loopable)&&(p==null?void 0:p.length)>1,peak:((ne=e==null?void 0:e.thumbnails)==null?void 0:ne.length)>1&&((ue=e==null?void 0:e.peak)==null?void 0:ue.desktop)||!1,gap:(e==null?void 0:e.gap)||null,width:"100%",height:"100%",defaultIndex:v||0,thumbnails:F,children:q}):t(Ue,{className:"pdp-product__images",gap:"small",children:q})}),i&&t(O,{node:i,className:"pdp-product__gallery-content"})]}),$("div",{className:"pdp-product__column-container pdp-product__content-column",children:[$("div",{className:"pdp-product__column-body",children:[$("div",{className:"pdp-product__header",children:[r&&t(O,{node:r,className:"pdp-product__title"}),b&&t(O,{node:b,className:"pdp-product__sku"})]}),$("div",{className:"pdp-product__prices",children:[z&&t(O,{node:z,className:A(["pdp-product__price-special","pdp-product__price"]),"aria-label":l,role:"text"}),W&&t(O,{node:W,className:A(["pdp-product__price-regular","pdp-product__price--grey"]),"aria-label":x,role:"text"})]}),(de=e==null?void 0:e.controls)!=null&&de.mobile&&((c=e==null?void 0:e.controls)==null?void 0:c.mobile)==="thumbnailsRow"?t(be,{className:"pdp-product__images pdp-product__images--carousel pdp-product__images--carousel--thumbnails",width:"100%",height:"auto",arrows:(p==null?void 0:p.length)>1,controls:(p==null?void 0:p.length)>1?"thumbnailsRow":null,loop:(e==null?void 0:e.loopable)&&(p==null?void 0:p.length)>1,peak:((I=e==null?void 0:e.thumbnails)==null?void 0:I.length)>1&&((X=e==null?void 0:e.peak)==null?void 0:X.mobile)||!1,gap:(e==null?void 0:e.gap)||null,thumbnails:F,children:q}):t(be,{className:"pdp-product__images pdp-product__images--carousel",peak:((D=e==null?void 0:e.peak)==null?void 0:D.mobile)&&(p==null?void 0:p.length)>1,gap:(e==null?void 0:e.gap)||null,width:"100%",height:"auto",arrows:(p==null?void 0:p.length)>1,controls:(p==null?void 0:p.length)>1?"dots":null,loop:(e==null?void 0:e.loopable)&&(p==null?void 0:p.length)>1,children:q}),$("div",{className:A(["pdp-product__actions",["pdp-product__actions--out-of-stock",o]]),children:[o&&t("div",{className:"pdp-product__out-of-stock__text",children:_}),E&&t(O,{node:E,className:A(["pdp-product__options"])}),J&&t(O,{node:J,className:A(["pdp-product__gift-card-options"])}),T&&t(O,{node:T,className:A(["pdp-product__downloadable-options"])}),y&&t("div",{className:"pdp-product__quantity",children:t(O,{node:y})}),w&&t(O,{node:w,className:A(["pdp-product__buttons"])})]}),f&&t(O,{node:f,className:A(["pdp-product__short_description"])}),S&&t(O,{node:S,className:A(["pdp-product__description"])}),Y?t("div",{className:"pdp-product__attributes",children:Y}):null]}),a&&t(O,{node:a,className:"pdp-product__info-content"})]}),n&&t(O,{node:n,className:"pdp-product__content"}),v===null?null:t(Ce,{className:"pdp-product__overlay",onClose:()=>N(null),centered:!0,children:t(be,{className:"pdp-product__overlay__carousel",arrows:(p==null?void 0:p.length)>1,width:"100%",height:"100%",defaultIndex:v||0,loop:(e==null?void 0:e.loopable)&&(p==null?void 0:p.length)>1,controls:(p==null?void 0:p.length)>1?"dots":null,isZoomed:!0,children:q})})]})},Ue=({children:r,gap:s=null,className:i,style:a,...n})=>{const b=ce.count(r);return t("div",{...n,className:A(["pdp-gallery-grid",i]),style:{"--gap":s?`var(--spacing-${s})`:"0px",...a},children:ce.map(r,(o,f)=>t("div",{className:"pdp-gallery-grid__item",children:t(O,{node:o,loading:f===0?"eager":"lazy"},o.props.src)},b+f))})},mt=({amount:r,currency:s,locale:i,variant:a,sale:n,minimumAmount:b,maximumAmount:o,className:f,...S})=>t(Pe,{children:r||b===o?t("div",{className:"pdp-price-range",...S,children:t(_e,{amount:r||b,currency:s,locale:i,variant:a,sale:n,className:f})}):$("div",{className:"pdp-price-range",...S,children:[t(_e,{amount:b,currency:s,locale:i,className:f}),t("span",{className:"pdp-price-range__label",children:"-"}),t(_e,{amount:o,currency:s,locale:i,className:f})]})}),Ce=({centered:r,onClose:s,className:i,children:a,...n})=>{const b=k("PDP.Overlay.Close.label").label,o=re(null),f=le(()=>{s==null||s()},[s]);return U(()=>{const S=Y=>{Y.key==="Escape"&&f()};return document.addEventListener("keydown",S),()=>{document.removeEventListener("keydown",S)}},[f]),U(()=>{const S=o.current;S==null||S.focus();const Y=document.scrollingElement,p=Y.style.overflow;return Y.style.overflow="hidden",()=>{Y.style.overflow=p}},[]),$("div",{...n,className:A(["pdp-overlay",["pdp-overlay--centered",r],i]),ref:o,role:"dialog","aria-describedby":"overlay-content",tabindex:0,children:[t("div",{className:"pdp-overlay__content",id:"overlay-content",children:a}),t(ge,{"aria-label":b,variant:"tertiary",className:"pdp-overlay__close-button",onClick:f,icon:t($e,{})})]})},et=["text","image","color","dropdown"],tt=r=>r.map(s=>({...s,text:s.label,disabled:!s.inStock}));function Me(r,s){return s.reduce((i,a)=>{const n=a.items.filter(o=>r.includes(o.id));if(n.length===0)return i;if(a.multiple)return{...i,[a.id]:{label:n.map(o=>o.label).join(", "),values:n.map(o=>o.id)}};const b=n[0];return{...i,[a.id]:{label:b.label,value:b.id}}},{})}function rt(r){if(!(!r||!("value"in r)))return r.value}const bt=({options:r,hideSelectedValue:s,disablePreselections:i,selectedUIDs:a,onValues:n,onErrors:b,defaultOptions:o,selectionsToUpdate:f,className:S,children:Y,imageSwatchNode:p,...E})=>{const J=k("PDP.Swatches.Required.label").label,T=k("PDP.Swatches.ChooseOption.label").label,[W,z]=V(()=>{let e=o!=null&&o.length&&(r!=null&&r.length)?Me(o,r):{};return r==null||r.forEach(h=>{if(e[h.id])return;const{items:u}=h;if(h.multiple){const l=u==null?void 0:u.filter(_=>!!(o!=null&&o.includes(_.id))||_.selected);l!=null&&l.length&&(e={...e,[h.id]:{label:l.map(_=>_.label).join(", "),values:l.map(_=>_.id)}});return}const m=u==null?void 0:u.find(l=>o==null?void 0:o.includes(l.id)),x=u==null?void 0:u.find(l=>l.selected);m?e={...e,[h.id]:{label:m.label,value:m.id}}:x&&(e={...e,[h.id]:{label:x.label,value:x.id}})}),e});U(()=>{if(a){const e=Me(a,r);if(JSON.stringify(e)===JSON.stringify(W))return;z(h=>{let u={...h,...e};return n==null||n(u,(a==null?void 0:a[0])??""),u})}},[a]),U(()=>{f==null||f.forEach(e=>{z(h=>{var l;const u=(l=e==null?void 0:e.items)==null?void 0:l.filter(_=>_.selected);if(!(u!=null&&u.length))return h;if(e.multiple)return{...h,[e.id]:{label:u.map(g=>g.label).join(", "),values:u.map(g=>g.id)}};const m=u[0];return{...h,[e.id]:{label:m.label,value:m.id}}})})},[f,z]),we(()=>{const e=r==null?void 0:r.reduce((h,u)=>{var l;const m=W[u.id];let x=!1;return u.multiple?x=!!(m&&"values"in m&&m.values.length>0):(l=u==null?void 0:u.items)==null||l.forEach(_=>{m&&"value"in m&&m.value===_.id&&(x=!0)}),u.required&&!x&&(h[u.id]=J),h},{});return b==null||b(e),e},[W]);const j=le((e,h,u)=>{z(m=>{let x={...m,...e&&{[e]:{label:h,value:u}}};if(h===T){const l={...x};delete l[e],x=l}return n==null||n(x,u),x})},[n]),Z=le((e,h,u,m)=>{z(x=>{const l=x[e],_=l&&"values"in l?[...l.values]:l&&"value"in l&&l.value?[l.value]:[],g=u?[...new Set([..._,h])]:_.filter(F=>F!==h),v=new Map(m.map(F=>[F.id,F.label])),N=g.map(F=>v.get(F)).filter(Boolean).join(", "),q={...x};return g.length===0?delete q[e]:q[e]={label:N,values:g},n==null||n(q,h),q})},[n]),y=le((e,h)=>{var m;const u=((m=h.selectedOptions[0])==null?void 0:m.label)??"";j(e,u,h.value)},[j]),w=le(({items:e,id:h,required:u,type:m,selected:x,label:l,multiple:_})=>{const g=`pdp-swatch-${h}=${Math.random().toString(36)}`;if(_){const v=W[h],N=new Set(v&&"values"in v?v.values:[]);return(e==null?void 0:e.length)>0&&t("div",{className:A(["pdp-swatches__options","pdp-swatches__options--checkboxes"]),children:e==null?void 0:e.map(q=>t(Xe,{name:`pdp-bundle-multi__${h}__${q.id}`,label:q.label,checked:N.has(q.id),disabled:!q.inStock,onChange:F=>Z(h,q.id,F.currentTarget.checked,e)},q.id))})}return(e==null?void 0:e.length)>0&&t("div",{className:A(["pdp-swatches__options"]),children:(m==null?void 0:m.toLowerCase())==="dropdown"?t(ke,{id:g,name:h,"aria-label":l,placeholder:i?T:void 0,handleSelect:v=>y(h,v.target),options:tt(e),value:x}):e==null?void 0:e.map(v=>{const N={key:v.id,id:`${g}-${v.id}`,name:h,value:v.value,label:v.label,groupAriaLabel:l,selected:x===v.id,outOfStock:!v.inStock,required:u===null?!0:u,onValue:()=>{j(h,v.label,v.id)}};switch(m){case"text":return t(Fe,{...N,label:v.label});case"image":return t(ze,{...N,src:v.value,alt:v.label,imageNode:p});case"color":return t(Ye,{...N,size:"large",color:v.value});default:return console.warn(`Invalid swatch type ${m}`),null}})})},[T,j,y,Z,W]);return t("div",{...E,className:A(["pdp-swatches",S]),children:r==null?void 0:r.map(({type:e,label:h,id:u,multiple:m,required:x,items:l})=>(et.includes(e)||console.warn(`Invalid swatch type ${e}`),$("div",{id:`swatch-item-${u}`,"data-slot-key":`product-swatch--${u}`,className:"pdp-swatches__field",children:[t("div",{className:"pdp-swatches__field__label",children:W[u]?s?`${h}`:`${h}: ${W[u].label}`:h}),w({id:u,type:e,required:x,items:l,label:h,multiple:m,selected:rt(W[u])})]},`swatch-item-${u}`)))})},lt=({children:r,scale:s=2,closeButton:i=!0})=>{var de;const[a,n]=V(!1),[b,o]=V("pdp-zoom"),[f,S]=V(!1),[Y,p]=V({x:0,y:0}),[E,J]=V({x:0,y:0}),[T,W]=V({x:0,y:0}),z=re(null),j=re(null),Z=re(null),y=re("none"),w=re(null),e=re(!1),h=re(null),u=le(c=>{const I=()=>{var ae;let X;j.current&&z.current?X=j.current:z.current?(X=z.current.getBoundingClientRect(),j.current=X):X=(ae=c.currentTarget)==null?void 0:ae.getBoundingClientRect();const D=(100-100/s)/2;let H=null;if("touches"in c)if(c.touches.length>0)H=c.touches[0],h.current={clientX:H.clientX,clientY:H.clientY};else if(c.type==="touchend"&&w.current)H={clientX:w.current.x,clientY:w.current.y};else if(h.current)H=h.current;else return;else if(c instanceof MouseEvent)H=c;else return;const M=(H.clientX-X.left)/X.width*100,Q=(H.clientY-X.top)/X.height*100,C=(50-M)*(s-1)/s,oe=(50-Q)*(s-1)/s;W({x:Math.max(-D,Math.min(C,D))||0,y:Math.max(-D,Math.min(oe,D))||0})};Z.current&&cancelAnimationFrame(Z.current),Z.current=requestAnimationFrame(I)},[s]);U(()=>{j.current=null},[a]);const m=c=>{!a||c.type!=="touchstart"||(p({x:c.touches[0].clientX,y:c.touches[0].clientY}),J({x:T.x,y:T.y}),S(!0))},x=c=>{var ae;if(!f||c.type!=="touchmove")return;const I=(ae=c.currentTarget)==null?void 0:ae.getBoundingClientRect(),X=(100-100/s)/2,D=c.touches[0].clientX-Y.x,H=c.touches[0].clientY-Y.y,M=D*100/(I.width*s),Q=H*100/(I.height*s),C=E.x+M,oe=E.y+Q;W({x:Math.max(-X,Math.min(C,X))||0,y:Math.max(-X,Math.min(oe,X))||0}),c.preventDefault()},l=c=>{if(i)w.current={x:c.touches[0].clientX,y:c.touches[0].clientY,time:Date.now()},h.current={clientX:c.touches[0].clientX,clientY:c.touches[0].clientY},e.current=!1,a&&m(c);else{if(f)return;!a&&u(c),n(!a),c.preventDefault()}},_=c=>{if(c.touches.length!==0){if(h.current={clientX:c.touches[0].clientX,clientY:c.touches[0].clientY},i){if(!w.current)return;if(f){x(c);return}const I=c.touches[0].clientX,X=c.touches[0].clientY,D=Math.abs(I-w.current.x),H=Math.abs(X-w.current.y);(D>10||H>10)&&(e.current=!0)}a&&u(c)}},g=c=>{if(i){if(!w.current)return;const I=Date.now()-w.current.time;!e.current&&I<300&&!f&&(n(!0),u(c),c.preventDefault()),S(!1),w.current=null}else n(!1)},v=c=>{"touches"in c||f||(a?!i&&n(!1):(n(!0),u(c)),c.preventDefault())},N=c=>{"touches"in c||a&&u(c)},q=c=>{if(!("touches"in c)){if(i){S(!1);return}n(!1)}},F=c=>{n(!1),c.stopPropagation()},B=a?`scale(${s}) translateX(${T.x}%) translateY(${T.y}%)`:"none",ie=k("PDP.Zoom.Close.label").label,ne=ce.only(r);U(()=>{const c=()=>{a&&(n(!1),W({x:0,y:0}),S(!1))},I=document.querySelector("#gallery");if(I)return I.addEventListener("click",c),()=>I.removeEventListener("click",c)},[a]);const ue=je(ne,{...ne.props,draggable:!1,style:{...(de=ne.props)==null?void 0:de.style,"--transform":B}});return U(()=>{o(a?`pdp-zoom ${i?"pdp-zoom--no-effects":"pdp-zoom--zoomed"}`:"pdp-zoom")},[a,i]),U(()=>{if(y.current===B)return;y.current=B,requestAnimationFrame(()=>{if(!z.current)return;z.current.querySelectorAll("img").forEach(X=>{a&&B!=="none"?X.style.setProperty("transform",B,"important"):X.style.removeProperty("transform")})})},[B,a]),U(()=>()=>{Z.current&&cancelAnimationFrame(Z.current)},[]),$("figure",{ref:z,className:b,onClick:v,onMouseMove:N,onMouseLeave:q,onTouchStart:l,onTouchMove:_,onTouchEnd:g,children:[ue,i&&a&&t(ge,{"aria-label":ie,variant:"tertiary",className:"pdp-zoom__close-button",icon:t($e,{}),onClick:F})]})},ft=({className:r,title:s,sku:i,hideSku:a=!1,variantName:n,variantSku:b,children:o,...f})=>$("div",{...f,className:A(["pdp-header",r]),children:[t("div",{className:"pdp-header__title",children:t(O,{node:s})}),!a&&t("div",{className:"pdp-header__sku",children:t(O,{node:i})}),(n||b)&&$("div",{className:"pdp-header__variant",children:[n&&t("span",{className:"pdp-header__variant-name",children:t(O,{node:n})}),n&&b&&t("span",{className:"pdp-header__variant-separator",children:" – "}),b&&t("span",{className:"pdp-header__variant-sku",children:t(O,{node:b})})]})]}),vt=({className:r,price:s,specialPrice:i,tiers:a,children:n,...b})=>{const o=k("PDP.Product.RegularPrice.label").label,f=k("PDP.Product.SpecialPrice.label").label,S=k("PDP.Product.TierPrice.label").label;return $("div",{...b,className:A(["pdp-price",r]),children:[i&&t(O,{node:i,className:A(["pdp-price__amount-special","pdp-price__amount"]),"aria-label":f,role:"text"}),s&&t(O,{node:s,className:A(["pdp-price__amount-regular","pdp-price__amount--grey"]),"aria-label":o,role:"text"}),a&&t(O,{node:a,className:A(["pdp-price__tiers"]),"aria-label":S,role:"text"})]})},wt=({locale:r,tiers:s,regularPrice:i,...a})=>{const n=k("PDP.Product.TierPricing.label").label;return!s||s.length===0?null:t("div",{className:"pdp-price-tiers",...a,children:s.map((b,o)=>{var T,W;const f=((T=b==null?void 0:b.tier)==null?void 0:T.amount)??0,S=(b==null?void 0:b.quantity)??0,Y=((W=b==null?void 0:b.tier)==null?void 0:W.currency)??"";let p=0;i&&f&&f<i&&(p=Math.round((i-f)/i*100));const E=n.replace("{quantity}",S.toString()).split("{price}")[0],J=n.replace("{quantity}",S.toString()).split("{price}")[1].replace("{percent}",p>0?p.toString():"0");return t("div",{className:"pdp-price-tiers__tier",children:$("span",{className:"pdp-price-tiers__text",children:[E,t(_e,{amount:f,currency:Y,locale:r,className:"pdp-price-tiers__price"}),J]})},o)})})},at=r=>{switch(r){case"number":return"number";case"email":return"email";default:return"text"}},nt=r=>r.name==="giftcard/giftcard_message"?"textarea":r.name==="giftcard/giftcard_amount"?"picker":"input",ct=(r,s,i,a)=>[{text:i,value:"0",disabled:!1},...r.map(b=>({text:b.toString(),value:b.toString(),disabled:!1})),...s?[{text:a,value:"other",disabled:!1}]:[]],ve=(r,s,i)=>{const{validationRule:a}=r;if(r.name==="giftcard/giftcard_amount"){if(a.required&&(s==="0"||!s||s.trim()==="")||s==="0")return i.RequiredFieldError;if(s==="other")return""}else if(a.required&&(!s||s.trim()===""))return i.RequiredFieldError;if(!s||s.trim()==="")return"";switch(a.type){case"email":{if(!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(s))return i.EmailError;break}case"number":{const n=Number(s);if(isNaN(n))return i.NumberError;if(a.min!==void 0&&n<a.min)return i.MinError.replace("{min}",a.min.toString());if(a.max!==void 0&&n>a.max)return i.MaxError.replace("{max}",a.max.toString());if(a.values&&!a.values.some(o=>typeof o=="number"?o===n:o===s))return i.InvalidValueError.replace("{values}",a.values.join(", "));break}case"string":{const n=s.length;if(a.minLength!==void 0&&n<a.minLength)return i.MinLengthError.replace("{min_length}",a.minLength.toString());if(a.maxLength!==void 0&&n>a.maxLength)return i.MaxLengthError.replace("{max_length}",a.maxLength.toString());break}}return""},Pt=({options:r,currency:s,optionValues:i,onOptionChange:a,onValidationChange:n})=>{const b=k("PDP.Product.GiftCardOptions.ChooseAmount.label").label,o=k("PDP.Product.GiftCardOptions.OtherAmount.label").label,f=k("PDP.Product.GiftCardOptions.RequiredFieldError.label").label,S=k("PDP.Product.GiftCardOptions.NumberError.label").label,Y=k("PDP.Product.GiftCardOptions.MinError.label").label,p=k("PDP.Product.GiftCardOptions.MaxError.label").label,E=k("PDP.Product.GiftCardOptions.MinLengthError.label").label,J=k("PDP.Product.GiftCardOptions.MaxLengthError.label").label,T=k("PDP.Product.GiftCardOptions.EmailError.label").label,W=k("PDP.Product.GiftCardOptions.InvalidValueError.label").label,[z,j]=Ae({}),[Z,y]=Ae(!1),w=Ze(l=>r.find(_=>_.name===l),[r]),e=Ke(()=>({RequiredFieldError:f,NumberError:S,MinError:Y,MaxError:p,MinLengthError:E,MaxLengthError:J,EmailError:T,InvalidValueError:W}),[f,S,Y,p,E,J,T,W]);Se(()=>{const l=r.every(_=>{if(_.name==="giftcard/custom_giftcard_amount"&&!Z)return!0;const g=i.find(N=>N.id===_.uid),v=(g==null?void 0:g.value)||"";return ve(_,v,e)===""});n(l)},[r,i,n,e,Z]),Se(()=>{const l=w("giftcard/giftcard_amount"),_=w("giftcard/custom_giftcard_amount"),g=i.find(F=>F.id===(l==null?void 0:l.uid)),v=(g==null?void 0:g.value)||"",N=Z,q=l?v==="other":!!_;y(q),N&&!q&&_&&a(_.uid,"")},[i,w,Z,a]);const h=(l,_)=>{const g=ve(l,_,e);j(v=>({...v,[l.uid]:g})),a(l.uid,_)},u=(l,_)=>{const g=ve(l,_,e);j(v=>({...v,[l.uid]:g}))},m=(l,_)=>{const g=_.target.value;h(l,g)},x=l=>{const _=i.find(B=>B.id===l.uid),g=_==null?void 0:_.value,v=z[l.uid],N=nt(l),q=!!w("giftcard/custom_giftcard_amount");let F=l.label;return l.name==="giftcard/custom_giftcard_amount"&&s&&(F=`${l.label} ${s}`),t(He,{label:F,className:A(["pdp-gift-card-options__option-field",N==="textarea"&&"pdp-gift-card-options__option-field--full-width"]),error:v,children:N==="textarea"?t(Ge,{value:g,label:l.label,onChange:B=>h(l,B.target.value),onBlur:B=>u(l,B.target.value),"aria-invalid":!!v}):N==="picker"?t(ke,{"aria-label":l.label,label:l.label,handleSelect:B=>m(l,B),options:ct(l.validationRule.values||[],q,b,o),value:g,"aria-invalid":!!v}):t(Ie,{type:at(l.validationRule.type),value:g,onChange:B=>h(l,B.target.value),onBlur:B=>u(l,B.target.value),"aria-invalid":!!v})},l.uid)};return $("div",{className:"pdp-gift-card-options__grid",children:[$("div",{className:"pdp-gift-card-options__row",children:[w("giftcard/giftcard_amount")&&x(w("giftcard/giftcard_amount")),w("giftcard/custom_giftcard_amount")&&Z&&x(w("giftcard/custom_giftcard_amount"))]}),$("div",{className:"pdp-gift-card-options__row",children:[w("giftcard/giftcard_sender_name")&&x(w("giftcard/giftcard_sender_name")),w("giftcard/giftcard_sender_email")&&x(w("giftcard/giftcard_sender_email"))]}),$("div",{className:"pdp-gift-card-options__row",children:[w("giftcard/giftcard_recipient_name")&&x(w("giftcard/giftcard_recipient_name")),w("giftcard/giftcard_recipient_email")&&x(w("giftcard/giftcard_recipient_email"))]}),t("div",{className:"pdp-gift-card-options__row",children:w("giftcard/giftcard_message")&&x(w("giftcard/giftcard_message"))})]})},gt=({label:r,value:s,onLinkChange:i,currency:a,locale:n,className:b,...o})=>{const f=k("PDP.DownloadableOptions.Sample.label").label,S=k("PDP.DownloadableOptions.ViewSample.label"),{links:Y,samples:p,purchaseSeparately:E}=s,J=E?new Set:new Set(Y.map(y=>y.uid)),[T,W]=V(J),z=le((y,w,e)=>{!E||e||(W(h=>{const u=new Set(h);return w?u.add(y):u.delete(y),u}),i==null||i(y,w))},[i,E]),j=y=>{const w=E&&T.has(y.uid);return $("div",{className:`pdp-downloadable-options__item ${w?"pdp-downloadable-options__item--selected":""} ${E?"":"pdp-downloadable-options__item--disabled"}`,children:[t("button",{type:"button",className:"pdp-downloadable-options__clickable","aria-pressed":w,disabled:!E,onClick:()=>E&&z(y.uid,!w,!E),onKeyDown:e=>{E&&(e.key==="Enter"||e.key===" ")&&(e.preventDefault(),z(y.uid,!w,!E))},children:t("div",{className:"pdp-downloadable-options__content",children:$("div",{className:"pdp-downloadable-options__header",children:[t("span",{className:"pdp-downloadable-options__title",children:y.label}),t(_e,{amount:y.price,currency:a,locale:n,className:"pdp-downloadable-options__price"})]})})}),y.sample_url&&t("a",{href:y.sample_url,className:"pdp-downloadable-options__sample-button",target:"_blank",rel:"noopener noreferrer","aria-label":S.label.replace("{label}",y.label),children:f})]},y.uid)},Z=y=>$("div",{className:"pdp-downloadable-options__item pdp-downloadable-options__item--sample",children:[t("button",{type:"button",className:"pdp-downloadable-options__clickable","aria-pressed":!1,disabled:!0,children:t("div",{className:"pdp-downloadable-options__content",children:t("div",{className:"pdp-downloadable-options__header",children:t("span",{className:"pdp-downloadable-options__title",children:y.label})})})}),t("a",{href:y.url,className:"pdp-downloadable-options__sample-button",target:"_blank",rel:"noopener noreferrer","aria-label":`${f} ${y.label}`,children:f})]},y.uid);return t("div",{...o,className:A(["pdp-downloadable-options",b]),"data-slot-key":"product-downloadable-options",children:$("div",{className:"pdp-downloadable-options__field",children:[t("div",{className:"pdp-downloadable-options__field__label",children:r}),$("div",{className:"pdp-downloadable-options__list",children:[Y.map(y=>j(y)),p.map(y=>Z(y))]})]})})};export{be as C,gt as D,Pt as G,ft as H,Ce as O,vt as P,bt as S,lt as Z,mt as a,wt as b,_t as c};
|
|
3
|
+
import{debounce as Ae,classes as A,VComponent as W}from"@dropins/tools/lib.js";import{useText as M}from"@dropins/tools/i18n.js";import*as he from"@dropins/tools/preact-compat.js";import{useState as ee,Children as oe,useRef as de,useMemo as ge,useEffect as te,useCallback as ae,useLayoutEffect as Ye}from"@dropins/tools/preact-compat.js";import{jsxs as E,jsx as t,Fragment as ve}from"@dropins/tools/preact-jsx-runtime.js";import{Button as Ne,Icon as ze,Price as _e,Incrementer as Oe,Checkbox as Fe,Picker as $e,ColorSwatch as He,ImageSwatch as Ge,TextSwatch as Ie,Field as je,TextArea as Ze,Input as Ke}from"@dropins/tools/components.js";import{cloneElement as Je}from"@dropins/tools/preact.js";import{useState as Se,useCallback as Ve,useMemo as Qe,useEffect as Le}from"@dropins/tools/preact-hooks.js";const Ue=r=>he.createElement("svg",{width:24,height:24,viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",...r},he.createElement("path",{vectorEffect:"non-scaling-stroke",d:"M7.74512 9.87701L12.0001 14.132L16.2551 9.87701",stroke:"currentColor",strokeWidth:1,strokeLinecap:"square",strokeLinejoin:"round"})),De=r=>he.createElement("svg",{width:24,height:24,viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",...r},he.createElement("path",{vectorEffect:"non-scaling-stroke",d:"M18.3599 5.64001L5.62988 18.37",stroke:"currentColor"}),he.createElement("path",{vectorEffect:"non-scaling-stroke",d:"M18.3599 18.37L5.62988 5.64001",stroke:"currentColor"})),Ce=24,Ee=16,et="32";var Re=(r=>(r[r.small=16]="small",r[r.medium=24]="medium",r[r.large=64]="large",r))(Re||{});const be=({show:r=1,scrollbar:i=!1,peak:p=!1,arrows:n=!1,controls:c="dots",arrowsOnMainImage:b=!1,loop:m=!1,gap:v=null,direction:g="horizontal",width:B="100%",height:h="100%",defaultIndex:D=0,className:Q,children:Y,thumbnails:j=null,isZoomed:I,...J})=>{const X=M("PDP.Carousel.label").label,N=M("PDP.Carousel.Slide.label").label,w=M("PDP.Carousel.Previous.label").label,s=M("PDP.Carousel.Next.label").label,K=M("PDP.Carousel.Controls.label").label,G=M("PDP.Carousel.Controls.Button.label").label,[T,d]=ee(()=>Me(r)),e=Math.ceil(oe.count(Y)/T),a=p?Ce:0,_=v?Re[v]:0,f=oe.count(Y)%T,[u,x]=ee(m?ce()?D-1:D+1:D),k=de([]),[S,ne]=ee(0),[V,y]=ee(0),U=ge(()=>oe.toArray(j),[j]),l=ge(()=>{const o=oe.toArray(Y).reduce((P,q,L)=>L%T===0?[...P,[q]]:[...P.slice(0,-1),[...P[P.length-1],q]],[]);return!m||o.length===1?o:m&&oe.count(Y)%T===0?[o[e-1]].concat(o).concat([o[0],o[1]]):[oe.toArray(Y).slice(-T)].concat(o).concat([o[0],o[1]])},[Y,T,e,m]),z=de(null),O=de(null),R=c==="thumbnailsRow"||c==="thumbnailsColumn";te(()=>{const o=z.current;if(!o)return;const P=Ae(()=>{ne(o.offsetWidth??0),y(o.offsetHeight??0);const L=window.innerWidth,H=Me(r,L);H!==T&&d(H)},50),q=new ResizeObserver(P);return q.observe(o),()=>{q.unobserve(o)}},[T,r]);const F=ae(o=>{const P=m?o-1:o,q=k==null?void 0:k.current[0],L=(q==null?void 0:q.offsetWidth)+Ee,H=(q==null?void 0:q.offsetHeight)+Ee,Z=O.current,pe=c==="thumbnailsRow",me=c==="thumbnailsColumn",ie=pe?Z==null?void 0:Z.offsetWidth:Z==null?void 0:Z.offsetHeight,le=pe?L:H;if((pe||me)&&ie){const We=Math.floor((pe?Z.clientWidth:Z.clientHeight)/le),Xe=Math.floor(We/2),we=(P-Xe)*le;Z.style.scrollBehavior="smooth",pe?Z.scrollLeft=ce()?-(Z.scrollWidth-Z.clientWidth-we):we:Z.scrollTop=we}},[c,m]);te(()=>{F(u)},[u,F]);const $=ae((o,P,q)=>{R&&F(o);const L=z.current,H=a?L.offsetWidth-a:L.offsetWidth-a+_;if(!Array.from(L.querySelectorAll("[data-index]")).filter(ie=>{const le=Number(ie.getAttribute("data-index"));return!isNaN(le)&&le>-1})[o])return;if(q){const ie=o===0?e:0,le=H*(e+(f||T)/T);if(ce()){if(L.scrollLeft<=0&&L.scrollLeft>-(H-5)){$(1,!0);return}if(L.scrollLeft<H-le&&L.scrollLeft>=-le){$(e,!0);return}L.style.scrollBehavior="auto",L.scrollLeft=ie===0?0:-le,$(ie===0?1:e,!0)}else{if(L.scrollLeft>=0&&L.scrollLeft<H-5){$(1,!0);return}if(L.scrollLeft>le-H&&L.scrollLeft<=le){$(e,!0);return}L.style.scrollBehavior="auto",L.scrollLeft=ie===0?0:le,$(ie===0?1:e,!0);return}}const me=(L.offsetWidth-_)/T*l[o].length-a;L.style.scrollBehavior=P?"smooth":"auto",L.scrollLeft=ce()?-(l[o].length===T?H*o:H*(o-1)-me):l[o].length===T?H*o:H*(o-1)+me},[_,e,a,T,f,l,F,c]),C=ae(()=>{if(m){const P=u-1;$(P,!0,ce()?u===e-1:u===1);return}const o=u<=0?0:u-1;$(o,!0)},[u,$,m]),re=ae(()=>{const o=l.length-1;if(m){const q=u+1;$(q,!0,ce()?u===0:u===e);return}const P=u>=o?o:u+1;$(P,!0)},[l.length,m,u,$,e]);te(()=>{const o=P=>{P.key==="ArrowLeft"&&(ce()?re():C()),P.key==="ArrowRight"&&(ce()?C():re())};return window.addEventListener("keydown",o),()=>{window.removeEventListener("keydown",o)}},[re,C]),Ye(()=>{$(m?D+1:D,!1)},[D,$,m,S]);const ue=Ae(()=>{const o=z.current,P=a?o.offsetWidth-a:o.offsetWidth-a+_,q=Math.abs(o.scrollLeft)/P,L=Math.abs(Math.round(q)-q<1?Math.round(q):Math.ceil(q));if(R&&F(L),m){const H=P*(e+(f||T)/T),Z=ce()?-o.scrollLeft:o.scrollLeft;if(Math.ceil(Math.abs(Z))>=Math.ceil(H)-5){o.style.scrollBehavior="auto",o.scrollLeft=ce()?-o.offsetWidth+(Math.ceil(Z)-Math.ceil(H)-a):o.offsetWidth+(Math.ceil(Z)-Math.ceil(H)-a);return}if(Math.abs(Z)===0){o.style.scrollBehavior="auto",o.scrollLeft=ce()?-(H-o.offsetWidth+a):H-o.offsetWidth+a;return}}u!==L&&x(L)},100);te(()=>{const o=z.current;return o==null||o.addEventListener("scroll",ue),()=>{o==null||o.removeEventListener("scroll",ue)}},[ue]);const se=(o,P,q)=>t(Ne,{className:A([["pdp-carousel__button",!o],[`pdp-carousel__button--${P}`,!o],[`pdp-carousel__button--${c}`,o]]),style:{"--height":`${V}px`},variant:"tertiary","aria-label":P==="next"?s:w,onClick:q,disabled:m?!1:P==="next"?u>=l.length-1:u<1,children:t(ze,{className:A([["pdp-carousel__button__icon",!o],[`pdp-carousel__button__icon--${P}`,!o],[`pdp-carousel__button__icon--${c}--${P}`,o]]),size:et,source:Ue})}),ye=n&&l.length!=1&&se(R,"prev",C),xe=n&&l.length!=1&&se(R,"next",re),Be=n&&l.length!=1&&se(!1,"prev",C),Te=n&&l.length!=1&&se(!1,"next",re);return E("div",{role:"region","aria-roledescription":X,className:A(["pdp-carousel",["pdp-carousel--main-image-controls",b],["pdp-carousel--arrows",n&&!R],[`pdp-carousel--${c}`,R],Q]),style:{"--flex-carousel":c==="thumbnailsColumn"?"row-reverse":"column","--gap":R?"0":"var(--spacing-small)","--width":B},...J,children:[t("div",{ref:z,className:A(["pdp-carousel__wrapper",`pdp-carousel__wrapper--${g}`,["pdp-carousel__wrapper--scrollbar",i],["pdp-carousel__wrapper--peak",p]]),style:{"--total-width":c==="thumbnailsColumn"?"81.6%":"100%","--height":c==="thumbnailsColumn"?"auto":h,"--gap":v?`var(--spacing-${v})`:"0px","--per-page":T},tabIndex:0,children:l.map((o,P)=>{const q=o.length<T;return t("div",{role:"group","aria-roledescription":N,"data-index":P,className:A(["pdp-carousel__slide",`pdp-carousel__slide--${g}`,["pdp-carousel__slide--active",u===P],["pdp-carousel__slide--orphan",q],["pdp-carousel__slide--hidden",S===0]]),style:{"--length":o.length},children:o},P)})}),!R&&E(ve,{children:[ye,xe]}),R&&b&&E(ve,{children:[Be,Te]}),c&&l.length!=1&&E("div",{className:A([[`pdp-carousel__controls__container--${c}`,R],["pdp-carousel__controls__container--no-arrows",!n||b]]),style:{"--width":c==="thumbnailsRow"?`${S}px`:B,"--height":`${V}px`,"--nr-thumbnails":U.length},children:[(R||I)&&!b&&ye,t("div",{ref:O,className:A([[`pdp-carousel__controls__wrapper--${c}`,R],["pdp-carousel__controls__wrapper",R]]),children:t("div",{role:"group","aria-label":K,className:A(["pdp-carousel__controls",[`pdp-carousel__controls--${c}`,R]]),children:(m?l.slice(0,e):l).map((o,P)=>{const q=m?e:l.length,L=m?u-1===P:u===P;return R?E("label",{className:A(["pdp-carousel__thumbnail__container"]),ref:H=>{H&&(k.current[P]=H)},children:[t("input",{type:"radio",name:"carousel-thumbnails","aria-label":G.replace("{key}",String(P+1)).replace("{total}",String(q)),checked:L&&S!==0,onChange:()=>{$(m?P+1:P,!0)},...J,className:A(["pdp-carousel__thumbnail",["pdp-carousel__thumbnail--selected",L&&S!==0]])}),t("span",{className:A(["pdp-carousel__thumbnail__span"]),children:U[P]})]},P):t("button",{"aria-label":G.replace("{key}",String(P+1)).replace("{total}",String(q)),onClick:()=>{$(m?P+1:P,!0)},className:A(["pdp-carousel__controls__button",["pdp-carousel__controls__button--active",L]])},P)})})}),(R||I)&&!b&&xe]})]})};function Me(r,i=0){if(typeof r=="number")return r;const{small:p,medium:n,large:c}=r,m=[{breakpoint:1024,value:c},{breakpoint:786,value:n},{breakpoint:0,value:p}].find(({breakpoint:v})=>i>v);return m?m.value:p}function ce(){return document.documentElement.dir==="rtl"}const ft=({title:r,breadcrumbs:i,galleryContent:p,infoContent:n,productContent:c,sku:b,outOfStock:m,shortDescription:v,description:g,attributes:B,images:h,options:D,giftCardOptions:Q,downloadableOptions:Y,price:j,specialPrice:I,className:J,children:X,quantity:N,actions:w,carouselConfig:s,zoomType:K="overlay",closeButton:G=!0,...T})=>{var S,ne,V,y,U,l,z,O,R;const d=M("PDP.Product.RegularPrice.label").label,e=M("PDP.Product.SpecialPrice.label").label,a=M("PDP.Product.OutOfStock.label").label,_=M("PDP.Product.Image.label").label,[f,u]=ee(null),x=h!=null&&h.length?h.map((F,$)=>{var re;const C=((re=r==null?void 0:r.props)==null?void 0:re.children)&&(_==null?void 0:_.replace("{product}",r.props.children.toString()).replace("{key}",String($+1)).replace("{total}",String(h.length)));return K==="zoom"?t(ct,{closeButton:G,children:t(W,{node:F,loading:$===0?"eager":"lazy",alt:C},$)}):t(W,{node:F,loading:$===0?"eager":"lazy",alt:C,onClick:()=>u($)},$)}):t("img",{src:"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7",className:"pdp-product__images__placeholder","aria-hidden":!0}),k=(S=s==null?void 0:s.thumbnails)!=null&&S.length?s.thumbnails.map((F,$)=>{var C;return t(W,{node:F,loading:(s==null?void 0:s.thumbnailsLoadingMode)||"lazy",alt:((C=r==null?void 0:r.props)==null?void 0:C.children)&&(_==null?void 0:_.replace("{product}",r.props.children.toString()).replace("{key}",String($+1)).replace("{total}",String(h.length)))},$)}):t("img",{src:"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7",className:"pdp-product__images__placeholder","aria-hidden":!0});return E("div",{...T,className:A(["pdp-product",J]),children:[i&&t(W,{node:i,className:"pdp-product__breadcrumbs"}),E("div",{className:"pdp-product__column-container pdp-product__gallery-column",children:[t("div",{className:"pdp-product__column-body",children:(ne=s==null?void 0:s.controls)!=null&&ne.desktop?t(be,{className:"pdp-product__overlay__carousel",arrows:(h==null?void 0:h.length)>1,controls:(h==null?void 0:h.length)>1?s.controls.desktop:"dots",arrowsOnMainImage:s==null?void 0:s.arrowsOnMainImage,loop:(s==null?void 0:s.loopable)&&(h==null?void 0:h.length)>1,peak:((V=s==null?void 0:s.thumbnails)==null?void 0:V.length)>1&&((y=s==null?void 0:s.peak)==null?void 0:y.desktop)||!1,gap:(s==null?void 0:s.gap)||null,width:"100%",height:"100%",defaultIndex:f||0,thumbnails:k,children:x}):t(tt,{className:"pdp-product__images",gap:"small",children:x})}),p&&t(W,{node:p,className:"pdp-product__gallery-content"})]}),E("div",{className:"pdp-product__column-container pdp-product__content-column",children:[E("div",{className:"pdp-product__column-body",children:[E("div",{className:"pdp-product__header",children:[r&&t(W,{node:r,className:"pdp-product__title"}),b&&t(W,{node:b,className:"pdp-product__sku"})]}),E("div",{className:"pdp-product__prices",children:[I&&t(W,{node:I,className:A(["pdp-product__price-special","pdp-product__price"]),"aria-label":e,role:"text"}),j&&t(W,{node:j,className:A(["pdp-product__price-regular","pdp-product__price--grey"]),"aria-label":d,role:"text"})]}),(U=s==null?void 0:s.controls)!=null&&U.mobile&&((l=s==null?void 0:s.controls)==null?void 0:l.mobile)==="thumbnailsRow"?t(be,{className:"pdp-product__images pdp-product__images--carousel pdp-product__images--carousel--thumbnails",width:"100%",height:"auto",arrows:(h==null?void 0:h.length)>1,controls:(h==null?void 0:h.length)>1?"thumbnailsRow":null,loop:(s==null?void 0:s.loopable)&&(h==null?void 0:h.length)>1,peak:((z=s==null?void 0:s.thumbnails)==null?void 0:z.length)>1&&((O=s==null?void 0:s.peak)==null?void 0:O.mobile)||!1,gap:(s==null?void 0:s.gap)||null,thumbnails:k,children:x}):t(be,{className:"pdp-product__images pdp-product__images--carousel",peak:((R=s==null?void 0:s.peak)==null?void 0:R.mobile)&&(h==null?void 0:h.length)>1,gap:(s==null?void 0:s.gap)||null,width:"100%",height:"auto",arrows:(h==null?void 0:h.length)>1,controls:(h==null?void 0:h.length)>1?"dots":null,loop:(s==null?void 0:s.loopable)&&(h==null?void 0:h.length)>1,children:x}),E("div",{className:A(["pdp-product__actions",["pdp-product__actions--out-of-stock",m]]),children:[m&&t("div",{className:"pdp-product__out-of-stock__text",children:a}),D&&t(W,{node:D,className:A(["pdp-product__options"])}),Q&&t(W,{node:Q,className:A(["pdp-product__gift-card-options"])}),Y&&t(W,{node:Y,className:A(["pdp-product__downloadable-options"])}),N&&t("div",{className:"pdp-product__quantity",children:t(W,{node:N})}),w&&t(W,{node:w,className:A(["pdp-product__buttons"])})]}),v&&t(W,{node:v,className:A(["pdp-product__short_description"])}),g&&t(W,{node:g,className:A(["pdp-product__description"])}),B?t("div",{className:"pdp-product__attributes",children:B}):null]}),n&&t(W,{node:n,className:"pdp-product__info-content"})]}),c&&t(W,{node:c,className:"pdp-product__content"}),f===null?null:t(rt,{className:"pdp-product__overlay",onClose:()=>u(null),centered:!0,children:t(be,{className:"pdp-product__overlay__carousel",arrows:(h==null?void 0:h.length)>1,width:"100%",height:"100%",defaultIndex:f||0,loop:(s==null?void 0:s.loopable)&&(h==null?void 0:h.length)>1,controls:(h==null?void 0:h.length)>1?"dots":null,isZoomed:!0,children:x})})]})},tt=({children:r,gap:i=null,className:p,style:n,...c})=>{const b=oe.count(r);return t("div",{...c,className:A(["pdp-gallery-grid",p]),style:{"--gap":i?`var(--spacing-${i})`:"0px",...n},children:oe.map(r,(m,v)=>t("div",{className:"pdp-gallery-grid__item",children:t(W,{node:m,loading:v===0?"eager":"lazy"},m.props.src)},b+v))})},vt=({amount:r,currency:i,locale:p,variant:n,sale:c,minimumAmount:b,maximumAmount:m,className:v,...g})=>t(ve,{children:r||b===m?t("div",{className:"pdp-price-range",...g,children:t(_e,{amount:r||b,currency:i,locale:p,variant:n,sale:c,className:v})}):E("div",{className:"pdp-price-range",...g,children:[t(_e,{amount:b,currency:i,locale:p,className:v}),t("span",{className:"pdp-price-range__label",children:"-"}),t(_e,{amount:m,currency:i,locale:p,className:v})]})}),rt=({centered:r,onClose:i,className:p,children:n,...c})=>{const b=M("PDP.Overlay.Close.label").label,m=de(null),v=ae(()=>{i==null||i()},[i]);return te(()=>{const g=B=>{B.key==="Escape"&&v()};return document.addEventListener("keydown",g),()=>{document.removeEventListener("keydown",g)}},[v]),te(()=>{const g=m.current;g==null||g.focus();const B=document.scrollingElement,h=B.style.overflow;return B.style.overflow="hidden",()=>{B.style.overflow=h}},[]),E("div",{...c,className:A(["pdp-overlay",["pdp-overlay--centered",r],p]),ref:m,role:"dialog","aria-describedby":"overlay-content",tabindex:0,children:[t("div",{className:"pdp-overlay__content",id:"overlay-content",children:n}),t(Ne,{"aria-label":b,variant:"tertiary",className:"pdp-overlay__close-button",onClick:v,icon:t(De,{})})]})},lt=["text","image","color","dropdown"],at=r=>r.map(i=>({...i,text:i.label,disabled:!i.inStock}));function qe(r){return r==="ProductViewOptionValueProduct"}function fe(r,i){return!(!r||!qe(i))}function ke(r,i){return i.reduce((p,n)=>{const c=n.items.filter(m=>r.includes(m.id));if(c.length===0)return p;if(n.multiple)return{...p,[n.id]:{label:c.map(m=>m.label).join(", "),values:c.map(m=>m.id)}};const b=c[0];return{...p,[n.id]:{label:b.label,value:b.id}}},{})}function nt(r){if(!(!r||!("value"in r)))return r.value}const wt=({options:r,hideSelectedValue:i,disablePreselections:p,selectedUIDs:n,onValues:c,onErrors:b,bundleOptionQuantities:m,onBundleOptionQuantityChange:v,defaultOptions:g,selectionsToUpdate:B,className:h,children:D,imageSwatchNode:Q,...Y})=>{const j=M("PDP.Swatches.Required.label").label,I=M("PDP.Swatches.ChooseOption.label").label,J=M("PDP.Swatches.BundleOptionQuantity.label").label,[X,N]=ee(()=>{let d=g!=null&&g.length&&(r!=null&&r.length)?ke(g,r):{};return r==null||r.forEach(e=>{if(d[e.id])return;const{items:a}=e;if(e.multiple){const u=a==null?void 0:a.filter(x=>!!(g!=null&&g.includes(x.id))||x.selected);u!=null&&u.length&&(d={...d,[e.id]:{label:u.map(x=>x.label).join(", "),values:u.map(x=>x.id)}});return}const _=a==null?void 0:a.find(u=>g==null?void 0:g.includes(u.id)),f=a==null?void 0:a.find(u=>u.selected);_?d={...d,[e.id]:{label:_.label,value:_.id}}:f&&(d={...d,[e.id]:{label:f.label,value:f.id}})}),d});te(()=>{if(n){const d=ke(n,r);if(JSON.stringify(d)===JSON.stringify(X))return;N(e=>{let a={...e,...d};return c==null||c(a,(n==null?void 0:n[0])??""),a})}},[n]),te(()=>{B==null||B.forEach(d=>{N(e=>{var u;const a=(u=d==null?void 0:d.items)==null?void 0:u.filter(x=>x.selected);if(!(a!=null&&a.length))return e;if(d.multiple)return{...e,[d.id]:{label:a.map(k=>k.label).join(", "),values:a.map(k=>k.id)}};const _=a[0];return{...e,[d.id]:{label:_.label,value:_.id}}})})},[B,N]),ge(()=>{const d=r==null?void 0:r.reduce((e,a)=>{var u;const _=X[a.id];let f=!1;return a.multiple?f=!!(_&&"values"in _&&_.values.length>0):(u=a==null?void 0:a.items)==null||u.forEach(x=>{_&&"value"in _&&_.value===x.id&&(f=!0)}),a.required&&!f&&(e[a.id]=j),e},{});return b==null||b(d),d},[X]);const w=ae((d,e,a)=>{N(_=>{let f={..._,...d&&{[d]:{label:e,value:a}}};if(e===I){const u={...f};delete u[d],f=u}return c==null||c(f,a),f})},[c]),s=ae((d,e,a,_)=>{N(f=>{const u=f[d],x=u&&"values"in u?[...u.values]:u&&"value"in u&&u.value?[u.value]:[],k=a?[...new Set([...x,e])]:x.filter(y=>y!==e),S=new Map(_.map(y=>[y.id,y.label])),ne=k.map(y=>S.get(y)).filter(Boolean).join(", "),V={...f};return k.length===0?delete V[d]:V[d]={label:ne,values:k},c==null||c(V,e),V})},[c]),K=ae((d,e)=>{var _;const a=((_=e.selectedOptions[0])==null?void 0:_.label)??"";w(d,a,e.value)},[w]),G=ae((d,e)=>{if(!fe(d,e))return null;const a=d.quantity&&d.quantity>0?d.quantity:1,_=(m==null?void 0:m[d.id])??a,f=J.replace("{option}",d.label);return t(Oe,{name:`bundle-option-quantity__${d.id}`,className:"pdp-swatches__bundle-option__quantity",min:1,value:String(_),disabled:!d.canEditQuantity,"aria-label":f,onValue:u=>{const x=Math.max(1,Number(u)||1);v==null||v(d.id,x)}},`bundle-qty-${d.id}`)},[J,m,v]),T=ae(({items:d,id:e,required:a,type:_,selected:f,label:u,multiple:x,typename:k})=>{const S=`pdp-swatch-${e}=${Math.random().toString(36)}`;if(x){const y=X[e],U=new Set(y&&"values"in y?y.values:[]);return(d==null?void 0:d.length)>0&&t("div",{className:A(["pdp-swatches__options","pdp-swatches__options--checkboxes"]),children:d==null?void 0:d.map(l=>E("div",{className:"pdp-swatches__bundle-option",children:[t(Fe,{name:`pdp-bundle-multi__${e}__${l.id}`,label:l.label,checked:U.has(l.id),disabled:!l.inStock,onChange:z=>s(e,l.id,z.currentTarget.checked,d)}),U.has(l.id)&&fe(l,k)&&G(l,k)]},l.id))})}const ne=d==null?void 0:d.find(y=>y.id===f),V=qe(k);return(d==null?void 0:d.length)>0&&t("div",{className:A(["pdp-swatches__options",V&&"pdp-swatches__options--bundle"]),children:(_==null?void 0:_.toLowerCase())==="dropdown"?E(ve,{children:[t($e,{id:S,name:e,"aria-label":u,placeholder:p?I:void 0,handleSelect:y=>K(e,y.target),options:at(d),value:f}),fe(ne,k)&&G(ne,k)]}):d==null?void 0:d.map(y=>{const U={key:y.id,id:`${S}-${y.id}`,name:e,value:y.value,label:y.label,groupAriaLabel:u,selected:f===y.id,outOfStock:!y.inStock,required:a===null?!0:a,onValue:()=>{w(e,y.label,y.id)}};let l;switch(_){case"text":l=t(Ie,{...U,label:y.label});break;case"image":l=t(Ge,{...U,src:y.value,alt:y.label,imageNode:Q});break;case"color":l=t(He,{...U,size:"large",color:y.value});break;default:return console.warn(`Invalid swatch type ${_}`),null}return V?E("div",{className:"pdp-swatches__bundle-option",children:[l,y.id===f&&fe(y,k)&&G(y,k)]},y.id):l})})},[I,w,K,s,G,X]);return t("div",{...Y,className:A(["pdp-swatches",h]),children:r==null?void 0:r.map(({type:d,label:e,id:a,multiple:_,required:f,items:u,typename:x})=>(lt.includes(d)||console.warn(`Invalid swatch type ${d}`),E("div",{id:`swatch-item-${a}`,"data-slot-key":`product-swatch--${a}`,className:"pdp-swatches__field",children:[t("div",{className:"pdp-swatches__field__label",children:X[a]?i?`${e}`:`${e}: ${X[a].label}`:e}),T({id:a,type:d,typename:x,required:f,items:u,label:e,multiple:_,selected:nt(X[a])})]},`swatch-item-${a}`)))})},ct=({children:r,scale:i=2,closeButton:p=!0})=>{var U;const[n,c]=ee(!1),[b,m]=ee("pdp-zoom"),[v,g]=ee(!1),[B,h]=ee({x:0,y:0}),[D,Q]=ee({x:0,y:0}),[Y,j]=ee({x:0,y:0}),I=de(null),J=de(null),X=de(null),N=de("none"),w=de(null),s=de(!1),K=de(null),G=ae(l=>{const z=()=>{var se;let O;J.current&&I.current?O=J.current:I.current?(O=I.current.getBoundingClientRect(),J.current=O):O=(se=l.currentTarget)==null?void 0:se.getBoundingClientRect();const R=(100-100/i)/2;let F=null;if("touches"in l)if(l.touches.length>0)F=l.touches[0],K.current={clientX:F.clientX,clientY:F.clientY};else if(l.type==="touchend"&&w.current)F={clientX:w.current.x,clientY:w.current.y};else if(K.current)F=K.current;else return;else if(l instanceof MouseEvent)F=l;else return;const $=(F.clientX-O.left)/O.width*100,C=(F.clientY-O.top)/O.height*100,re=(50-$)*(i-1)/i,ue=(50-C)*(i-1)/i;j({x:Math.max(-R,Math.min(re,R))||0,y:Math.max(-R,Math.min(ue,R))||0})};X.current&&cancelAnimationFrame(X.current),X.current=requestAnimationFrame(z)},[i]);te(()=>{J.current=null},[n]);const T=l=>{!n||l.type!=="touchstart"||(h({x:l.touches[0].clientX,y:l.touches[0].clientY}),Q({x:Y.x,y:Y.y}),g(!0))},d=l=>{var se;if(!v||l.type!=="touchmove")return;const z=(se=l.currentTarget)==null?void 0:se.getBoundingClientRect(),O=(100-100/i)/2,R=l.touches[0].clientX-B.x,F=l.touches[0].clientY-B.y,$=R*100/(z.width*i),C=F*100/(z.height*i),re=D.x+$,ue=D.y+C;j({x:Math.max(-O,Math.min(re,O))||0,y:Math.max(-O,Math.min(ue,O))||0}),l.preventDefault()},e=l=>{if(p)w.current={x:l.touches[0].clientX,y:l.touches[0].clientY,time:Date.now()},K.current={clientX:l.touches[0].clientX,clientY:l.touches[0].clientY},s.current=!1,n&&T(l);else{if(v)return;!n&&G(l),c(!n),l.preventDefault()}},a=l=>{if(l.touches.length!==0){if(K.current={clientX:l.touches[0].clientX,clientY:l.touches[0].clientY},p){if(!w.current)return;if(v){d(l);return}const z=l.touches[0].clientX,O=l.touches[0].clientY,R=Math.abs(z-w.current.x),F=Math.abs(O-w.current.y);(R>10||F>10)&&(s.current=!0)}n&&G(l)}},_=l=>{if(p){if(!w.current)return;const z=Date.now()-w.current.time;!s.current&&z<300&&!v&&(c(!0),G(l),l.preventDefault()),g(!1),w.current=null}else c(!1)},f=l=>{"touches"in l||v||(n?!p&&c(!1):(c(!0),G(l)),l.preventDefault())},u=l=>{"touches"in l||n&&G(l)},x=l=>{if(!("touches"in l)){if(p){g(!1);return}c(!1)}},k=l=>{c(!1),l.stopPropagation()},S=n?`scale(${i}) translateX(${Y.x}%) translateY(${Y.y}%)`:"none",ne=M("PDP.Zoom.Close.label").label,V=oe.only(r);te(()=>{const l=()=>{n&&(c(!1),j({x:0,y:0}),g(!1))},z=document.querySelector("#gallery");if(z)return z.addEventListener("click",l),()=>z.removeEventListener("click",l)},[n]);const y=Je(V,{...V.props,draggable:!1,style:{...(U=V.props)==null?void 0:U.style,"--transform":S}});return te(()=>{m(n?`pdp-zoom ${p?"pdp-zoom--no-effects":"pdp-zoom--zoomed"}`:"pdp-zoom")},[n,p]),te(()=>{if(N.current===S)return;N.current=S,requestAnimationFrame(()=>{if(!I.current)return;I.current.querySelectorAll("img").forEach(O=>{n&&S!=="none"?O.style.setProperty("transform",S,"important"):O.style.removeProperty("transform")})})},[S,n]),te(()=>()=>{X.current&&cancelAnimationFrame(X.current)},[]),E("figure",{ref:I,className:b,onClick:f,onMouseMove:u,onMouseLeave:x,onTouchStart:e,onTouchMove:a,onTouchEnd:_,children:[y,p&&n&&t(Ne,{"aria-label":ne,variant:"tertiary",className:"pdp-zoom__close-button",icon:t(De,{}),onClick:k})]})},Pt=({className:r,title:i,sku:p,hideSku:n=!1,variantName:c,variantSku:b,children:m,...v})=>E("div",{...v,className:A(["pdp-header",r]),children:[t("h1",{className:"pdp-header__title",children:t(W,{node:i})}),!n&&t("div",{className:"pdp-header__sku",children:t(W,{node:p})}),(c||b)&&E("div",{className:"pdp-header__variant",children:[c&&t("span",{className:"pdp-header__variant-name",children:t(W,{node:c})}),c&&b&&t("span",{className:"pdp-header__variant-separator",children:" – "}),b&&t("span",{className:"pdp-header__variant-sku",children:t(W,{node:b})})]})]}),gt=({className:r,price:i,specialPrice:p,tiers:n,children:c,...b})=>{const m=M("PDP.Product.RegularPrice.label").label,v=M("PDP.Product.SpecialPrice.label").label,g=M("PDP.Product.TierPrice.label").label;return E("div",{...b,className:A(["pdp-price",r]),children:[p&&t(W,{node:p,className:A(["pdp-price__amount-special","pdp-price__amount"]),"aria-label":v,role:"text"}),i&&t(W,{node:i,className:A(["pdp-price__amount-regular","pdp-price__amount--grey"]),"aria-label":m,role:"text"}),n&&t(W,{node:n,className:A(["pdp-price__tiers"]),"aria-label":g,role:"text"})]})},Nt=({locale:r,tiers:i,regularPrice:p,...n})=>{const c=M("PDP.Product.TierPricing.label").label;return!i||i.length===0?null:t("div",{className:"pdp-price-tiers",...n,children:i.map((b,m)=>{var Y,j;const v=((Y=b==null?void 0:b.tier)==null?void 0:Y.amount)??0,g=(b==null?void 0:b.quantity)??0,B=((j=b==null?void 0:b.tier)==null?void 0:j.currency)??"";let h=0;p&&v&&v<p&&(h=Math.round((p-v)/p*100));const D=c.replace("{quantity}",g.toString()).split("{price}")[0],Q=c.replace("{quantity}",g.toString()).split("{price}")[1].replace("{percent}",h>0?h.toString():"0");return t("div",{className:"pdp-price-tiers__tier",children:E("span",{className:"pdp-price-tiers__text",children:[D,t(_e,{amount:v,currency:B,locale:r,className:"pdp-price-tiers__price"}),Q]})},m)})})},dt=r=>{switch(r){case"number":return"number";case"email":return"email";default:return"text"}},st=r=>r.name==="giftcard/giftcard_message"?"textarea":r.name==="giftcard/giftcard_amount"?"picker":"input",ot=(r,i,p,n)=>[{text:p,value:"0",disabled:!1},...r.map(b=>({text:b.toString(),value:b.toString(),disabled:!1})),...i?[{text:n,value:"other",disabled:!1}]:[]],Pe=(r,i,p)=>{const{validationRule:n}=r;if(r.name==="giftcard/giftcard_amount"){if(n.required&&(i==="0"||!i||i.trim()==="")||i==="0")return p.RequiredFieldError;if(i==="other")return""}else if(n.required&&(!i||i.trim()===""))return p.RequiredFieldError;if(!i||i.trim()==="")return"";switch(n.type){case"email":{if(!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(i))return p.EmailError;break}case"number":{const c=Number(i);if(isNaN(c))return p.NumberError;if(n.min!==void 0&&c<n.min)return p.MinError.replace("{min}",n.min.toString());if(n.max!==void 0&&c>n.max)return p.MaxError.replace("{max}",n.max.toString());if(n.values&&!n.values.some(m=>typeof m=="number"?m===c:m===i))return p.InvalidValueError.replace("{values}",n.values.join(", "));break}case"string":{const c=i.length;if(n.minLength!==void 0&&c<n.minLength)return p.MinLengthError.replace("{min_length}",n.minLength.toString());if(n.maxLength!==void 0&&c>n.maxLength)return p.MaxLengthError.replace("{max_length}",n.maxLength.toString());break}}return""},yt=({options:r,currency:i,optionValues:p,onOptionChange:n,onValidationChange:c})=>{const b=M("PDP.Product.GiftCardOptions.ChooseAmount.label").label,m=M("PDP.Product.GiftCardOptions.OtherAmount.label").label,v=M("PDP.Product.GiftCardOptions.RequiredFieldError.label").label,g=M("PDP.Product.GiftCardOptions.NumberError.label").label,B=M("PDP.Product.GiftCardOptions.MinError.label").label,h=M("PDP.Product.GiftCardOptions.MaxError.label").label,D=M("PDP.Product.GiftCardOptions.MinLengthError.label").label,Q=M("PDP.Product.GiftCardOptions.MaxLengthError.label").label,Y=M("PDP.Product.GiftCardOptions.EmailError.label").label,j=M("PDP.Product.GiftCardOptions.InvalidValueError.label").label,[I,J]=Se({}),[X,N]=Se(!1),w=Ve(e=>r.find(a=>a.name===e),[r]),s=Qe(()=>({RequiredFieldError:v,NumberError:g,MinError:B,MaxError:h,MinLengthError:D,MaxLengthError:Q,EmailError:Y,InvalidValueError:j}),[v,g,B,h,D,Q,Y,j]);Le(()=>{const e=r.every(a=>{if(a.name==="giftcard/custom_giftcard_amount"&&!X)return!0;const _=p.find(u=>u.id===a.uid),f=(_==null?void 0:_.value)||"";return Pe(a,f,s)===""});c(e)},[r,p,c,s,X]),Le(()=>{const e=w("giftcard/giftcard_amount"),a=w("giftcard/custom_giftcard_amount"),_=p.find(k=>k.id===(e==null?void 0:e.uid)),f=(_==null?void 0:_.value)||"",u=X,x=e?f==="other":!!a;N(x),u&&!x&&a&&n(a.uid,"")},[p,w,X,n]);const K=(e,a)=>{const _=Pe(e,a,s);J(f=>({...f,[e.uid]:_})),n(e.uid,a)},G=(e,a)=>{const _=Pe(e,a,s);J(f=>({...f,[e.uid]:_}))},T=(e,a)=>{const _=a.target.value;K(e,_)},d=e=>{const a=p.find(S=>S.id===e.uid),_=a==null?void 0:a.value,f=I[e.uid],u=st(e),x=!!w("giftcard/custom_giftcard_amount");let k=e.label;return e.name==="giftcard/custom_giftcard_amount"&&i&&(k=`${e.label} ${i}`),t(je,{label:k,className:A(["pdp-gift-card-options__option-field",u==="textarea"&&"pdp-gift-card-options__option-field--full-width"]),error:f,children:u==="textarea"?t(Ze,{value:_,label:e.label,onChange:S=>K(e,S.target.value),onBlur:S=>G(e,S.target.value),"aria-invalid":!!f}):u==="picker"?t($e,{"aria-label":e.label,label:e.label,handleSelect:S=>T(e,S),options:ot(e.validationRule.values||[],x,b,m),value:_,"aria-invalid":!!f}):t(Ke,{type:dt(e.validationRule.type),value:_,onChange:S=>K(e,S.target.value),onBlur:S=>G(e,S.target.value),"aria-invalid":!!f})},e.uid)};return E("div",{className:"pdp-gift-card-options__grid",children:[E("div",{className:"pdp-gift-card-options__row",children:[w("giftcard/giftcard_amount")&&d(w("giftcard/giftcard_amount")),w("giftcard/custom_giftcard_amount")&&X&&d(w("giftcard/custom_giftcard_amount"))]}),E("div",{className:"pdp-gift-card-options__row",children:[w("giftcard/giftcard_sender_name")&&d(w("giftcard/giftcard_sender_name")),w("giftcard/giftcard_sender_email")&&d(w("giftcard/giftcard_sender_email"))]}),E("div",{className:"pdp-gift-card-options__row",children:[w("giftcard/giftcard_recipient_name")&&d(w("giftcard/giftcard_recipient_name")),w("giftcard/giftcard_recipient_email")&&d(w("giftcard/giftcard_recipient_email"))]}),t("div",{className:"pdp-gift-card-options__row",children:w("giftcard/giftcard_message")&&d(w("giftcard/giftcard_message"))})]})},xt=({label:r,value:i,onLinkChange:p,currency:n,locale:c,className:b,...m})=>{const v=M("PDP.DownloadableOptions.Sample.label").label,g=M("PDP.DownloadableOptions.ViewSample.label"),{links:B,samples:h,purchaseSeparately:D}=i,Q=D?new Set:new Set(B.map(N=>N.uid)),[Y,j]=ee(Q),I=ae((N,w,s)=>{!D||s||(j(K=>{const G=new Set(K);return w?G.add(N):G.delete(N),G}),p==null||p(N,w))},[p,D]),J=N=>{const w=D&&Y.has(N.uid);return E("div",{className:`pdp-downloadable-options__item ${w?"pdp-downloadable-options__item--selected":""} ${D?"":"pdp-downloadable-options__item--disabled"}`,children:[t("button",{type:"button",className:"pdp-downloadable-options__clickable","aria-pressed":w,disabled:!D,onClick:()=>D&&I(N.uid,!w,!D),onKeyDown:s=>{D&&(s.key==="Enter"||s.key===" ")&&(s.preventDefault(),I(N.uid,!w,!D))},children:t("div",{className:"pdp-downloadable-options__content",children:E("div",{className:"pdp-downloadable-options__header",children:[t("span",{className:"pdp-downloadable-options__title",children:N.label}),t(_e,{amount:N.price,currency:n,locale:c,className:"pdp-downloadable-options__price"})]})})}),N.sample_url&&t("a",{href:N.sample_url,className:"pdp-downloadable-options__sample-button",target:"_blank",rel:"noopener noreferrer","aria-label":g.label.replace("{label}",N.label),children:v})]},N.uid)},X=N=>E("div",{className:"pdp-downloadable-options__item pdp-downloadable-options__item--sample",children:[t("button",{type:"button",className:"pdp-downloadable-options__clickable","aria-pressed":!1,disabled:!0,children:t("div",{className:"pdp-downloadable-options__content",children:t("div",{className:"pdp-downloadable-options__header",children:t("span",{className:"pdp-downloadable-options__title",children:N.label})})})}),t("a",{href:N.url,className:"pdp-downloadable-options__sample-button",target:"_blank",rel:"noopener noreferrer","aria-label":`${v} ${N.label}`,children:v})]},N.uid);return t("div",{...m,className:A(["pdp-downloadable-options",b]),"data-slot-key":"product-downloadable-options",children:E("div",{className:"pdp-downloadable-options__field",children:[t("div",{className:"pdp-downloadable-options__field__label",children:r}),E("div",{className:"pdp-downloadable-options__list",children:[B.map(N=>J(N)),h.map(N=>X(N))]})]})})};export{be as C,xt as D,yt as G,Pt as H,rt as O,ft as P,wt as S,ct as Z,vt as a,gt as b,Nt as c};
|
|
4
4
|
//# sourceMappingURL=components.js.map
|