@dropins/storefront-pdp 3.0.0 → 3.0.1-alpha1
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/api.js +1 -1
- package/chunks/DownloadableOptions2.js +4 -0
- package/chunks/DownloadableOptions2.js.map +1 -0
- package/chunks/fetchProductData.js +3 -3
- package/chunks/fetchProductData.js.map +1 -1
- package/chunks/getProductConfigurationValues.js +4 -0
- package/chunks/getProductConfigurationValues.js.map +1 -0
- package/chunks/isProductConfigurationValid.js +1 -1
- package/chunks/isProductConfigurationValid.js.map +1 -1
- package/chunks/useProductData.js +4 -0
- package/chunks/useProductData.js.map +1 -0
- package/components/DownloadableOptions/DownloadableOptions.d.ts +29 -0
- package/components/DownloadableOptions/index.d.ts +18 -0
- package/components/Product/Product.d.ts +1 -0
- package/components/index.d.ts +1 -0
- package/containers/ProductAttributes.js +1 -1
- package/containers/ProductAttributes.js.map +1 -1
- package/containers/ProductDetails.js +1 -1
- package/containers/ProductDetails.js.map +1 -1
- package/containers/ProductDownloadableOptions/ProductDownloadableOptions.d.ts +9 -0
- package/containers/ProductDownloadableOptions/index.d.ts +18 -0
- package/containers/ProductDownloadableOptions.d.ts +3 -0
- package/containers/ProductDownloadableOptions.js +4 -0
- package/containers/ProductDownloadableOptions.js.map +1 -0
- package/containers/ProductGallery.js +1 -1
- package/containers/ProductGallery.js.map +1 -1
- package/containers/ProductGiftCardOptions.js +1 -1
- package/containers/ProductGiftCardOptions.js.map +1 -1
- package/containers/ProductHeader.js +1 -1
- package/containers/ProductHeader.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/ProductPrice.js.map +1 -1
- package/containers/ProductQuantity.js +1 -1
- package/containers/ProductQuantity.js.map +1 -1
- package/containers/index.d.ts +1 -0
- package/data/models/product-model.d.ts +1 -0
- package/i18n/en_US.json.d.ts +8 -11
- package/lib/useProductData.d.ts +31 -0
- package/package.json +1 -1
- package/render.js +3 -2
- package/render.js.map +1 -1
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/*! Copyright 2026 Adobe
|
|
2
2
|
All Rights Reserved. */
|
|
3
|
-
import{jsx as e,jsxs as k,Fragment as Ft}from"@dropins/tools/preact-jsx-runtime.js";import{useState as J,Children as Lt,useEffect as et,useCallback as nt,useMemo as Jt}from"@dropins/tools/preact-compat.js";import{VComponent as u,classes as v,Slot as A,toLanguageTag as Et}from"@dropins/tools/lib.js";import{Incrementer as Zt,Image as Mt,Button as qt,Icon as st,Breadcrumbs as At}from"@dropins/tools/components.js";/* empty css */import{Z as Kt,C as rt,O as $t}from"../chunks/Zoom.js";import"@dropins/tools/preact-hooks.js";/* empty css */import{useText as L}from"@dropins/tools/i18n.js";import{P as Gt}from"../chunks/PriceRange.js";import{S as Wt}from"../chunks/Swatches.js";import"@dropins/tools/preact.js";import{G as Xt}from"../chunks/GiftCardOptions2.js";import{c as Tt,k as Yt,j as Pt,p as ft,l as Rt,t as gt}from"../chunks/fetchProductData.js";import{events as pt}from"@dropins/tools/event-bus.js";import{i as Ct,t as te}from"../chunks/date.js";import"../fragments.js";import"@dropins/tools/fetch-graphql.js";import"../chunks/isProductConfigurationValid.js";const ee=({title:h,breadcrumbs:N,galleryContent:O,infoContent:I,productContent:D,sku:w,outOfStock:U,shortDescription:E,description:p,attributes:ct,images:c,options:a,giftCardOptions:s,price:f,specialPrice:H,className:dt,children:yt,quantity:M,actions:g,carouselConfig:n,zoomType:lt="overlay",closeButton:it=!0,...at})=>{var Z,G,_,K,R,C,tt,$,T;const x=L("PDP.Product.RegularPrice.label").label,ht=L("PDP.Product.SpecialPrice.label").label,ot=L("PDP.Product.OutOfStock.label").label,B=L("PDP.Product.Image.label").label,[t,q]=J(null),b=c!=null&&c.length?c.map((F,y)=>{var W;const j=((W=h==null?void 0:h.props)==null?void 0:W.children)&&(B==null?void 0:B.replace("{product}",h.props.children.toString()).replace("{key}",String(y+1)).replace("{total}",String(c.length)));return lt==="zoom"?e(Kt,{closeButton:it,children:e(u,{node:F,loading:y===0?"eager":"lazy",alt:j},y)}):e(u,{node:F,loading:y===0?"eager":"lazy",alt:j,onClick:()=>q(y)},y)}):e("img",{src:"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7",className:"pdp-product__images__placeholder","aria-hidden":!0}),Q=(Z=n==null?void 0:n.thumbnails)!=null&&Z.length?n.thumbnails.map((F,y)=>{var j;return e(u,{node:F,loading:(n==null?void 0:n.thumbnailsLoadingMode)||"lazy",alt:((j=h==null?void 0:h.props)==null?void 0:j.children)&&(B==null?void 0:B.replace("{product}",h.props.children.toString()).replace("{key}",String(y+1)).replace("{total}",String(c.length)))},y)}):e("img",{src:"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7",className:"pdp-product__images__placeholder","aria-hidden":!0});return k("div",{...at,className:v(["pdp-product",dt]),children:[N&&e(u,{node:N,className:"pdp-product__breadcrumbs"}),k("div",{className:"pdp-product__column-container pdp-product__gallery-column",children:[e("div",{className:"pdp-product__column-body",children:(G=n==null?void 0:n.controls)!=null&&G.desktop?e(rt,{className:"pdp-product__overlay__carousel",arrows:(c==null?void 0:c.length)>1,controls:(c==null?void 0:c.length)>1?n.controls.desktop:"dots",arrowsOnMainImage:n==null?void 0:n.arrowsOnMainImage,loop:(n==null?void 0:n.loopable)&&(c==null?void 0:c.length)>1,peak:((_=n==null?void 0:n.thumbnails)==null?void 0:_.length)>1&&((K=n==null?void 0:n.peak)==null?void 0:K.desktop)||!1,gap:(n==null?void 0:n.gap)||null,width:"100%",height:"100%",defaultIndex:t||0,thumbnails:Q,children:b}):e(ne,{className:"pdp-product__images",gap:"small",children:b})}),O&&e(u,{node:O,className:"pdp-product__gallery-content"})]}),k("div",{className:"pdp-product__column-container pdp-product__content-column",children:[k("div",{className:"pdp-product__column-body",children:[k("div",{className:"pdp-product__header",children:[h&&e(u,{node:h,className:"pdp-product__title"}),w&&e(u,{node:w,className:"pdp-product__sku"})]}),k("div",{className:"pdp-product__prices",children:[H&&e(u,{node:H,className:v(["pdp-product__price-special","pdp-product__price"]),"aria-label":ht,role:"text"}),f&&e(u,{node:f,className:v(["pdp-product__price-regular","pdp-product__price--grey"]),"aria-label":x,role:"text"})]}),(R=n==null?void 0:n.controls)!=null&&R.mobile&&((C=n==null?void 0:n.controls)==null?void 0:C.mobile)==="thumbnailsRow"?e(rt,{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:(n==null?void 0:n.loopable)&&(c==null?void 0:c.length)>1,peak:((tt=n==null?void 0:n.thumbnails)==null?void 0:tt.length)>1&&(($=n==null?void 0:n.peak)==null?void 0:$.mobile)||!1,gap:(n==null?void 0:n.gap)||null,thumbnails:Q,children:b}):e(rt,{className:"pdp-product__images pdp-product__images--carousel",peak:((T=n==null?void 0:n.peak)==null?void 0:T.mobile)&&(c==null?void 0:c.length)>1,gap:(n==null?void 0:n.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:(n==null?void 0:n.loopable)&&(c==null?void 0:c.length)>1,children:b}),k("div",{className:v(["pdp-product__actions",["pdp-product__actions--out-of-stock",U]]),children:[U&&e("div",{className:"pdp-product__out-of-stock__text",children:ot}),a&&e(u,{node:a,className:v(["pdp-product__options"])}),s&&e(u,{node:s,className:v(["pdp-product__gift-card-options"])}),M&&e("div",{className:"pdp-product__quantity",children:e(u,{node:M})}),g&&e(u,{node:g,className:v(["pdp-product__buttons"])})]}),E&&e(u,{node:E,className:v(["pdp-product__short_description"])}),p&&e(u,{node:p,className:v(["pdp-product__description"])}),ct?e("div",{className:"pdp-product__attributes",children:ct}):null]}),I&&e(u,{node:I,className:"pdp-product__info-content"})]}),D&&e(u,{node:D,className:"pdp-product__content"}),t===null?null:e($t,{className:"pdp-product__overlay",onClose:()=>q(null),centered:!0,children:e(rt,{className:"pdp-product__overlay__carousel",arrows:(c==null?void 0:c.length)>1,width:"100%",height:"100%",defaultIndex:t||0,loop:(n==null?void 0:n.loopable)&&(c==null?void 0:c.length)>1,controls:(c==null?void 0:c.length)>1?"dots":null,isZoomed:!0,children:b})})]})},ne=({children:h,gap:N=null,className:O,style:I,...D})=>{const w=Lt.count(h);return e("div",{...D,className:v(["pdp-gallery-grid",O]),style:{"--gap":N?`var(--spacing-${N})`:"0px",...I},children:Lt.map(h,(U,E)=>e("div",{className:"pdp-gallery-grid__item",children:e(u,{node:U,loading:E===0?"eager":"lazy"},U.props.src)},w+E))})},re=({sku:h,hideSku:N,hideQuantity:O,hideShortDescription:I,hideDescription:D,hideAttributes:w,hideURLParams:U,hideSelectedOptionValue:E,slots:p,children:ct,initialData:c,carousel:a,optionsConfig:s,useACDL:f,onAddToCart:H,zoomType:dt,closeButton:yt=!0,disableDropdownPreselection:M,...g})=>{var W,Ot,St,vt,Nt,It,Dt,wt,Vt,kt,Ut;const n=L("PDP.Product.AddToCart.label").label,lt=L("PDP.Product.Incrementer.label").label,it=L("PDP.Product.Details.label").label,at=L("PDP.Swatches.ChooseOption.label").label,[x,ht]=J(Tt.getConfig().defaultLocale||"en-US"),[ot,B]=J(),[t=null,q]=J(c),[b,Q]=J(()=>{const r=Yt(1),d={sku:h,quantity:r};return t!=null&&t.optionUIDs&&(d.optionsUIDs=t.optionUIDs),d}),[Z,G]=J(()=>{var r,d;return!(t!=null&&t.options&&((r=t==null?void 0:t.options)==null?void 0:r.length)>0&&((d=t==null?void 0:t.optionUIDs)==null?void 0:d.length)!==(t==null?void 0:t.options.length))}),_={data:t,values:b,valid:Z};function K(r){return r==null?void 0:r.some(d=>(d==null?void 0:d.typename)==="ProductViewOptionValueProduct")}et(()=>{const r=pt.on("pdp/data",l=>{l&&(q(l),Q(i=>({...i,sku:l.sku,optionsUIDs:l.optionUIDs})))}),d=pt.on("pdp/setValues",l=>{Q(i=>({...i,...l}))});return()=>{d==null||d.off(),r==null||r.off()}},[]),et(()=>{const r=pt.on("locale",d=>{d!==x&&(ht(d),Pt(h,{preselectFirstOption:!M,anchors:s==null?void 0:s.anchorOptions}).then(q))});return()=>{r==null||r.off()}},[M,x,s==null?void 0:s.anchorOptions,h]),et(()=>{f&&c&&Object.keys(c).length>0&&ft(c)},[c]);const R=nt(r=>{Q(d=>({...d,...r}))},[]);et(()=>{pt.emit("pdp/values",b)},[JSON.stringify(b)]);const C=nt(async r=>{var i,o;let d=Object.entries(r).filter(([m,P])=>P.label!==at).map(([m,P])=>r[m].value).filter(m=>m!==void 0);!U&&(t!=null&&t.options)&&!K(t.options)&&Rt({optionsUIDs:d.join(",")}),R({optionsUIDs:d}),G((d==null?void 0:d.length)===((i=t==null?void 0:t.options)==null?void 0:i.length));const l=await Pt(h,{anchors:s==null?void 0:s.anchorOptions,isBundle:t==null?void 0:t.isBundle,optionsUIDs:d,preselectFirstOption:!M});q(l),(o=s==null?void 0:s.anchorOptions)!=null&&o.length&&tt(l,d)},[h]),tt=nt((r,d)=>{var o;const l=(r==null?void 0:r.optionUIDs)??[];d.every(m=>l.includes(m))||(B(r==null?void 0:r.options),R({optionsUIDs:l}),G((l==null?void 0:l.length)===((o=r==null?void 0:r.options)==null?void 0:o.length)))},[h]),$=nt(r=>{Object.keys(r).length!==0&&G(!1)},[]),T=Jt(()=>{var r;return(r=t==null?void 0:t.attributes)==null?void 0:r.map(({label:d,value:l,id:i},o)=>{if(i==="ac_giftcard")return"";const m=Ct(l)?te(l,x):l.toString();return k("li",{children:[d,": ",e("span",{dangerouslySetInnerHTML:{__html:m}})]},o)})},[t==null?void 0:t.attributes,x]),F=!O&&(t!=null&&t.inStock)?e(A,{name:"Quantity",slot:p==null?void 0:p.Quantity,context:{..._},children:e(Zt,{name:"quantity",defaultValue:b.quantity.toString(),value:b.quantity.toString(),min:1,"aria-label":lt,className:"pdp-product__quantity",onValue:r=>{const d=Number(r);R({quantity:d}),!U&&(t!=null&&t.options)&&(K(t.options)||Rt({quantity:d}))}},"quantity")}):void 0,y=()=>{if(t!=null&&t.options)return e(A,{name:"Options",slot:p==null?void 0:p.Options,context:{..._},children:e(Wt,{selectedUIDs:b.optionsUIDs,options:t.options,defaultOptions:b.optionsUIDs,selectionsToUpdate:ot,hideSelectedValue:E,disablePreselections:M,onValues:C,onErrors:$})})},j=()=>{if(t!=null&&t.attributes){const r=t.attributes.filter(d=>d.id==="ac_giftcard");if(r.length>0){const l=r.map((i,o)=>{var m;try{const P=JSON.parse(i.value),mt=b.enteredOptions||[],jt=((m=P.options)==null?void 0:m.map(S=>{const z=mt.find(X=>X.uid===S.uid);return{id:S.uid,value:(z==null?void 0:z.value)||""}}))||[];return e(Xt,{options:P.options||[],optionValues:jt,onOptionChange:(S,z)=>{var xt;const X=b.enteredOptions||[],zt=X.findIndex(V=>V.uid===S);let ut;if(zt!==-1?ut=X.map(V=>V.uid===S?{...V,value:z}:V):ut=[...X,{uid:S,value:z}],R({enteredOptions:ut}),t){const V={...t},Ht=((xt=V.attributes)==null?void 0:xt.map(Y=>{var Bt;if(Y.id==="ac_giftcard")try{const _t=JSON.parse(Y.value),Qt=((Bt=_t.options)==null?void 0:Bt.map(bt=>bt.uid===S?{...bt,value:z}:bt))||[];return{...Y,value:JSON.stringify({..._t,options:Qt})}}catch{return Y}return Y}))||[];V.attributes=Ht,q(V)}},onValidationChange:S=>{S||$({giftCard:"Invalid gift card data"}),G(S)},className:"pdp-product__gift-card-options"},`giftcard-${o}`)}catch(P){return console.warn("Invalid gift card data format:",P),null}}).filter(i=>i!==null);return l.length>0?e("div",{className:"pdp-product__gift-card-options-container",children:l}):void 0}}};return e("div",{...g,children:e(ee,{title:e(A,{name:"Title",slot:p==null?void 0:p.Title,context:{..._},children:t==null?void 0:t.name}),sku:N?void 0:e(A,{name:"SKU",slot:p==null?void 0:p.SKU,context:{..._},children:t==null?void 0:t.sku}),options:y(),giftCardOptions:j(),breadcrumbs:(p==null?void 0:p.Breadcrumbs)&&e(A,{name:"Breadcrumbs",slot:p==null?void 0:p.Breadcrumbs,context:{..._,setSeparator(r){this._registerMethod((...d)=>{const l=r(...d),i=l&&e(st,{source:l});this._setProps(o=>({...o,separator:i,children:[e(At,{separator:i,categories:o.categories})]}))})},appendLink(r){this._registerMethod((...d)=>{const{text:l,...i}=r(...d),o=e("a",{...i,children:l});this._setProps(m=>{const P=[...m.categories||[],o];return{...m,categories:P,children:[e(At,{separator:m.separator,categories:P})]}})})},appendHTMLElement(r){this._registerMethod((...d)=>{const l=r(...d),i=this._htmlElementToVNode(l);this._setProps(o=>{const m=[...o.categories||[],i];return{...o,categories:m,children:[e(At,{separator:o.separator,categories:m})]}})})}}}),quantity:F,actions:e(A,{name:"Actions",slot:p==null?void 0:p.Actions,context:{..._,appendButton(r){this._registerMethod((...d)=>{const l=r(...d);if(!l)return;const{text:i,icon:o,...m}=l,P=e(qt,{type:"button",...m,icon:o&&e(st,{source:o}),children:i});this._setProps(mt=>({children:[...mt.children||[],P]}))})}},children:!(p!=null&&p.Actions)&&e(qt,{size:"medium",type:"submit",icon:e(st,{source:"Cart"}),disabled:!(t!=null&&t.inStock)||!Z,"aria-label":n,onClick:()=>H==null?void 0:H(b),children:n})}),shortDescription:I?void 0:e(A,{name:"ShortDescription",slot:p==null?void 0:p.ShortDescription,context:{..._},children:e("div",{dangerouslySetInnerHTML:{__html:(t==null?void 0:t.shortDescription)??""}})}),description:D?void 0:e(A,{name:"Description",slot:p==null?void 0:p.Description,context:{..._},children:e("div",{dangerouslySetInnerHTML:{__html:(t==null?void 0:t.description)??""}})}),images:((W=t==null?void 0:t.images)==null?void 0:W.map(({label:r,url:d})=>{var l,i;return e(Mt,{title:r,alt:r,src:d,width:((l=a==null?void 0:a.imageParams)==null?void 0:l.width)??960,height:((i=a==null?void 0:a.imageParams)==null?void 0:i.height)??1191,params:(a==null?void 0:a.imageParams)??{width:960}},d)}))??[],specialPrice:(Ot=t==null?void 0:t.prices)!=null&&Ot.visible?e(A,{name:"SpecialPrice",slot:p==null?void 0:p.SpecialPrice,context:{..._},children:e(Gt,{...(St=t.prices)==null?void 0:St.final,locale:Et(x)})}):void 0,price:(vt=t==null?void 0:t.prices)!=null&&vt.visible&&((Nt=t==null?void 0:t.prices)!=null&&Nt.regular)&&((Dt=(It=t==null?void 0:t.prices)==null?void 0:It.final)==null?void 0:Dt.amount)!==((Vt=(wt=t==null?void 0:t.prices)==null?void 0:wt.regular)==null?void 0:Vt.amount)?e(A,{name:"RegularPrice",slot:p==null?void 0:p.RegularPrice,context:{..._},children:e(Gt,{...(kt=t.prices)==null?void 0:kt.regular,locale:Et(x)})}):void 0,zoomType:dt,closeButton:yt,carouselConfig:{...a,thumbnails:a&&Object.keys(a).length?((Ut=t==null?void 0:t.images)==null?void 0:Ut.map(({label:r,url:d})=>{var l,i;return e(Mt,{title:r,alt:r,src:d,width:((l=a==null?void 0:a.thumbnailParams)==null?void 0:l.width)??200,height:((i=a==null?void 0:a.thumbnailParams)==null?void 0:i.height)??248,params:(a==null?void 0:a.thumbnailParams)??{width:200}},d)}))??[]:[]},outOfStock:!(t!=null&&t.inStock),attributes:w?void 0:e(A,{name:"Attributes",slot:p==null?void 0:p.Attributes,context:{..._},children:T!=null&&T.length?k(Ft,{children:[it,e("ul",{children:T})]}):null}),galleryContent:(p==null?void 0:p.GalleryContent)&&e(A,{name:"GalleryContent",slot:p.GalleryContent,context:{..._}}),infoContent:(p==null?void 0:p.InfoContent)&&e(A,{name:"InfoContent",slot:p.InfoContent,context:{..._}}),productContent:(p==null?void 0:p.Content)&&e(A,{name:"Content",slot:p.Content,context:{..._}})})})};re.getInitialData=async function({sku:h,disableDropdownPreselection:N=!1,optionsConfig:O}){var D,w;const I=(w=(D=Tt.getConfig().models)==null?void 0:D.ProductDetails)==null?void 0:w.initialData;return I?gt(I):Pt(h,{preselectFirstOption:!N,anchors:O==null?void 0:O.anchorOptions})};export{re as ProductDetails,re as default};
|
|
3
|
+
import{jsx as e,jsxs as B,Fragment as Jt}from"@dropins/tools/preact-jsx-runtime.js";import{useState as J,Children as qt,useEffect as dt,useCallback as ct,useMemo as Zt}from"@dropins/tools/preact-compat.js";import{VComponent as m,classes as N,Slot as P,toLanguageTag as Gt}from"@dropins/tools/lib.js";import{Incrementer as $t,Image as Rt,Button as Tt,Icon as yt,Breadcrumbs as Ot}from"@dropins/tools/components.js";/* empty css */import{Z as Kt,C as lt,O as Wt}from"../chunks/Zoom.js";import"@dropins/tools/preact-hooks.js";/* empty css *//* empty css */import{useText as G}from"@dropins/tools/i18n.js";import{P as jt}from"../chunks/PriceRange.js";import{S as Xt}from"../chunks/Swatches.js";import"@dropins/tools/preact.js";import{G as Yt}from"../chunks/GiftCardOptions2.js";import{D as ft}from"../chunks/DownloadableOptions2.js";import{c as Ht,k as gt,j as Nt,p as Ct,l as zt,t as te}from"../chunks/fetchProductData.js";import{events as it}from"@dropins/tools/event-bus.js";import{i as ee,t as ne}from"../chunks/date.js";import"../fragments.js";import"@dropins/tools/fetch-graphql.js";import"../chunks/getProductConfigurationValues.js";import"../chunks/isProductConfigurationValid.js";const re=({title:u,breadcrumbs:I,galleryContent:S,infoContent:w,productContent:V,sku:U,outOfStock:E,shortDescription:R,description:p,attributes:ot,images:c,options:o,giftCardOptions:s,downloadableOptions:C,price:Q,specialPrice:tt,className:at,children:Z,quantity:et,actions:$,carouselConfig:n,zoomType:ht="overlay",closeButton:ut=!0,...L})=>{var T,_,W,q,nt,rt,X,j,pt;const mt=G("PDP.Product.RegularPrice.label").label,_t=G("PDP.Product.SpecialPrice.label").label,st=G("PDP.Product.OutOfStock.label").label,t=G("PDP.Product.Image.label").label,[M,A]=J(null),k=c!=null&&c.length?c.map((F,O)=>{var Y;const z=((Y=u==null?void 0:u.props)==null?void 0:Y.children)&&(t==null?void 0:t.replace("{product}",u.props.children.toString()).replace("{key}",String(O+1)).replace("{total}",String(c.length)));return ht==="zoom"?e(Kt,{closeButton:ut,children:e(m,{node:F,loading:O===0?"eager":"lazy",alt:z},O)}):e(m,{node:F,loading:O===0?"eager":"lazy",alt:z,onClick:()=>A(O)},O)}):e("img",{src:"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7",className:"pdp-product__images__placeholder","aria-hidden":!0}),K=(T=n==null?void 0:n.thumbnails)!=null&&T.length?n.thumbnails.map((F,O)=>{var z;return e(m,{node:F,loading:(n==null?void 0:n.thumbnailsLoadingMode)||"lazy",alt:((z=u==null?void 0:u.props)==null?void 0:z.children)&&(t==null?void 0:t.replace("{product}",u.props.children.toString()).replace("{key}",String(O+1)).replace("{total}",String(c.length)))},O)}):e("img",{src:"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7",className:"pdp-product__images__placeholder","aria-hidden":!0});return B("div",{...L,className:N(["pdp-product",at]),children:[I&&e(m,{node:I,className:"pdp-product__breadcrumbs"}),B("div",{className:"pdp-product__column-container pdp-product__gallery-column",children:[e("div",{className:"pdp-product__column-body",children:(_=n==null?void 0:n.controls)!=null&&_.desktop?e(lt,{className:"pdp-product__overlay__carousel",arrows:(c==null?void 0:c.length)>1,controls:(c==null?void 0:c.length)>1?n.controls.desktop:"dots",arrowsOnMainImage:n==null?void 0:n.arrowsOnMainImage,loop:(n==null?void 0:n.loopable)&&(c==null?void 0:c.length)>1,peak:((W=n==null?void 0:n.thumbnails)==null?void 0:W.length)>1&&((q=n==null?void 0:n.peak)==null?void 0:q.desktop)||!1,gap:(n==null?void 0:n.gap)||null,width:"100%",height:"100%",defaultIndex:M||0,thumbnails:K,children:k}):e(pe,{className:"pdp-product__images",gap:"small",children:k})}),S&&e(m,{node:S,className:"pdp-product__gallery-content"})]}),B("div",{className:"pdp-product__column-container pdp-product__content-column",children:[B("div",{className:"pdp-product__column-body",children:[B("div",{className:"pdp-product__header",children:[u&&e(m,{node:u,className:"pdp-product__title"}),U&&e(m,{node:U,className:"pdp-product__sku"})]}),B("div",{className:"pdp-product__prices",children:[tt&&e(m,{node:tt,className:N(["pdp-product__price-special","pdp-product__price"]),"aria-label":_t,role:"text"}),Q&&e(m,{node:Q,className:N(["pdp-product__price-regular","pdp-product__price--grey"]),"aria-label":mt,role:"text"})]}),(nt=n==null?void 0:n.controls)!=null&&nt.mobile&&((rt=n==null?void 0:n.controls)==null?void 0:rt.mobile)==="thumbnailsRow"?e(lt,{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:(n==null?void 0:n.loopable)&&(c==null?void 0:c.length)>1,peak:((X=n==null?void 0:n.thumbnails)==null?void 0:X.length)>1&&((j=n==null?void 0:n.peak)==null?void 0:j.mobile)||!1,gap:(n==null?void 0:n.gap)||null,thumbnails:K,children:k}):e(lt,{className:"pdp-product__images pdp-product__images--carousel",peak:((pt=n==null?void 0:n.peak)==null?void 0:pt.mobile)&&(c==null?void 0:c.length)>1,gap:(n==null?void 0:n.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:(n==null?void 0:n.loopable)&&(c==null?void 0:c.length)>1,children:k}),B("div",{className:N(["pdp-product__actions",["pdp-product__actions--out-of-stock",E]]),children:[E&&e("div",{className:"pdp-product__out-of-stock__text",children:st}),o&&e(m,{node:o,className:N(["pdp-product__options"])}),s&&e(m,{node:s,className:N(["pdp-product__gift-card-options"])}),C&&e(m,{node:C,className:N(["pdp-product__downloadable-options"])}),et&&e("div",{className:"pdp-product__quantity",children:e(m,{node:et})}),$&&e(m,{node:$,className:N(["pdp-product__buttons"])})]}),R&&e(m,{node:R,className:N(["pdp-product__short_description"])}),p&&e(m,{node:p,className:N(["pdp-product__description"])}),ot?e("div",{className:"pdp-product__attributes",children:ot}):null]}),w&&e(m,{node:w,className:"pdp-product__info-content"})]}),V&&e(m,{node:V,className:"pdp-product__content"}),M===null?null:e(Wt,{className:"pdp-product__overlay",onClose:()=>A(null),centered:!0,children:e(lt,{className:"pdp-product__overlay__carousel",arrows:(c==null?void 0:c.length)>1,width:"100%",height:"100%",defaultIndex:M||0,loop:(n==null?void 0:n.loopable)&&(c==null?void 0:c.length)>1,controls:(c==null?void 0:c.length)>1?"dots":null,isZoomed:!0,children:k})})]})},pe=({children:u,gap:I=null,className:S,style:w,...V})=>{const U=qt.count(u);return e("div",{...V,className:N(["pdp-gallery-grid",S]),style:{"--gap":I?`var(--spacing-${I})`:"0px",...w},children:qt.map(u,(E,R)=>e("div",{className:"pdp-gallery-grid__item",children:e(m,{node:E,loading:R===0?"eager":"lazy"},E.props.src)},U+R))})},de=({sku:u,hideSku:I,hideQuantity:S,hideShortDescription:w,hideDescription:V,hideAttributes:U,hideURLParams:E,hideSelectedOptionValue:R,slots:p,children:ot,initialData:c,carousel:o,optionsConfig:s,useACDL:C,onAddToCart:Q,zoomType:tt,closeButton:at=!0,disableDropdownPreselection:Z,...et})=>{var Y,St,Dt,It,wt,Vt,Ut,kt,xt,Bt,Et;const $=G("PDP.Product.AddToCart.label").label,n=G("PDP.Product.Incrementer.label").label,ht=G("PDP.Product.Details.label").label,ut=G("PDP.Swatches.ChooseOption.label").label,[L,mt]=J(Ht.getConfig().defaultLocale||"en-US"),[_t,st]=J(),[t=null,M]=J(c),[A,k]=J(()=>{const r=gt(1),d={sku:u,quantity:r};return t!=null&&t.optionUIDs&&(d.optionsUIDs=t.optionUIDs),d}),[K,T]=J(()=>{var r,d;return!(t!=null&&t.options&&((r=t==null?void 0:t.options)==null?void 0:r.length)>0&&((d=t==null?void 0:t.optionUIDs)==null?void 0:d.length)!==(t==null?void 0:t.options.length))}),_={data:t,values:A,valid:K};function W(r){return r==null?void 0:r.some(d=>(d==null?void 0:d.typename)==="ProductViewOptionValueProduct")}dt(()=>{const r=it.on("pdp/data",l=>{l&&(M(l),k(i=>({...i,sku:l.sku,optionsUIDs:l.optionUIDs})))}),d=it.on("pdp/setValues",l=>{k(i=>({...i,...l}))});return()=>{d==null||d.off(),r==null||r.off()}},[]),dt(()=>{const r=it.on("locale",d=>{d!==L&&(mt(d),Nt(u,{preselectFirstOption:!Z,anchors:s==null?void 0:s.anchorOptions}).then(M))});return()=>{r==null||r.off()}},[Z,L,s==null?void 0:s.anchorOptions,u]),dt(()=>{C&&c&&Object.keys(c).length>0&&Ct(c)},[c]);const q=ct(r=>{k(d=>({...d,...r}))},[]);dt(()=>{it.emit("pdp/values",A)},[JSON.stringify(A)]);const nt=ct(async r=>{var i,a;let d=Object.entries(r).filter(([h,b])=>b.label!==ut).map(([h,b])=>r[h].value).filter(h=>h!==void 0);!E&&(t!=null&&t.options)&&!W(t.options)&&zt({optionsUIDs:d.join(",")}),q({optionsUIDs:d}),T((d==null?void 0:d.length)===((i=t==null?void 0:t.options)==null?void 0:i.length));const l=await Nt(u,{anchors:s==null?void 0:s.anchorOptions,isBundle:t==null?void 0:t.isBundle,optionsUIDs:d,preselectFirstOption:!Z});M(l),(a=s==null?void 0:s.anchorOptions)!=null&&a.length&&rt(l,d)},[u]),rt=ct((r,d)=>{var a;const l=(r==null?void 0:r.optionUIDs)??[];d.every(h=>l.includes(h))||(st(r==null?void 0:r.options),q({optionsUIDs:l}),T((l==null?void 0:l.length)===((a=r==null?void 0:r.options)==null?void 0:a.length)))},[u]),X=ct(r=>{Object.keys(r).length!==0&&T(!1)},[]),j=Zt(()=>{var r;return(r=t==null?void 0:t.attributes)==null?void 0:r.map(({label:d,value:l,id:i},a)=>{if(i==="ac_giftcard")return"";const h=ee(l)?ne(l,L):l.toString();return B("li",{children:[d,": ",e("span",{dangerouslySetInnerHTML:{__html:h}})]},a)})},[t==null?void 0:t.attributes,L]),pt=!S&&(t!=null&&t.inStock)?e(P,{name:"Quantity",slot:p==null?void 0:p.Quantity,context:{..._},children:e($t,{name:"quantity",defaultValue:A.quantity.toString(),value:A.quantity.toString(),min:1,"aria-label":n,className:"pdp-product__quantity",onValue:r=>{const d=Number(r);q({quantity:d}),!E&&(t!=null&&t.options)&&(W(t.options)||zt({quantity:d}))}},"quantity")}):void 0,F=()=>{if(t!=null&&t.options)return e(P,{name:"Options",slot:p==null?void 0:p.Options,context:{..._},children:e(Xt,{selectedUIDs:A.optionsUIDs,options:t.options,defaultOptions:A.optionsUIDs,selectionsToUpdate:_t,hideSelectedValue:R,disablePreselections:Z,onValues:nt,onErrors:X})})},O=()=>{if(t!=null&&t.attributes){const r=t.attributes.filter(d=>d.id==="ac_giftcard");if(r.length>0){const l=r.map((i,a)=>{var h;try{const b=JSON.parse(i.value),H=A.enteredOptions||[],f=((h=b.options)==null?void 0:h.map(v=>{const y=H.find(D=>D.uid===v.uid);return{id:v.uid,value:(y==null?void 0:y.value)||""}}))||[];return e(Yt,{options:b.options||[],optionValues:f,onOptionChange:(v,y)=>{var Lt;const D=A.enteredOptions||[],bt=D.findIndex(x=>x.uid===v);let At;if(bt!==-1?At=D.map(x=>x.uid===v?{...x,value:y}:x):At=[...D,{uid:v,value:y}],q({enteredOptions:At}),t){const x={...t},Qt=((Lt=x.attributes)==null?void 0:Lt.map(g=>{var Mt;if(g.id==="ac_giftcard")try{const Pt=JSON.parse(g.value),Ft=((Mt=Pt.options)==null?void 0:Mt.map(vt=>vt.uid===v?{...vt,value:y}:vt))||[];return{...g,value:JSON.stringify({...Pt,options:Ft})}}catch{return g}return g}))||[];x.attributes=Qt,M(x)}},onValidationChange:v=>{v||X({giftCard:"Invalid gift card data"}),T(v)},className:"pdp-product__gift-card-options"},`giftcard-${a}`)}catch(b){return console.warn("Invalid gift card data format:",b),null}}).filter(i=>i!==null);return l.length>0?e("div",{className:"pdp-product__gift-card-options-container",children:l}):void 0}}},z=()=>{if(t!=null&&t.attributes){const r=t.attributes.filter(d=>{var l;return d.id==="ac_downloadable"&&((l=d.roles)==null?void 0:l.includes("visible_in_pdp"))});if(r.length>0){const l=r.map((i,a)=>{var h,b;try{const H=typeof i.value=="string"?JSON.parse(i.value):i.value;return e(ft,{label:i.label,value:H,onLinkChange:(f,v)=>{const y=A.optionsUIDs||[];let D;v?y.includes(f)?D=y:D=[...y,f]:D=y.filter(bt=>bt!==f),q({optionsUIDs:D})},currency:(b=(h=t.prices)==null?void 0:h.final)==null?void 0:b.currency,className:"pdp-product__downloadable-options"},`downloadable-${a}`)}catch(H){return console.warn("Invalid downloadable data format:",H),null}}).filter(i=>i!==null);return l.length>0?e("div",{className:"pdp-product__downloadable-options-container",children:l}):void 0}}};return e("div",{...et,children:e(re,{title:e(P,{name:"Title",slot:p==null?void 0:p.Title,context:{..._},children:t==null?void 0:t.name}),sku:I?void 0:e(P,{name:"SKU",slot:p==null?void 0:p.SKU,context:{..._},children:t==null?void 0:t.sku}),options:F(),giftCardOptions:O(),downloadableOptions:z(),breadcrumbs:(p==null?void 0:p.Breadcrumbs)&&e(P,{name:"Breadcrumbs",slot:p==null?void 0:p.Breadcrumbs,context:{..._,setSeparator(r){this._registerMethod((...d)=>{const l=r(...d),i=l&&e(yt,{source:l});this._setProps(a=>({...a,separator:i,children:[e(Ot,{separator:i,categories:a.categories})]}))})},appendLink(r){this._registerMethod((...d)=>{const{text:l,...i}=r(...d),a=e("a",{...i,children:l});this._setProps(h=>{const b=[...h.categories||[],a];return{...h,categories:b,children:[e(Ot,{separator:h.separator,categories:b})]}})})},appendHTMLElement(r){this._registerMethod((...d)=>{const l=r(...d),i=this._htmlElementToVNode(l);this._setProps(a=>{const h=[...a.categories||[],i];return{...a,categories:h,children:[e(Ot,{separator:a.separator,categories:h})]}})})}}}),quantity:pt,actions:e(P,{name:"Actions",slot:p==null?void 0:p.Actions,context:{..._,appendButton(r){this._registerMethod((...d)=>{const l=r(...d);if(!l)return;const{text:i,icon:a,...h}=l,b=e(Tt,{type:"button",...h,icon:a&&e(yt,{source:a}),children:i});this._setProps(H=>({children:[...H.children||[],b]}))})}},children:!(p!=null&&p.Actions)&&e(Tt,{size:"medium",type:"submit",icon:e(yt,{source:"Cart"}),disabled:!(t!=null&&t.inStock)||!K,"aria-label":$,onClick:()=>Q==null?void 0:Q(A),children:$})}),shortDescription:w?void 0:e(P,{name:"ShortDescription",slot:p==null?void 0:p.ShortDescription,context:{..._},children:e("div",{dangerouslySetInnerHTML:{__html:(t==null?void 0:t.shortDescription)??""}})}),description:V?void 0:e(P,{name:"Description",slot:p==null?void 0:p.Description,context:{..._},children:e("div",{dangerouslySetInnerHTML:{__html:(t==null?void 0:t.description)??""}})}),images:((Y=t==null?void 0:t.images)==null?void 0:Y.map(({label:r,url:d})=>{var l,i;return e(Rt,{title:r,alt:r,src:d,width:((l=o==null?void 0:o.imageParams)==null?void 0:l.width)??960,height:((i=o==null?void 0:o.imageParams)==null?void 0:i.height)??1191,params:(o==null?void 0:o.imageParams)??{width:960}},d)}))??[],specialPrice:(St=t==null?void 0:t.prices)!=null&&St.visible?e(P,{name:"SpecialPrice",slot:p==null?void 0:p.SpecialPrice,context:{..._},children:e(jt,{...(Dt=t.prices)==null?void 0:Dt.final,locale:Gt(L)})}):void 0,price:(It=t==null?void 0:t.prices)!=null&&It.visible&&((wt=t==null?void 0:t.prices)!=null&&wt.regular)&&((Ut=(Vt=t==null?void 0:t.prices)==null?void 0:Vt.final)==null?void 0:Ut.amount)!==((xt=(kt=t==null?void 0:t.prices)==null?void 0:kt.regular)==null?void 0:xt.amount)?e(P,{name:"RegularPrice",slot:p==null?void 0:p.RegularPrice,context:{..._},children:e(jt,{...(Bt=t.prices)==null?void 0:Bt.regular,locale:Gt(L)})}):void 0,zoomType:tt,closeButton:at,carouselConfig:{...o,thumbnails:o&&Object.keys(o).length?((Et=t==null?void 0:t.images)==null?void 0:Et.map(({label:r,url:d})=>{var l,i;return e(Rt,{title:r,alt:r,src:d,width:((l=o==null?void 0:o.thumbnailParams)==null?void 0:l.width)??200,height:((i=o==null?void 0:o.thumbnailParams)==null?void 0:i.height)??248,params:(o==null?void 0:o.thumbnailParams)??{width:200}},d)}))??[]:[]},outOfStock:!(t!=null&&t.inStock),attributes:U?void 0:e(P,{name:"Attributes",slot:p==null?void 0:p.Attributes,context:{..._},children:j!=null&&j.length?B(Jt,{children:[ht,e("ul",{children:j})]}):null}),galleryContent:(p==null?void 0:p.GalleryContent)&&e(P,{name:"GalleryContent",slot:p.GalleryContent,context:{..._}}),infoContent:(p==null?void 0:p.InfoContent)&&e(P,{name:"InfoContent",slot:p.InfoContent,context:{..._}}),productContent:(p==null?void 0:p.Content)&&e(P,{name:"Content",slot:p.Content,context:{..._}})})})};de.getInitialData=async function({sku:u,disableDropdownPreselection:I=!1,optionsConfig:S}){var V,U;const w=(U=(V=Ht.getConfig().models)==null?void 0:V.ProductDetails)==null?void 0:U.initialData;return w?te(w):Nt(u,{preselectFirstOption:!I,anchors:S==null?void 0:S.anchorOptions})};export{de as ProductDetails,de as default};
|
|
4
4
|
//# sourceMappingURL=ProductDetails.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ProductDetails.js","sources":["/@dropins/storefront-pdp/src/components/Product/Product.tsx","/@dropins/storefront-pdp/src/components/GalleryGrid/GalleryGrid.tsx","/@dropins/storefront-pdp/src/containers/ProductDetails/ProductDetails.tsx"],"sourcesContent":["/**\n * ADOBE CONFIDENTIAL\n * __________________\n * Copyright 2023 Adobe\n * All Rights Reserved.\n * __________________\n * NOTICE: All information contained herein is, and remains\n * the property of Adobe and its suppliers, if any. The intellectual\n * and technical concepts contained herein are proprietary to Adobe\n * and its suppliers and are protected by all applicable intellectual\n * property laws, including trade secret and copyright laws.\n * Dissemination of this information or reproduction of this material\n * is strictly forbidden unless prior written permission is obtained\n * from Adobe.\n */\n\nimport { FunctionComponent, VNode } from 'preact';\nimport { HTMLAttributes, useState } from 'preact/compat';\nimport { classes, VComponent } from '@adobe-commerce/elsie/lib';\nimport { useText } from '@adobe-commerce/elsie/i18n';\n\nimport { Carousel, GalleryGrid, Overlay, Zoom } from '@/pdp/components';\nimport '@/pdp/components/Product/Product.css';\n\nimport { CarouselConfig } from '@/pdp/containers';\n\ninterface ProductCarouselConfig extends CarouselConfig {\n thumbnails: VNode[];\n}\n\nexport interface ProductProps\n extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {\n title?: VNode;\n breadcrumbs?: VNode;\n galleryContent?: VNode;\n infoContent?: VNode;\n productContent?: VNode;\n shortDescription?: VNode;\n description?: VNode;\n attributes?: VNode;\n images: VNode[];\n options?: VNode;\n giftCardOptions?: VNode;\n sku?: VNode;\n price?: VNode;\n specialPrice?: VNode;\n outOfStock: boolean;\n actions?: VNode;\n quantity?: VNode;\n carouselConfig?: ProductCarouselConfig;\n zoomType?: 'zoom' | 'overlay';\n closeButton?: boolean;\n}\n\nexport const Product: FunctionComponent<ProductProps> = ({\n title,\n breadcrumbs,\n galleryContent,\n infoContent,\n productContent,\n sku,\n outOfStock,\n shortDescription,\n description,\n attributes,\n images,\n options,\n giftCardOptions,\n price,\n specialPrice,\n className,\n children,\n quantity,\n actions,\n carouselConfig,\n zoomType = 'overlay',\n closeButton = true,\n ...props\n}) => {\n // i18n\n const RegularPriceLabel = useText('PDP.Product.RegularPrice.label').label;\n const SpecialPriceLabel = useText('PDP.Product.SpecialPrice.label').label;\n const OutOfStockLabel = useText('PDP.Product.OutOfStock.label').label;\n const ImagesLabel = useText('PDP.Product.Image.label').label;\n\n const [zoom, setZoom] = useState<number | null>(null);\n\n const galleryImages = images?.length ? (\n images.map((image, key) => {\n const alt =\n title?.props?.children &&\n ImagesLabel?.replace('{product}', title.props.children.toString())\n .replace('{key}', String(key + 1))\n .replace('{total}', String(images.length));\n return zoomType === 'zoom' ? (\n <Zoom closeButton={closeButton}>\n <VComponent\n key={key}\n node={image}\n loading={key === 0 ? 'eager' : 'lazy'}\n alt={alt}\n />\n </Zoom>\n ) : (\n <VComponent\n key={key}\n node={image}\n loading={key === 0 ? 'eager' : 'lazy'}\n alt={alt}\n onClick={() => setZoom(key)}\n />\n );\n })\n ) : (\n <img\n src=\"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\"\n className=\"pdp-product__images__placeholder\"\n aria-hidden\n />\n );\n\n const localThumbnailsImages = carouselConfig?.thumbnails?.length ? (\n carouselConfig.thumbnails.map((image, key) => (\n <VComponent\n key={key}\n node={image}\n loading={carouselConfig?.thumbnailsLoadingMode || 'lazy'}\n alt={\n title?.props?.children &&\n ImagesLabel?.replace('{product}', title.props.children.toString())\n .replace('{key}', String(key + 1))\n .replace('{total}', String(images.length))\n }\n />\n ))\n ) : (\n <img\n src=\"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\"\n className=\"pdp-product__images__placeholder\"\n aria-hidden\n />\n );\n\n return (\n <div {...props} className={classes(['pdp-product', className])}>\n {breadcrumbs && (\n <VComponent node={breadcrumbs} className=\"pdp-product__breadcrumbs\" />\n )}\n <div className=\"pdp-product__column-container pdp-product__gallery-column\">\n <div className=\"pdp-product__column-body\">\n {carouselConfig?.controls?.desktop ? (\n <Carousel\n className=\"pdp-product__overlay__carousel\"\n arrows={images?.length > 1}\n controls={\n images?.length > 1 ? carouselConfig.controls.desktop : 'dots'\n }\n arrowsOnMainImage={carouselConfig?.arrowsOnMainImage}\n loop={carouselConfig?.loopable && images?.length > 1}\n peak={\n (carouselConfig?.thumbnails?.length > 1 &&\n carouselConfig?.peak?.desktop) ||\n false\n }\n gap={carouselConfig?.gap || null}\n width=\"100%\"\n height=\"100%\"\n defaultIndex={zoom || 0}\n thumbnails={localThumbnailsImages}\n >\n {galleryImages}\n </Carousel>\n ) : (\n <GalleryGrid className=\"pdp-product__images\" gap=\"small\">\n {galleryImages}\n </GalleryGrid>\n )}\n </div>\n {galleryContent && (\n <VComponent\n node={galleryContent}\n className=\"pdp-product__gallery-content\"\n />\n )}\n </div>\n\n <div className=\"pdp-product__column-container pdp-product__content-column\">\n <div className=\"pdp-product__column-body\">\n <div className=\"pdp-product__header\">\n {title && (\n <VComponent node={title} className=\"pdp-product__title\" />\n )}\n\n {sku && <VComponent node={sku} className=\"pdp-product__sku\" />}\n </div>\n\n <div className=\"pdp-product__prices\">\n {specialPrice && (\n <VComponent\n node={specialPrice}\n className={classes([\n 'pdp-product__price-special',\n 'pdp-product__price',\n ])}\n aria-label={SpecialPriceLabel}\n role=\"text\"\n />\n )}\n {price && (\n <VComponent\n node={price}\n className={classes([\n 'pdp-product__price-regular',\n 'pdp-product__price--grey',\n ])}\n aria-label={RegularPriceLabel}\n role=\"text\"\n />\n )}\n </div>\n\n {/* Small Screen Gallery */}\n {carouselConfig?.controls?.mobile &&\n carouselConfig?.controls?.mobile === 'thumbnailsRow' ? (\n <Carousel\n className=\"pdp-product__images pdp-product__images--carousel pdp-product__images--carousel--thumbnails\"\n width=\"100%\"\n height=\"auto\"\n arrows={images?.length > 1}\n controls={images?.length > 1 ? 'thumbnailsRow' : null}\n loop={carouselConfig?.loopable && images?.length > 1}\n peak={\n (carouselConfig?.thumbnails?.length > 1 &&\n carouselConfig?.peak?.mobile) ||\n false\n }\n gap={carouselConfig?.gap || null}\n thumbnails={localThumbnailsImages}\n >\n {galleryImages}\n </Carousel>\n ) : (\n <Carousel\n className=\"pdp-product__images pdp-product__images--carousel\"\n peak={carouselConfig?.peak?.mobile && images?.length > 1}\n gap={carouselConfig?.gap || null}\n width=\"100%\"\n height=\"auto\"\n arrows={images?.length > 1}\n controls={images?.length > 1 ? 'dots' : null}\n loop={carouselConfig?.loopable && images?.length > 1}\n >\n {galleryImages}\n </Carousel>\n )}\n\n <div\n className={classes([\n 'pdp-product__actions',\n [`pdp-product__actions--out-of-stock`, outOfStock],\n ])}\n >\n {outOfStock && (\n <div className=\"pdp-product__out-of-stock__text\">\n {OutOfStockLabel}\n </div>\n )}\n\n {options && (\n <VComponent\n node={options}\n className={classes(['pdp-product__options'])}\n />\n )}\n\n {giftCardOptions && (\n <VComponent\n node={giftCardOptions}\n className={classes(['pdp-product__gift-card-options'])}\n />\n )}\n\n {quantity && (\n <div className=\"pdp-product__quantity\">\n <VComponent node={quantity} />\n </div>\n )}\n\n {actions && (\n <VComponent\n node={actions}\n className={classes(['pdp-product__buttons'])}\n />\n )}\n </div>\n\n {shortDescription && (\n <VComponent\n node={shortDescription}\n className={classes(['pdp-product__short_description'])}\n />\n )}\n\n {description && (\n <VComponent\n node={description}\n className={classes(['pdp-product__description'])}\n />\n )}\n\n {attributes ? (\n <div className=\"pdp-product__attributes\">{attributes}</div>\n ) : null}\n </div>\n {infoContent && (\n <VComponent\n node={infoContent}\n className=\"pdp-product__info-content\"\n />\n )}\n </div>\n\n {productContent && (\n <VComponent node={productContent} className=\"pdp-product__content\" />\n )}\n\n {/* Zoom Overlay */}\n {zoom === null ? null : (\n <Overlay\n className=\"pdp-product__overlay\"\n onClose={() => setZoom(null)}\n centered\n >\n <Carousel\n className=\"pdp-product__overlay__carousel\"\n arrows={images?.length > 1}\n width=\"100%\"\n height=\"100%\"\n defaultIndex={zoom || 0}\n loop={carouselConfig?.loopable && images?.length > 1}\n controls={images?.length > 1 ? 'dots' : null}\n isZoomed\n >\n {galleryImages}\n </Carousel>\n </Overlay>\n )}\n </div>\n );\n};\n","/**\n * ADOBE CONFIDENTIAL\n * __________________\n * Copyright 2023 Adobe\n * All Rights Reserved.\n * __________________\n * NOTICE: All information contained herein is, and remains\n * the property of Adobe and its suppliers, if any. The intellectual\n * and technical concepts contained herein are proprietary to Adobe\n * and its suppliers and are protected by all applicable intellectual\n * property laws, including trade secret and copyright laws.\n * Dissemination of this information or reproduction of this material\n * is strictly forbidden unless prior written permission is obtained\n * from Adobe.\n */\n\nimport { FunctionComponent, VNode } from 'preact';\nimport { HTMLAttributes, Children } from 'preact/compat';\nimport { classes, VComponent } from '@adobe-commerce/elsie/lib';\nimport '@/pdp/components/GalleryGrid/GalleryGrid.css';\n\nexport interface GalleryGridProps extends HTMLAttributes<HTMLDivElement> {\n children: VNode[] | VNode;\n gap?: 'small' | 'medium' | 'large' | null;\n style?: Record<string, string | number>;\n}\n\nexport const GalleryGrid: FunctionComponent<GalleryGridProps> = ({\n children,\n gap = null,\n className,\n style,\n ...props\n}) => {\n const count = Children.count(children);\n\n return (\n <div\n {...props}\n className={classes(['pdp-gallery-grid', className])}\n style={{\n '--gap': gap ? `var(--spacing-${gap})` : '0px',\n ...style,\n }}\n >\n {Children.map(\n children,\n (child: VNode<HTMLAttributes<HTMLElement>>, key) => (\n <div key={count + key} className=\"pdp-gallery-grid__item\">\n <VComponent\n key={child.props.src}\n node={child}\n loading={key === 0 ? 'eager' : 'lazy'}\n />\n </div>\n )\n )}\n </div>\n );\n};\n","/**\n * ADOBE CONFIDENTIAL\n * __________________\n * Copyright 2023 Adobe\n * All Rights Reserved.\n * __________________\n * NOTICE: All information contained herein is, and remains\n * the property of Adobe and its suppliers, if any. The intellectual\n * and technical concepts contained herein are proprietary to Adobe\n * and its suppliers and are protected by all applicable intellectual\n * property laws, including trade secret and copyright laws.\n * Dissemination of this information or reproduction of this material\n * is strictly forbidden unless prior written permission is obtained\n * from Adobe.\n */\n\nimport {\n HTMLAttributes,\n useEffect,\n useState,\n useCallback,\n useMemo,\n} from 'preact/compat';\n\nimport {\n Container,\n toLanguageTag,\n SlotProps,\n SlotMethod,\n Slot,\n ResolveImageUrlOptions,\n} from '@adobe-commerce/elsie/lib';\n\nimport {\n Button,\n Icon,\n ButtonProps,\n Image,\n Incrementer,\n Breadcrumbs,\n} from '@adobe-commerce/elsie/components';\nimport {\n Product,\n Swatches,\n PriceRange,\n Option,\n GiftCardOptions,\n} from '@/pdp/components';\nimport { config, fetchProductData } from '@/pdp/api';\nimport { events } from '@adobe-commerce/event-bus';\nimport { Lang, useText } from '@adobe-commerce/elsie/i18n';\nimport { isDateValid, toDateString } from '@/pdp/lib/date';\nimport {\n setUrlParams,\n getValidatedQuantityFromUrl,\n} from '@/pdp/lib/url-params';\nimport { publishProductPageViewEvent } from '@/pdp/lib/acdl';\nimport { ProductModel, Option as ProductOption } from '@/pdp/data/models';\nimport { transformProductData } from '@/pdp/data/transforms/product-transform';\n\ntype IconType = keyof typeof import('@adobe-commerce/elsie/icons');\n\n/** @deprecated This type is part of the deprecated ProductDetails component. */\nexport type Values = {\n sku: string;\n quantity: number;\n optionsUIDs?: string[];\n enteredOptions?: Array<{ uid: string; value: string }>;\n};\n\n/** @deprecated This type is part of the deprecated ProductDetails component. */\ntype DefaultSlotContext = {\n data: ProductModel | null;\n values: Values;\n valid: boolean;\n};\n\n/** @deprecated This type is part of the deprecated ProductDetails component. */\nexport type CarouselConfig = {\n controls?: {\n desktop?: 'thumbnailsRow' | 'thumbnailsColumn' | 'dots' | null;\n mobile?: 'dots' | 'thumbnailsRow' | null;\n };\n arrowsOnMainImage?: boolean;\n loopable?: boolean;\n peak?: {\n desktop: boolean;\n mobile: boolean;\n };\n gap?: 'small' | 'medium' | 'large' | null;\n thumbnailsLoadingMode?: 'lazy' | 'eager';\n imageParams?: ResolveImageUrlOptions;\n thumbnailParams?: ResolveImageUrlOptions;\n};\n\n/** @deprecated This type is part of the deprecated ProductDetails component. */\nexport type OptionsConfig = {\n anchorOptions?: string[];\n};\n\n/** @deprecated This interface is part of the deprecated ProductDetails component. */\nexport interface ProductDetailsProps extends HTMLAttributes<HTMLDivElement> {\n sku: string;\n productData?: ProductModel;\n hideSku?: boolean;\n hideQuantity?: boolean;\n hideShortDescription?: boolean;\n hideDescription?: boolean;\n hideAttributes?: boolean;\n hideSelectedOptionValue?: boolean;\n hideURLParams?: boolean;\n slots?: {\n Title?: SlotProps<DefaultSlotContext>;\n\n SKU?: SlotProps<DefaultSlotContext>;\n\n RegularPrice?: SlotProps<DefaultSlotContext>;\n\n SpecialPrice?: SlotProps<DefaultSlotContext>;\n\n Options?: SlotProps<DefaultSlotContext>;\n\n Quantity?: SlotProps<DefaultSlotContext>;\n\n Actions?: SlotProps<\n DefaultSlotContext & {\n appendButton: SlotMethod<\n Omit<ButtonProps, 'icon'> & {\n text?: string;\n icon?: IconType;\n }\n >;\n }\n >;\n\n ShortDescription?: SlotProps<DefaultSlotContext>;\n\n Description?: SlotProps<DefaultSlotContext>;\n\n Attributes?: SlotProps<DefaultSlotContext>;\n\n Breadcrumbs?: SlotProps<\n DefaultSlotContext & {\n setSeparator: SlotMethod<IconType>;\n\n appendLink: SlotMethod<\n HTMLAttributes<HTMLAnchorElement> & { text?: string }\n >;\n\n appendHTMLElement: SlotMethod<HTMLElement>;\n }\n >;\n\n GalleryContent?: SlotProps<DefaultSlotContext>;\n\n InfoContent?: SlotProps<DefaultSlotContext>;\n\n Content?: SlotProps<DefaultSlotContext>;\n };\n carousel?: CarouselConfig;\n optionsConfig?: OptionsConfig;\n useACDL?: boolean;\n onAddToCart?: (values: Values) => void;\n zoomType?: 'zoom' | 'overlay';\n closeButton?: boolean;\n disableDropdownPreselection?: boolean;\n}\n\n/**\n * @deprecated This container has been deprecated and will be removed in a future release.\n * Please use the different composable containers to build your product details page.xs\n */\nexport const ProductDetails: Container<\n ProductDetailsProps,\n ProductModel | null\n> = ({\n sku,\n hideSku,\n hideQuantity,\n hideShortDescription,\n hideDescription,\n hideAttributes,\n hideURLParams,\n hideSelectedOptionValue,\n slots,\n children,\n initialData,\n carousel,\n optionsConfig,\n useACDL,\n onAddToCart,\n zoomType,\n closeButton = true,\n disableDropdownPreselection,\n ...props\n}) => {\n // i18n\n const AddToCartLabel = useText('PDP.Product.AddToCart.label').label;\n const IncrementerLabel = useText('PDP.Product.Incrementer.label').label;\n const DetailsLabel = useText('PDP.Product.Details.label').label;\n const ChooseOptionLabel = useText('PDP.Swatches.ChooseOption.label').label;\n\n // TODO: Investigate if the \"|| 'en-US' \" is really necessary\n const [locale, setLocale] = useState<Lang>(\n (config.getConfig().defaultLocale as Lang) || 'en-US'\n );\n\n const [selectionsToUpdate, setSelectionsToUpdate] = useState<Option[]>();\n\n const [data = null, setData] = useState(initialData);\n\n const [values, setValues] = useState<Values>(() => {\n const initialQuantity = getValidatedQuantityFromUrl(1); // Default quantity to 1\n\n const defaultValues: Values = {\n sku,\n quantity: initialQuantity,\n };\n\n if (data?.optionUIDs) {\n defaultValues.optionsUIDs = data.optionUIDs;\n }\n return defaultValues;\n });\n\n // the context is invalid for a configurable product that doesn't have all the options selected\n const [valid, setValid] = useState(() => {\n return !(\n data?.options &&\n data?.options?.length > 0 &&\n data?.optionUIDs?.length !== data?.options.length\n );\n });\n const defaultSlotContext: DefaultSlotContext = { data, values, valid };\n\n function hasProductViewOptionValueProduct(options: ProductOption[]) {\n return options?.some(\n (option) => option?.typename === 'ProductViewOptionValueProduct'\n );\n }\n\n useEffect(() => {\n const dataEvent = events.on('pdp/data', (payload) => {\n if (payload) {\n setData(payload);\n // Preserve the current quantity value when updating from pdp/data event\n setValues((prev: Values) => ({\n ...prev,\n sku: payload.sku,\n optionsUIDs: payload.optionUIDs,\n }));\n }\n });\n\n // @ts-ignore - Type error with event bus events\n const updateDataEvent = events.on(\n 'pdp/setValues',\n (payload: Partial<Values>) => {\n setValues((prev: Values) => ({ ...prev, ...payload }));\n }\n );\n\n return () => {\n updateDataEvent?.off();\n dataEvent?.off();\n };\n }, []);\n\n // Locale\n useEffect(() => {\n const localeEvent = events.on('locale', (payload: string) => {\n if (payload === locale) return;\n\n setLocale(payload as Lang);\n\n fetchProductData(sku, {\n preselectFirstOption: !disableDropdownPreselection,\n anchors: optionsConfig?.anchorOptions,\n }).then(setData);\n });\n return () => {\n localeEvent?.off();\n };\n }, [disableDropdownPreselection, locale, optionsConfig?.anchorOptions, sku]);\n\n useEffect(() => {\n if (useACDL && initialData && Object.keys(initialData).length > 0) {\n publishProductPageViewEvent(initialData);\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [initialData]);\n\n // Callbacks\n const handleOnValues = useCallback((newValues: Partial<Values>) => {\n setValues((prev) => ({ ...prev, ...newValues }));\n }, []);\n\n useEffect(() => {\n events.emit('pdp/values', values);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [JSON.stringify(values)]);\n\n const handleOptionSelected = useCallback(\n async (selections: { [id: string]: { label: string; value: string } }) => {\n // options Selected\n let optionsUIDs = Object.entries(selections)\n .filter(([_, value]) => value.label !== ChooseOptionLabel) // eslint-disable-line no-unused-vars\n .map(([id, _]) => selections[id].value) // eslint-disable-line no-unused-vars\n .filter((element) => element !== undefined);\n\n // set optionUIDs to URL params\n // ?optionsUIDs=1,2,3\n // only set the URL params if the hideURLParams is not set to true and the product is not a bundle type\n if (\n !hideURLParams &&\n data?.options &&\n !hasProductViewOptionValueProduct(data.options)\n ) {\n setUrlParams({ optionsUIDs: optionsUIDs.join(',') });\n }\n\n // update state\n handleOnValues({ optionsUIDs });\n setValid(optionsUIDs?.length === data?.options?.length);\n\n // get refined product data and update state\n const next = await fetchProductData(sku, {\n anchors: optionsConfig?.anchorOptions,\n isBundle: data?.isBundle,\n optionsUIDs,\n preselectFirstOption: !disableDropdownPreselection,\n });\n\n setData(next);\n\n // special processing for anchor options (options that should not be refined when other options are selected)\n if (optionsConfig?.anchorOptions?.length) {\n processUpdates(next, optionsUIDs);\n }\n },\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [sku]\n );\n\n const processUpdates = useCallback(\n (next: ProductModel | null, previousOptionsUIDs: string[]) => {\n const updatedOptionsUIDs = next?.optionUIDs ?? [];\n const haveSameValues = previousOptionsUIDs.every((item) =>\n updatedOptionsUIDs.includes(item)\n );\n if (!haveSameValues) {\n setSelectionsToUpdate(next?.options);\n handleOnValues({ optionsUIDs: updatedOptionsUIDs });\n setValid(updatedOptionsUIDs?.length === next?.options?.length);\n }\n },\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [sku]\n );\n\n const handleOnErrors = useCallback((_errors: { [id: string]: string }) => {\n if (Object.keys(_errors).length !== 0) setValid(false);\n }, []);\n\n // Product Attributes\n const attributes = useMemo(() => {\n return data?.attributes?.map(({ label, value, id }, key: number) => {\n // Return empty string for gift card attributes\n if (id === 'ac_giftcard') {\n return '';\n }\n\n const __html = isDateValid(value)\n ? toDateString(value, locale)\n : value.toString();\n\n return (\n <li key={key}>\n {/* eslint-disable-next-line react/no-danger */}\n {label}: <span dangerouslySetInnerHTML={{ __html }} />\n </li>\n );\n });\n }, [data?.attributes, locale]);\n\n const quantity =\n !hideQuantity && data?.inStock ? (\n <Slot\n name=\"Quantity\"\n slot={slots?.Quantity}\n context={{ ...defaultSlotContext }}\n >\n <Incrementer\n key=\"quantity\"\n name=\"quantity\"\n defaultValue={values.quantity.toString()}\n value={values.quantity.toString()}\n min={1}\n aria-label={IncrementerLabel}\n className=\"pdp-product__quantity\"\n onValue={(quantity) => {\n const quantityValue = Number(quantity);\n handleOnValues({ quantity: quantityValue });\n\n // Add quantity to URL parameters if not set to hide\n if (!hideURLParams && data?.options) {\n // Only update URL if the product is not a bundle type\n if (!hasProductViewOptionValueProduct(data.options)) {\n setUrlParams({ quantity: quantityValue });\n }\n }\n }}\n />\n </Slot>\n ) : undefined;\n\n const renderOptions = () => {\n if (data?.options) {\n return (\n <Slot\n name=\"Options\"\n slot={slots?.Options}\n context={{ ...defaultSlotContext }}\n >\n <Swatches\n selectedUIDs={values.optionsUIDs}\n options={data.options}\n defaultOptions={values.optionsUIDs}\n selectionsToUpdate={selectionsToUpdate}\n hideSelectedValue={hideSelectedOptionValue}\n disablePreselections={disableDropdownPreselection}\n onValues={handleOptionSelected}\n onErrors={handleOnErrors}\n />\n </Slot>\n );\n }\n };\n\n const renderGiftCardOptions = () => {\n if (data?.attributes) {\n const giftCardAttributes = data.attributes.filter(\n (attr) => attr.id === 'ac_giftcard'\n );\n\n if (giftCardAttributes.length > 0) {\n const giftCardElements = giftCardAttributes.map(\n (giftCardAttr, index) => {\n try {\n const giftCardData = JSON.parse(giftCardAttr.value);\n const prevOptions = values.enteredOptions || [];\n const optionValues =\n giftCardData.options?.map((option: any) => {\n const existingOption = prevOptions.find(\n (opt: { uid: string; value: string }) =>\n opt.uid === option.uid\n );\n return {\n id: option.uid,\n value: existingOption?.value || '',\n };\n }) || [];\n\n return (\n <GiftCardOptions\n key={`giftcard-${index}`}\n options={giftCardData.options || []}\n optionValues={optionValues}\n onOptionChange={(uid: string, value: string) => {\n const prevOptions = values.enteredOptions || [];\n const idx = prevOptions.findIndex(\n (field: { uid: string; value: string }) =>\n field.uid === uid\n );\n let newEnteredOptions;\n if (idx !== -1) {\n newEnteredOptions = prevOptions.map(\n (field: { uid: string; value: string }) =>\n field.uid === uid ? { ...field, value } : field\n );\n } else {\n newEnteredOptions = [...prevOptions, { uid, value }];\n }\n\n handleOnValues({ enteredOptions: newEnteredOptions });\n\n if (data) {\n const updatedData = { ...data };\n const giftCardAttributes =\n updatedData.attributes?.map((attr) => {\n if (attr.id === 'ac_giftcard') {\n try {\n const giftCardData = JSON.parse(attr.value);\n const updatedOptions =\n giftCardData.options?.map((option: any) => {\n if (option.uid === uid) {\n return { ...option, value };\n }\n return option;\n }) || [];\n return {\n ...attr,\n value: JSON.stringify({\n ...giftCardData,\n options: updatedOptions,\n }),\n };\n } catch (error) {\n return attr;\n }\n }\n return attr;\n }) || [];\n updatedData.attributes = giftCardAttributes;\n setData(updatedData);\n }\n }}\n onValidationChange={(valid: boolean) => {\n if (!valid) {\n handleOnErrors({ giftCard: 'Invalid gift card data' });\n }\n\n setValid(valid);\n }}\n className=\"pdp-product__gift-card-options\"\n />\n );\n } catch (error) {\n console.warn('Invalid gift card data format:', error);\n return null;\n }\n }\n );\n\n // Filter out null values and return a single element\n const validElements = giftCardElements.filter(\n (element) => element !== null\n );\n return validElements.length > 0 ? (\n <div className=\"pdp-product__gift-card-options-container\">\n {validElements}\n </div>\n ) : undefined;\n }\n }\n return undefined;\n };\n\n return (\n <div {...props}>\n <Product\n title={\n <Slot\n name=\"Title\"\n slot={slots?.Title}\n context={{ ...defaultSlotContext }}\n >\n {data?.name}\n </Slot>\n }\n sku={\n !hideSku ? (\n <Slot\n name=\"SKU\"\n slot={slots?.SKU}\n context={{ ...defaultSlotContext }}\n >\n {data?.sku}\n </Slot>\n ) : undefined\n }\n options={renderOptions()}\n giftCardOptions={renderGiftCardOptions()}\n breadcrumbs={\n slots?.Breadcrumbs && (\n <Slot\n name=\"Breadcrumbs\"\n slot={slots?.Breadcrumbs}\n context={{\n ...defaultSlotContext,\n\n setSeparator(callback) {\n this._registerMethod((...attrs) => {\n const nextSeparator = callback(...attrs);\n\n const separator = nextSeparator && (\n <Icon source={nextSeparator} />\n );\n\n this._setProps((prev: any) => {\n return {\n ...prev,\n separator,\n children: [\n // eslint-disable-next-line react/jsx-key\n <Breadcrumbs\n separator={separator}\n categories={prev.categories}\n />,\n ],\n };\n });\n });\n },\n\n appendLink(callback) {\n this._registerMethod((...attrs) => {\n const { text, ...p } = callback(...attrs);\n\n const link = <a {...p}>{text}</a>;\n\n this._setProps((prev: any) => {\n const categories = [...(prev.categories || []), link];\n return {\n ...prev,\n categories,\n children: [\n // eslint-disable-next-line react/jsx-key\n <Breadcrumbs\n separator={prev.separator}\n categories={categories}\n />,\n ],\n };\n });\n });\n },\n\n appendHTMLElement(callback) {\n this._registerMethod((...attrs) => {\n const domElement = callback(...attrs);\n\n const vnode = this._htmlElementToVNode(domElement);\n\n this._setProps((prev: any) => {\n const categories = [...(prev.categories || []), vnode];\n\n return {\n ...prev,\n categories,\n children: [\n // eslint-disable-next-line react/jsx-key\n <Breadcrumbs\n separator={prev.separator}\n categories={categories}\n />,\n ],\n };\n });\n });\n },\n }}\n />\n )\n }\n quantity={quantity}\n actions={\n <Slot\n name=\"Actions\"\n slot={slots?.Actions}\n context={{\n ...defaultSlotContext,\n\n appendButton(callback) {\n this._registerMethod((...attrs) => {\n const _button = callback(...attrs);\n\n if (!_button) return;\n\n const { text, icon, ...buttonProps } = _button;\n\n const button = (\n <Button\n type=\"button\"\n {...buttonProps}\n icon={icon && <Icon source={icon} />}\n >\n {text}\n </Button>\n );\n\n this._setProps((prev: any) => ({\n children: [...(prev.children || []), button],\n }));\n });\n },\n }}\n >\n {\n // Default Add to Cart button if no slot is provided\n !slots?.Actions && (\n <Button\n size=\"medium\"\n type=\"submit\"\n icon={<Icon source=\"Cart\" />}\n disabled={!data?.inStock || !valid}\n aria-label={AddToCartLabel}\n onClick={() => {\n return onAddToCart?.(values);\n }}\n >\n {AddToCartLabel}\n </Button>\n )\n }\n </Slot>\n }\n shortDescription={\n !hideShortDescription ? (\n <Slot\n name=\"ShortDescription\"\n slot={slots?.ShortDescription}\n context={{ ...defaultSlotContext }}\n >\n <div\n // eslint-disable-next-line react/no-danger\n dangerouslySetInnerHTML={{\n __html: data?.shortDescription ?? '',\n }}\n />\n </Slot>\n ) : undefined\n }\n description={\n !hideDescription ? (\n <Slot\n name=\"Description\"\n slot={slots?.Description}\n context={{ ...defaultSlotContext }}\n >\n <div\n // eslint-disable-next-line react/no-danger\n dangerouslySetInnerHTML={{ __html: data?.description ?? '' }}\n />\n </Slot>\n ) : undefined\n }\n images={\n data?.images?.map(({ label, url }) => (\n <Image\n key={url}\n title={label}\n alt={label}\n src={url}\n // TODO: change width/height for image aspect ratio\n // pending https://jira.corp.adobe.com/browse/DATA-5122\n width={carousel?.imageParams?.width ?? 960}\n height={carousel?.imageParams?.height ?? 1191}\n params={carousel?.imageParams ?? { width: 960 }}\n />\n )) ?? []\n }\n specialPrice={\n data?.prices?.visible ? (\n <Slot\n name=\"SpecialPrice\"\n slot={slots?.SpecialPrice}\n context={{ ...defaultSlotContext }}\n >\n <PriceRange\n {...data.prices?.final}\n locale={toLanguageTag(locale)}\n />\n </Slot>\n ) : undefined\n }\n price={\n data?.prices?.visible &&\n data?.prices?.regular &&\n data?.prices?.final?.amount !== data?.prices?.regular?.amount ? (\n <Slot\n name=\"RegularPrice\"\n slot={slots?.RegularPrice}\n context={{ ...defaultSlotContext }}\n >\n <PriceRange\n {...data.prices?.regular}\n locale={toLanguageTag(locale)}\n />\n </Slot>\n ) : undefined\n }\n zoomType={zoomType}\n closeButton={closeButton}\n carouselConfig={{\n ...carousel,\n thumbnails:\n carousel && Object.keys(carousel).length\n ? data?.images?.map(({ label, url }) => (\n <Image\n key={url}\n title={label}\n alt={label}\n src={url}\n // TODO: change width/height for image aspect ratio\n // pending https://jira.corp.adobe.com/browse/DATA-5122\n width={carousel?.thumbnailParams?.width ?? 200}\n height={carousel?.thumbnailParams?.height ?? 248}\n params={carousel?.thumbnailParams ?? { width: 200 }}\n />\n )) ?? []\n : [],\n }}\n outOfStock={!data?.inStock}\n attributes={\n !hideAttributes ? (\n <Slot\n name=\"Attributes\"\n slot={slots?.Attributes}\n context={{ ...defaultSlotContext }}\n >\n {attributes?.length ? (\n <>\n {DetailsLabel}\n <ul>{attributes}</ul>\n </>\n ) : null}\n </Slot>\n ) : undefined\n }\n galleryContent={\n slots?.GalleryContent && (\n <Slot\n name=\"GalleryContent\"\n slot={slots.GalleryContent}\n context={{ ...defaultSlotContext }}\n />\n )\n }\n infoContent={\n slots?.InfoContent && (\n <Slot\n name=\"InfoContent\"\n slot={slots.InfoContent}\n context={{ ...defaultSlotContext }}\n />\n )\n }\n productContent={\n slots?.Content && (\n <Slot\n name=\"Content\"\n slot={slots.Content}\n context={{ ...defaultSlotContext }}\n />\n )\n }\n />\n </div>\n );\n};\n\n/** @deprecated This method is part of the deprecated ProductDetails component. */\nProductDetails.getInitialData = async function ({\n sku,\n disableDropdownPreselection = false,\n optionsConfig,\n}) {\n const initialData = config.getConfig().models?.ProductDetails?.initialData;\n\n return initialData\n ? transformProductData(initialData)\n : fetchProductData(sku, {\n preselectFirstOption: !disableDropdownPreselection,\n anchors: optionsConfig?.anchorOptions,\n });\n};\n"],"names":["Product","title","breadcrumbs","galleryContent","infoContent","productContent","sku","outOfStock","shortDescription","description","attributes","images","options","giftCardOptions","price","specialPrice","className","children","quantity","actions","carouselConfig","zoomType","closeButton","props","RegularPriceLabel","useText","SpecialPriceLabel","OutOfStockLabel","ImagesLabel","zoom","setZoom","useState","galleryImages","image","key","alt","_a","jsx","Zoom","VComponent","localThumbnailsImages","jsxs","classes","_b","Carousel","_c","_d","GalleryGrid","_e","_f","_g","_h","_i","Overlay","gap","style","count","Children","child","ProductDetails","hideSku","hideQuantity","hideShortDescription","hideDescription","hideAttributes","hideURLParams","hideSelectedOptionValue","slots","initialData","carousel","optionsConfig","useACDL","onAddToCart","disableDropdownPreselection","AddToCartLabel","IncrementerLabel","DetailsLabel","ChooseOptionLabel","locale","setLocale","config","selectionsToUpdate","setSelectionsToUpdate","data","setData","values","setValues","initialQuantity","getValidatedQuantityFromUrl","defaultValues","valid","setValid","defaultSlotContext","hasProductViewOptionValueProduct","option","useEffect","dataEvent","events","payload","prev","updateDataEvent","localeEvent","fetchProductData","publishProductPageViewEvent","handleOnValues","useCallback","newValues","handleOptionSelected","selections","optionsUIDs","_","value","id","element","setUrlParams","next","processUpdates","previousOptionsUIDs","updatedOptionsUIDs","item","handleOnErrors","_errors","useMemo","label","__html","isDateValid","toDateString","Slot","Incrementer","quantityValue","renderOptions","Swatches","renderGiftCardOptions","giftCardAttributes","attr","validElements","giftCardAttr","index","giftCardData","prevOptions","optionValues","existingOption","opt","GiftCardOptions","uid","idx","field","newEnteredOptions","updatedData","updatedOptions","error","callback","attrs","nextSeparator","separator","Icon","Breadcrumbs","text","p","link","categories","domElement","vnode","_button","icon","buttonProps","button","Button","url","Image","PriceRange","toLanguageTag","_j","_k","Fragment","transformProductData"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"ProductDetails.js","sources":["/@dropins/storefront-pdp/src/components/Product/Product.tsx","/@dropins/storefront-pdp/src/components/GalleryGrid/GalleryGrid.tsx","/@dropins/storefront-pdp/src/containers/ProductDetails/ProductDetails.tsx"],"sourcesContent":["/**\n * ADOBE CONFIDENTIAL\n * __________________\n * Copyright 2023 Adobe\n * All Rights Reserved.\n * __________________\n * NOTICE: All information contained herein is, and remains\n * the property of Adobe and its suppliers, if any. The intellectual\n * and technical concepts contained herein are proprietary to Adobe\n * and its suppliers and are protected by all applicable intellectual\n * property laws, including trade secret and copyright laws.\n * Dissemination of this information or reproduction of this material\n * is strictly forbidden unless prior written permission is obtained\n * from Adobe.\n */\n\nimport { FunctionComponent, VNode } from 'preact';\nimport { HTMLAttributes, useState } from 'preact/compat';\nimport { classes, VComponent } from '@adobe-commerce/elsie/lib';\nimport { useText } from '@adobe-commerce/elsie/i18n';\n\nimport { Carousel, GalleryGrid, Overlay, Zoom } from '@/pdp/components';\nimport '@/pdp/components/Product/Product.css';\n\nimport { CarouselConfig } from '@/pdp/containers';\n\ninterface ProductCarouselConfig extends CarouselConfig {\n thumbnails: VNode[];\n}\n\nexport interface ProductProps\n extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {\n title?: VNode;\n breadcrumbs?: VNode;\n galleryContent?: VNode;\n infoContent?: VNode;\n productContent?: VNode;\n shortDescription?: VNode;\n description?: VNode;\n attributes?: VNode;\n images: VNode[];\n options?: VNode;\n giftCardOptions?: VNode;\n downloadableOptions?: VNode;\n sku?: VNode;\n price?: VNode;\n specialPrice?: VNode;\n outOfStock: boolean;\n actions?: VNode;\n quantity?: VNode;\n carouselConfig?: ProductCarouselConfig;\n zoomType?: 'zoom' | 'overlay';\n closeButton?: boolean;\n}\n\nexport const Product: FunctionComponent<ProductProps> = ({\n title,\n breadcrumbs,\n galleryContent,\n infoContent,\n productContent,\n sku,\n outOfStock,\n shortDescription,\n description,\n attributes,\n images,\n options,\n giftCardOptions,\n downloadableOptions,\n price,\n specialPrice,\n className,\n children,\n quantity,\n actions,\n carouselConfig,\n zoomType = 'overlay',\n closeButton = true,\n ...props\n}) => {\n // i18n\n const RegularPriceLabel = useText('PDP.Product.RegularPrice.label').label;\n const SpecialPriceLabel = useText('PDP.Product.SpecialPrice.label').label;\n const OutOfStockLabel = useText('PDP.Product.OutOfStock.label').label;\n const ImagesLabel = useText('PDP.Product.Image.label').label;\n\n const [zoom, setZoom] = useState<number | null>(null);\n\n const galleryImages = images?.length ? (\n images.map((image, key) => {\n const alt =\n title?.props?.children &&\n ImagesLabel?.replace('{product}', title.props.children.toString())\n .replace('{key}', String(key + 1))\n .replace('{total}', String(images.length));\n return zoomType === 'zoom' ? (\n <Zoom closeButton={closeButton}>\n <VComponent\n key={key}\n node={image}\n loading={key === 0 ? 'eager' : 'lazy'}\n alt={alt}\n />\n </Zoom>\n ) : (\n <VComponent\n key={key}\n node={image}\n loading={key === 0 ? 'eager' : 'lazy'}\n alt={alt}\n onClick={() => setZoom(key)}\n />\n );\n })\n ) : (\n <img\n src=\"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\"\n className=\"pdp-product__images__placeholder\"\n aria-hidden\n />\n );\n\n const localThumbnailsImages = carouselConfig?.thumbnails?.length ? (\n carouselConfig.thumbnails.map((image, key) => (\n <VComponent\n key={key}\n node={image}\n loading={carouselConfig?.thumbnailsLoadingMode || 'lazy'}\n alt={\n title?.props?.children &&\n ImagesLabel?.replace('{product}', title.props.children.toString())\n .replace('{key}', String(key + 1))\n .replace('{total}', String(images.length))\n }\n />\n ))\n ) : (\n <img\n src=\"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\"\n className=\"pdp-product__images__placeholder\"\n aria-hidden\n />\n );\n\n return (\n <div {...props} className={classes(['pdp-product', className])}>\n {breadcrumbs && (\n <VComponent node={breadcrumbs} className=\"pdp-product__breadcrumbs\" />\n )}\n <div className=\"pdp-product__column-container pdp-product__gallery-column\">\n <div className=\"pdp-product__column-body\">\n {carouselConfig?.controls?.desktop ? (\n <Carousel\n className=\"pdp-product__overlay__carousel\"\n arrows={images?.length > 1}\n controls={\n images?.length > 1 ? carouselConfig.controls.desktop : 'dots'\n }\n arrowsOnMainImage={carouselConfig?.arrowsOnMainImage}\n loop={carouselConfig?.loopable && images?.length > 1}\n peak={\n (carouselConfig?.thumbnails?.length > 1 &&\n carouselConfig?.peak?.desktop) ||\n false\n }\n gap={carouselConfig?.gap || null}\n width=\"100%\"\n height=\"100%\"\n defaultIndex={zoom || 0}\n thumbnails={localThumbnailsImages}\n >\n {galleryImages}\n </Carousel>\n ) : (\n <GalleryGrid className=\"pdp-product__images\" gap=\"small\">\n {galleryImages}\n </GalleryGrid>\n )}\n </div>\n {galleryContent && (\n <VComponent\n node={galleryContent}\n className=\"pdp-product__gallery-content\"\n />\n )}\n </div>\n\n <div className=\"pdp-product__column-container pdp-product__content-column\">\n <div className=\"pdp-product__column-body\">\n <div className=\"pdp-product__header\">\n {title && (\n <VComponent node={title} className=\"pdp-product__title\" />\n )}\n\n {sku && <VComponent node={sku} className=\"pdp-product__sku\" />}\n </div>\n\n <div className=\"pdp-product__prices\">\n {specialPrice && (\n <VComponent\n node={specialPrice}\n className={classes([\n 'pdp-product__price-special',\n 'pdp-product__price',\n ])}\n aria-label={SpecialPriceLabel}\n role=\"text\"\n />\n )}\n {price && (\n <VComponent\n node={price}\n className={classes([\n 'pdp-product__price-regular',\n 'pdp-product__price--grey',\n ])}\n aria-label={RegularPriceLabel}\n role=\"text\"\n />\n )}\n </div>\n\n {/* Small Screen Gallery */}\n {carouselConfig?.controls?.mobile &&\n carouselConfig?.controls?.mobile === 'thumbnailsRow' ? (\n <Carousel\n className=\"pdp-product__images pdp-product__images--carousel pdp-product__images--carousel--thumbnails\"\n width=\"100%\"\n height=\"auto\"\n arrows={images?.length > 1}\n controls={images?.length > 1 ? 'thumbnailsRow' : null}\n loop={carouselConfig?.loopable && images?.length > 1}\n peak={\n (carouselConfig?.thumbnails?.length > 1 &&\n carouselConfig?.peak?.mobile) ||\n false\n }\n gap={carouselConfig?.gap || null}\n thumbnails={localThumbnailsImages}\n >\n {galleryImages}\n </Carousel>\n ) : (\n <Carousel\n className=\"pdp-product__images pdp-product__images--carousel\"\n peak={carouselConfig?.peak?.mobile && images?.length > 1}\n gap={carouselConfig?.gap || null}\n width=\"100%\"\n height=\"auto\"\n arrows={images?.length > 1}\n controls={images?.length > 1 ? 'dots' : null}\n loop={carouselConfig?.loopable && images?.length > 1}\n >\n {galleryImages}\n </Carousel>\n )}\n\n <div\n className={classes([\n 'pdp-product__actions',\n [`pdp-product__actions--out-of-stock`, outOfStock],\n ])}\n >\n {outOfStock && (\n <div className=\"pdp-product__out-of-stock__text\">\n {OutOfStockLabel}\n </div>\n )}\n\n {options && (\n <VComponent\n node={options}\n className={classes(['pdp-product__options'])}\n />\n )}\n\n {giftCardOptions && (\n <VComponent\n node={giftCardOptions}\n className={classes(['pdp-product__gift-card-options'])}\n />\n )}\n\n {downloadableOptions && (\n <VComponent\n node={downloadableOptions}\n className={classes(['pdp-product__downloadable-options'])}\n />\n )}\n\n {quantity && (\n <div className=\"pdp-product__quantity\">\n <VComponent node={quantity} />\n </div>\n )}\n\n {actions && (\n <VComponent\n node={actions}\n className={classes(['pdp-product__buttons'])}\n />\n )}\n </div>\n\n {shortDescription && (\n <VComponent\n node={shortDescription}\n className={classes(['pdp-product__short_description'])}\n />\n )}\n\n {description && (\n <VComponent\n node={description}\n className={classes(['pdp-product__description'])}\n />\n )}\n\n {attributes ? (\n <div className=\"pdp-product__attributes\">{attributes}</div>\n ) : null}\n </div>\n {infoContent && (\n <VComponent\n node={infoContent}\n className=\"pdp-product__info-content\"\n />\n )}\n </div>\n\n {productContent && (\n <VComponent node={productContent} className=\"pdp-product__content\" />\n )}\n\n {/* Zoom Overlay */}\n {zoom === null ? null : (\n <Overlay\n className=\"pdp-product__overlay\"\n onClose={() => setZoom(null)}\n centered\n >\n <Carousel\n className=\"pdp-product__overlay__carousel\"\n arrows={images?.length > 1}\n width=\"100%\"\n height=\"100%\"\n defaultIndex={zoom || 0}\n loop={carouselConfig?.loopable && images?.length > 1}\n controls={images?.length > 1 ? 'dots' : null}\n isZoomed\n >\n {galleryImages}\n </Carousel>\n </Overlay>\n )}\n </div>\n );\n};\n","/**\n * ADOBE CONFIDENTIAL\n * __________________\n * Copyright 2023 Adobe\n * All Rights Reserved.\n * __________________\n * NOTICE: All information contained herein is, and remains\n * the property of Adobe and its suppliers, if any. The intellectual\n * and technical concepts contained herein are proprietary to Adobe\n * and its suppliers and are protected by all applicable intellectual\n * property laws, including trade secret and copyright laws.\n * Dissemination of this information or reproduction of this material\n * is strictly forbidden unless prior written permission is obtained\n * from Adobe.\n */\n\nimport { FunctionComponent, VNode } from 'preact';\nimport { HTMLAttributes, Children } from 'preact/compat';\nimport { classes, VComponent } from '@adobe-commerce/elsie/lib';\nimport '@/pdp/components/GalleryGrid/GalleryGrid.css';\n\nexport interface GalleryGridProps extends HTMLAttributes<HTMLDivElement> {\n children: VNode[] | VNode;\n gap?: 'small' | 'medium' | 'large' | null;\n style?: Record<string, string | number>;\n}\n\nexport const GalleryGrid: FunctionComponent<GalleryGridProps> = ({\n children,\n gap = null,\n className,\n style,\n ...props\n}) => {\n const count = Children.count(children);\n\n return (\n <div\n {...props}\n className={classes(['pdp-gallery-grid', className])}\n style={{\n '--gap': gap ? `var(--spacing-${gap})` : '0px',\n ...style,\n }}\n >\n {Children.map(\n children,\n (child: VNode<HTMLAttributes<HTMLElement>>, key) => (\n <div key={count + key} className=\"pdp-gallery-grid__item\">\n <VComponent\n key={child.props.src}\n node={child}\n loading={key === 0 ? 'eager' : 'lazy'}\n />\n </div>\n )\n )}\n </div>\n );\n};\n","/**\n * ADOBE CONFIDENTIAL\n * __________________\n * Copyright 2023 Adobe\n * All Rights Reserved.\n * __________________\n * NOTICE: All information contained herein is, and remains\n * the property of Adobe and its suppliers, if any. The intellectual\n * and technical concepts contained herein are proprietary to Adobe\n * and its suppliers and are protected by all applicable intellectual\n * property laws, including trade secret and copyright laws.\n * Dissemination of this information or reproduction of this material\n * is strictly forbidden unless prior written permission is obtained\n * from Adobe.\n */\n\nimport {\n HTMLAttributes,\n useEffect,\n useState,\n useCallback,\n useMemo,\n} from 'preact/compat';\n\nimport {\n Container,\n toLanguageTag,\n SlotProps,\n SlotMethod,\n Slot,\n ResolveImageUrlOptions,\n} from '@adobe-commerce/elsie/lib';\n\nimport {\n Button,\n Icon,\n ButtonProps,\n Image,\n Incrementer,\n Breadcrumbs,\n} from '@adobe-commerce/elsie/components';\nimport {\n Product,\n Swatches,\n PriceRange,\n Option,\n GiftCardOptions,\n DownloadableOptions,\n} from '@/pdp/components';\nimport { config, fetchProductData } from '@/pdp/api';\nimport { events } from '@adobe-commerce/event-bus';\nimport { Lang, useText } from '@adobe-commerce/elsie/i18n';\nimport { isDateValid, toDateString } from '@/pdp/lib/date';\nimport {\n setUrlParams,\n getValidatedQuantityFromUrl,\n} from '@/pdp/lib/url-params';\nimport { publishProductPageViewEvent } from '@/pdp/lib/acdl';\nimport { ProductModel, Option as ProductOption } from '@/pdp/data/models';\nimport { transformProductData } from '@/pdp/data/transforms/product-transform';\n\ntype IconType = keyof typeof import('@adobe-commerce/elsie/icons');\n\n/** @deprecated This type is part of the deprecated ProductDetails component. */\nexport type Values = {\n sku: string;\n quantity: number;\n optionsUIDs?: string[];\n enteredOptions?: Array<{ uid: string; value: string }>;\n};\n\n/** @deprecated This type is part of the deprecated ProductDetails component. */\ntype DefaultSlotContext = {\n data: ProductModel | null;\n values: Values;\n valid: boolean;\n};\n\n/** @deprecated This type is part of the deprecated ProductDetails component. */\nexport type CarouselConfig = {\n controls?: {\n desktop?: 'thumbnailsRow' | 'thumbnailsColumn' | 'dots' | null;\n mobile?: 'dots' | 'thumbnailsRow' | null;\n };\n arrowsOnMainImage?: boolean;\n loopable?: boolean;\n peak?: {\n desktop: boolean;\n mobile: boolean;\n };\n gap?: 'small' | 'medium' | 'large' | null;\n thumbnailsLoadingMode?: 'lazy' | 'eager';\n imageParams?: ResolveImageUrlOptions;\n thumbnailParams?: ResolveImageUrlOptions;\n};\n\n/** @deprecated This type is part of the deprecated ProductDetails component. */\nexport type OptionsConfig = {\n anchorOptions?: string[];\n};\n\n/** @deprecated This interface is part of the deprecated ProductDetails component. */\nexport interface ProductDetailsProps extends HTMLAttributes<HTMLDivElement> {\n sku: string;\n productData?: ProductModel;\n hideSku?: boolean;\n hideQuantity?: boolean;\n hideShortDescription?: boolean;\n hideDescription?: boolean;\n hideAttributes?: boolean;\n hideSelectedOptionValue?: boolean;\n hideURLParams?: boolean;\n slots?: {\n Title?: SlotProps<DefaultSlotContext>;\n\n SKU?: SlotProps<DefaultSlotContext>;\n\n RegularPrice?: SlotProps<DefaultSlotContext>;\n\n SpecialPrice?: SlotProps<DefaultSlotContext>;\n\n Options?: SlotProps<DefaultSlotContext>;\n\n Quantity?: SlotProps<DefaultSlotContext>;\n\n Actions?: SlotProps<\n DefaultSlotContext & {\n appendButton: SlotMethod<\n Omit<ButtonProps, 'icon'> & {\n text?: string;\n icon?: IconType;\n }\n >;\n }\n >;\n\n ShortDescription?: SlotProps<DefaultSlotContext>;\n\n Description?: SlotProps<DefaultSlotContext>;\n\n Attributes?: SlotProps<DefaultSlotContext>;\n\n Breadcrumbs?: SlotProps<\n DefaultSlotContext & {\n setSeparator: SlotMethod<IconType>;\n\n appendLink: SlotMethod<\n HTMLAttributes<HTMLAnchorElement> & { text?: string }\n >;\n\n appendHTMLElement: SlotMethod<HTMLElement>;\n }\n >;\n\n GalleryContent?: SlotProps<DefaultSlotContext>;\n\n InfoContent?: SlotProps<DefaultSlotContext>;\n\n Content?: SlotProps<DefaultSlotContext>;\n };\n carousel?: CarouselConfig;\n optionsConfig?: OptionsConfig;\n useACDL?: boolean;\n onAddToCart?: (values: Values) => void;\n zoomType?: 'zoom' | 'overlay';\n closeButton?: boolean;\n disableDropdownPreselection?: boolean;\n}\n\n/**\n * @deprecated This container has been deprecated and will be removed in a future release.\n * Please use the different composable containers to build your product details page.xs\n */\nexport const ProductDetails: Container<\n ProductDetailsProps,\n ProductModel | null\n> = ({\n sku,\n hideSku,\n hideQuantity,\n hideShortDescription,\n hideDescription,\n hideAttributes,\n hideURLParams,\n hideSelectedOptionValue,\n slots,\n children,\n initialData,\n carousel,\n optionsConfig,\n useACDL,\n onAddToCart,\n zoomType,\n closeButton = true,\n disableDropdownPreselection,\n ...props\n}) => {\n // i18n\n const AddToCartLabel = useText('PDP.Product.AddToCart.label').label;\n const IncrementerLabel = useText('PDP.Product.Incrementer.label').label;\n const DetailsLabel = useText('PDP.Product.Details.label').label;\n const ChooseOptionLabel = useText('PDP.Swatches.ChooseOption.label').label;\n\n // TODO: Investigate if the \"|| 'en-US' \" is really necessary\n const [locale, setLocale] = useState<Lang>(\n (config.getConfig().defaultLocale as Lang) || 'en-US'\n );\n\n const [selectionsToUpdate, setSelectionsToUpdate] = useState<Option[]>();\n\n const [data = null, setData] = useState(initialData);\n\n const [values, setValues] = useState<Values>(() => {\n const initialQuantity = getValidatedQuantityFromUrl(1); // Default quantity to 1\n\n const defaultValues: Values = {\n sku,\n quantity: initialQuantity,\n };\n\n if (data?.optionUIDs) {\n defaultValues.optionsUIDs = data.optionUIDs;\n }\n return defaultValues;\n });\n\n // the context is invalid for a configurable product that doesn't have all the options selected\n const [valid, setValid] = useState(() => {\n return !(\n data?.options &&\n data?.options?.length > 0 &&\n data?.optionUIDs?.length !== data?.options.length\n );\n });\n const defaultSlotContext: DefaultSlotContext = { data, values, valid };\n\n function hasProductViewOptionValueProduct(options: ProductOption[]) {\n return options?.some(\n (option) => option?.typename === 'ProductViewOptionValueProduct'\n );\n }\n\n useEffect(() => {\n const dataEvent = events.on('pdp/data', (payload) => {\n if (payload) {\n setData(payload);\n // Preserve the current quantity value when updating from pdp/data event\n setValues((prev: Values) => ({\n ...prev,\n sku: payload.sku,\n optionsUIDs: payload.optionUIDs,\n }));\n }\n });\n\n // @ts-ignore - Type error with event bus events\n const updateDataEvent = events.on(\n 'pdp/setValues',\n (payload: Partial<Values>) => {\n setValues((prev: Values) => ({ ...prev, ...payload }));\n }\n );\n\n return () => {\n updateDataEvent?.off();\n dataEvent?.off();\n };\n }, []);\n\n // Locale\n useEffect(() => {\n const localeEvent = events.on('locale', (payload: string) => {\n if (payload === locale) return;\n\n setLocale(payload as Lang);\n\n fetchProductData(sku, {\n preselectFirstOption: !disableDropdownPreselection,\n anchors: optionsConfig?.anchorOptions,\n }).then(setData);\n });\n return () => {\n localeEvent?.off();\n };\n }, [disableDropdownPreselection, locale, optionsConfig?.anchorOptions, sku]);\n\n useEffect(() => {\n if (useACDL && initialData && Object.keys(initialData).length > 0) {\n publishProductPageViewEvent(initialData);\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [initialData]);\n\n // Callbacks\n const handleOnValues = useCallback((newValues: Partial<Values>) => {\n setValues((prev) => ({ ...prev, ...newValues }));\n }, []);\n\n useEffect(() => {\n events.emit('pdp/values', values);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [JSON.stringify(values)]);\n\n const handleOptionSelected = useCallback(\n async (selections: { [id: string]: { label: string; value: string } }) => {\n // options Selected\n let optionsUIDs = Object.entries(selections)\n .filter(([_, value]) => value.label !== ChooseOptionLabel) // eslint-disable-line no-unused-vars\n .map(([id, _]) => selections[id].value) // eslint-disable-line no-unused-vars\n .filter((element) => element !== undefined);\n\n // set optionUIDs to URL params\n // ?optionsUIDs=1,2,3\n // only set the URL params if the hideURLParams is not set to true and the product is not a bundle type\n if (\n !hideURLParams &&\n data?.options &&\n !hasProductViewOptionValueProduct(data.options)\n ) {\n setUrlParams({ optionsUIDs: optionsUIDs.join(',') });\n }\n\n // update state\n handleOnValues({ optionsUIDs });\n setValid(optionsUIDs?.length === data?.options?.length);\n\n // get refined product data and update state\n const next = await fetchProductData(sku, {\n anchors: optionsConfig?.anchorOptions,\n isBundle: data?.isBundle,\n optionsUIDs,\n preselectFirstOption: !disableDropdownPreselection,\n });\n\n setData(next);\n\n // special processing for anchor options (options that should not be refined when other options are selected)\n if (optionsConfig?.anchorOptions?.length) {\n processUpdates(next, optionsUIDs);\n }\n },\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [sku]\n );\n\n const processUpdates = useCallback(\n (next: ProductModel | null, previousOptionsUIDs: string[]) => {\n const updatedOptionsUIDs = next?.optionUIDs ?? [];\n const haveSameValues = previousOptionsUIDs.every((item) =>\n updatedOptionsUIDs.includes(item)\n );\n if (!haveSameValues) {\n setSelectionsToUpdate(next?.options);\n handleOnValues({ optionsUIDs: updatedOptionsUIDs });\n setValid(updatedOptionsUIDs?.length === next?.options?.length);\n }\n },\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [sku]\n );\n\n const handleOnErrors = useCallback((_errors: { [id: string]: string }) => {\n if (Object.keys(_errors).length !== 0) setValid(false);\n }, []);\n\n // Product Attributes\n const attributes = useMemo(() => {\n return data?.attributes?.map(({ label, value, id }, key: number) => {\n // Return empty string for gift card attributes\n if (id === 'ac_giftcard') {\n return '';\n }\n\n const __html = isDateValid(value)\n ? toDateString(value, locale)\n : value.toString();\n\n return (\n <li key={key}>\n {/* eslint-disable-next-line react/no-danger */}\n {label}: <span dangerouslySetInnerHTML={{ __html }} />\n </li>\n );\n });\n }, [data?.attributes, locale]);\n\n const quantity =\n !hideQuantity && data?.inStock ? (\n <Slot\n name=\"Quantity\"\n slot={slots?.Quantity}\n context={{ ...defaultSlotContext }}\n >\n <Incrementer\n key=\"quantity\"\n name=\"quantity\"\n defaultValue={values.quantity.toString()}\n value={values.quantity.toString()}\n min={1}\n aria-label={IncrementerLabel}\n className=\"pdp-product__quantity\"\n onValue={(quantity) => {\n const quantityValue = Number(quantity);\n handleOnValues({ quantity: quantityValue });\n\n // Add quantity to URL parameters if not set to hide\n if (!hideURLParams && data?.options) {\n // Only update URL if the product is not a bundle type\n if (!hasProductViewOptionValueProduct(data.options)) {\n setUrlParams({ quantity: quantityValue });\n }\n }\n }}\n />\n </Slot>\n ) : undefined;\n\n const renderOptions = () => {\n if (data?.options) {\n return (\n <Slot\n name=\"Options\"\n slot={slots?.Options}\n context={{ ...defaultSlotContext }}\n >\n <Swatches\n selectedUIDs={values.optionsUIDs}\n options={data.options}\n defaultOptions={values.optionsUIDs}\n selectionsToUpdate={selectionsToUpdate}\n hideSelectedValue={hideSelectedOptionValue}\n disablePreselections={disableDropdownPreselection}\n onValues={handleOptionSelected}\n onErrors={handleOnErrors}\n />\n </Slot>\n );\n }\n };\n\n const renderGiftCardOptions = () => {\n if (data?.attributes) {\n const giftCardAttributes = data.attributes.filter(\n (attr) => attr.id === 'ac_giftcard'\n );\n\n if (giftCardAttributes.length > 0) {\n const giftCardElements = giftCardAttributes.map(\n (giftCardAttr, index) => {\n try {\n const giftCardData = JSON.parse(giftCardAttr.value);\n const prevOptions = values.enteredOptions || [];\n const optionValues =\n giftCardData.options?.map((option: any) => {\n const existingOption = prevOptions.find(\n (opt: { uid: string; value: string }) =>\n opt.uid === option.uid\n );\n return {\n id: option.uid,\n value: existingOption?.value || '',\n };\n }) || [];\n\n return (\n <GiftCardOptions\n key={`giftcard-${index}`}\n options={giftCardData.options || []}\n optionValues={optionValues}\n onOptionChange={(uid: string, value: string) => {\n const prevOptions = values.enteredOptions || [];\n const idx = prevOptions.findIndex(\n (field: { uid: string; value: string }) =>\n field.uid === uid\n );\n let newEnteredOptions;\n if (idx !== -1) {\n newEnteredOptions = prevOptions.map(\n (field: { uid: string; value: string }) =>\n field.uid === uid ? { ...field, value } : field\n );\n } else {\n newEnteredOptions = [...prevOptions, { uid, value }];\n }\n\n handleOnValues({ enteredOptions: newEnteredOptions });\n\n if (data) {\n const updatedData = { ...data };\n const giftCardAttributes =\n updatedData.attributes?.map((attr) => {\n if (attr.id === 'ac_giftcard') {\n try {\n const giftCardData = JSON.parse(attr.value);\n const updatedOptions =\n giftCardData.options?.map((option: any) => {\n if (option.uid === uid) {\n return { ...option, value };\n }\n return option;\n }) || [];\n return {\n ...attr,\n value: JSON.stringify({\n ...giftCardData,\n options: updatedOptions,\n }),\n };\n } catch (error) {\n return attr;\n }\n }\n return attr;\n }) || [];\n updatedData.attributes = giftCardAttributes;\n setData(updatedData);\n }\n }}\n onValidationChange={(valid: boolean) => {\n if (!valid) {\n handleOnErrors({ giftCard: 'Invalid gift card data' });\n }\n\n setValid(valid);\n }}\n className=\"pdp-product__gift-card-options\"\n />\n );\n } catch (error) {\n console.warn('Invalid gift card data format:', error);\n return null;\n }\n }\n );\n\n // Filter out null values and return a single element\n const validElements = giftCardElements.filter(\n (element) => element !== null\n );\n return validElements.length > 0 ? (\n <div className=\"pdp-product__gift-card-options-container\">\n {validElements}\n </div>\n ) : undefined;\n }\n }\n return undefined;\n };\n\n const renderDownloadableOptions = () => {\n if (data?.attributes) {\n const downloadableAttributes = data.attributes.filter(\n (attr) =>\n attr.id === 'ac_downloadable' &&\n attr.roles?.includes('visible_in_pdp')\n );\n\n if (downloadableAttributes.length > 0) {\n const downloadableElements = downloadableAttributes.map(\n (downloadableAttr, index) => {\n try {\n const downloadableValue =\n typeof downloadableAttr.value === 'string'\n ? JSON.parse(downloadableAttr.value)\n : downloadableAttr.value;\n\n return (\n <DownloadableOptions\n key={`downloadable-${index}`}\n label={downloadableAttr.label}\n value={downloadableValue}\n onLinkChange={(uid: string, selected: boolean) => {\n const prevUIDs = values.optionsUIDs || [];\n let newOptionsUIDs;\n\n if (selected) {\n if (!prevUIDs.includes(uid)) {\n newOptionsUIDs = [...prevUIDs, uid];\n } else {\n newOptionsUIDs = prevUIDs;\n }\n } else {\n newOptionsUIDs = prevUIDs.filter(\n (id: string) => id !== uid\n );\n }\n\n handleOnValues({ optionsUIDs: newOptionsUIDs });\n }}\n currency={data.prices?.final?.currency}\n className=\"pdp-product__downloadable-options\"\n />\n );\n } catch (error) {\n console.warn('Invalid downloadable data format:', error);\n return null;\n }\n }\n );\n\n // Filter out null values and return a wrapper div\n const validElements = downloadableElements.filter(\n (element) => element !== null\n );\n return validElements.length > 0 ? (\n <div className=\"pdp-product__downloadable-options-container\">\n {validElements}\n </div>\n ) : undefined;\n }\n }\n return undefined;\n };\n\n return (\n <div {...props}>\n <Product\n title={\n <Slot\n name=\"Title\"\n slot={slots?.Title}\n context={{ ...defaultSlotContext }}\n >\n {data?.name}\n </Slot>\n }\n sku={\n !hideSku ? (\n <Slot\n name=\"SKU\"\n slot={slots?.SKU}\n context={{ ...defaultSlotContext }}\n >\n {data?.sku}\n </Slot>\n ) : undefined\n }\n options={renderOptions()}\n giftCardOptions={renderGiftCardOptions()}\n downloadableOptions={renderDownloadableOptions()}\n breadcrumbs={\n slots?.Breadcrumbs && (\n <Slot\n name=\"Breadcrumbs\"\n slot={slots?.Breadcrumbs}\n context={{\n ...defaultSlotContext,\n\n setSeparator(callback) {\n this._registerMethod((...attrs) => {\n const nextSeparator = callback(...attrs);\n\n const separator = nextSeparator && (\n <Icon source={nextSeparator} />\n );\n\n this._setProps((prev: any) => {\n return {\n ...prev,\n separator,\n children: [\n // eslint-disable-next-line react/jsx-key\n <Breadcrumbs\n separator={separator}\n categories={prev.categories}\n />,\n ],\n };\n });\n });\n },\n\n appendLink(callback) {\n this._registerMethod((...attrs) => {\n const { text, ...p } = callback(...attrs);\n\n const link = <a {...p}>{text}</a>;\n\n this._setProps((prev: any) => {\n const categories = [...(prev.categories || []), link];\n return {\n ...prev,\n categories,\n children: [\n // eslint-disable-next-line react/jsx-key\n <Breadcrumbs\n separator={prev.separator}\n categories={categories}\n />,\n ],\n };\n });\n });\n },\n\n appendHTMLElement(callback) {\n this._registerMethod((...attrs) => {\n const domElement = callback(...attrs);\n\n const vnode = this._htmlElementToVNode(domElement);\n\n this._setProps((prev: any) => {\n const categories = [...(prev.categories || []), vnode];\n\n return {\n ...prev,\n categories,\n children: [\n // eslint-disable-next-line react/jsx-key\n <Breadcrumbs\n separator={prev.separator}\n categories={categories}\n />,\n ],\n };\n });\n });\n },\n }}\n />\n )\n }\n quantity={quantity}\n actions={\n <Slot\n name=\"Actions\"\n slot={slots?.Actions}\n context={{\n ...defaultSlotContext,\n\n appendButton(callback) {\n this._registerMethod((...attrs) => {\n const _button = callback(...attrs);\n\n if (!_button) return;\n\n const { text, icon, ...buttonProps } = _button;\n\n const button = (\n <Button\n type=\"button\"\n {...buttonProps}\n icon={icon && <Icon source={icon} />}\n >\n {text}\n </Button>\n );\n\n this._setProps((prev: any) => ({\n children: [...(prev.children || []), button],\n }));\n });\n },\n }}\n >\n {\n // Default Add to Cart button if no slot is provided\n !slots?.Actions && (\n <Button\n size=\"medium\"\n type=\"submit\"\n icon={<Icon source=\"Cart\" />}\n disabled={!data?.inStock || !valid}\n aria-label={AddToCartLabel}\n onClick={() => {\n return onAddToCart?.(values);\n }}\n >\n {AddToCartLabel}\n </Button>\n )\n }\n </Slot>\n }\n shortDescription={\n !hideShortDescription ? (\n <Slot\n name=\"ShortDescription\"\n slot={slots?.ShortDescription}\n context={{ ...defaultSlotContext }}\n >\n <div\n // eslint-disable-next-line react/no-danger\n dangerouslySetInnerHTML={{\n __html: data?.shortDescription ?? '',\n }}\n />\n </Slot>\n ) : undefined\n }\n description={\n !hideDescription ? (\n <Slot\n name=\"Description\"\n slot={slots?.Description}\n context={{ ...defaultSlotContext }}\n >\n <div\n // eslint-disable-next-line react/no-danger\n dangerouslySetInnerHTML={{ __html: data?.description ?? '' }}\n />\n </Slot>\n ) : undefined\n }\n images={\n data?.images?.map(({ label, url }) => (\n <Image\n key={url}\n title={label}\n alt={label}\n src={url}\n // TODO: change width/height for image aspect ratio\n // pending https://jira.corp.adobe.com/browse/DATA-5122\n width={carousel?.imageParams?.width ?? 960}\n height={carousel?.imageParams?.height ?? 1191}\n params={carousel?.imageParams ?? { width: 960 }}\n />\n )) ?? []\n }\n specialPrice={\n data?.prices?.visible ? (\n <Slot\n name=\"SpecialPrice\"\n slot={slots?.SpecialPrice}\n context={{ ...defaultSlotContext }}\n >\n <PriceRange\n {...data.prices?.final}\n locale={toLanguageTag(locale)}\n />\n </Slot>\n ) : undefined\n }\n price={\n data?.prices?.visible &&\n data?.prices?.regular &&\n data?.prices?.final?.amount !== data?.prices?.regular?.amount ? (\n <Slot\n name=\"RegularPrice\"\n slot={slots?.RegularPrice}\n context={{ ...defaultSlotContext }}\n >\n <PriceRange\n {...data.prices?.regular}\n locale={toLanguageTag(locale)}\n />\n </Slot>\n ) : undefined\n }\n zoomType={zoomType}\n closeButton={closeButton}\n carouselConfig={{\n ...carousel,\n thumbnails:\n carousel && Object.keys(carousel).length\n ? data?.images?.map(({ label, url }) => (\n <Image\n key={url}\n title={label}\n alt={label}\n src={url}\n // TODO: change width/height for image aspect ratio\n // pending https://jira.corp.adobe.com/browse/DATA-5122\n width={carousel?.thumbnailParams?.width ?? 200}\n height={carousel?.thumbnailParams?.height ?? 248}\n params={carousel?.thumbnailParams ?? { width: 200 }}\n />\n )) ?? []\n : [],\n }}\n outOfStock={!data?.inStock}\n attributes={\n !hideAttributes ? (\n <Slot\n name=\"Attributes\"\n slot={slots?.Attributes}\n context={{ ...defaultSlotContext }}\n >\n {attributes?.length ? (\n <>\n {DetailsLabel}\n <ul>{attributes}</ul>\n </>\n ) : null}\n </Slot>\n ) : undefined\n }\n galleryContent={\n slots?.GalleryContent && (\n <Slot\n name=\"GalleryContent\"\n slot={slots.GalleryContent}\n context={{ ...defaultSlotContext }}\n />\n )\n }\n infoContent={\n slots?.InfoContent && (\n <Slot\n name=\"InfoContent\"\n slot={slots.InfoContent}\n context={{ ...defaultSlotContext }}\n />\n )\n }\n productContent={\n slots?.Content && (\n <Slot\n name=\"Content\"\n slot={slots.Content}\n context={{ ...defaultSlotContext }}\n />\n )\n }\n />\n </div>\n );\n};\n\n/** @deprecated This method is part of the deprecated ProductDetails component. */\nProductDetails.getInitialData = async function ({\n sku,\n disableDropdownPreselection = false,\n optionsConfig,\n}) {\n const initialData = config.getConfig().models?.ProductDetails?.initialData;\n\n return initialData\n ? transformProductData(initialData)\n : fetchProductData(sku, {\n preselectFirstOption: !disableDropdownPreselection,\n anchors: optionsConfig?.anchorOptions,\n });\n};\n"],"names":["Product","title","breadcrumbs","galleryContent","infoContent","productContent","sku","outOfStock","shortDescription","description","attributes","images","options","giftCardOptions","downloadableOptions","price","specialPrice","className","children","quantity","actions","carouselConfig","zoomType","closeButton","props","RegularPriceLabel","useText","SpecialPriceLabel","OutOfStockLabel","ImagesLabel","zoom","setZoom","useState","galleryImages","image","key","alt","_a","jsx","Zoom","VComponent","localThumbnailsImages","jsxs","classes","_b","Carousel","_c","_d","GalleryGrid","_e","_f","_g","_h","_i","Overlay","gap","style","count","Children","child","ProductDetails","hideSku","hideQuantity","hideShortDescription","hideDescription","hideAttributes","hideURLParams","hideSelectedOptionValue","slots","initialData","carousel","optionsConfig","useACDL","onAddToCart","disableDropdownPreselection","AddToCartLabel","IncrementerLabel","DetailsLabel","ChooseOptionLabel","locale","setLocale","config","selectionsToUpdate","setSelectionsToUpdate","data","setData","values","setValues","initialQuantity","getValidatedQuantityFromUrl","defaultValues","valid","setValid","defaultSlotContext","hasProductViewOptionValueProduct","option","useEffect","dataEvent","events","payload","prev","updateDataEvent","localeEvent","fetchProductData","publishProductPageViewEvent","handleOnValues","useCallback","newValues","handleOptionSelected","selections","optionsUIDs","_","value","id","element","setUrlParams","next","processUpdates","previousOptionsUIDs","updatedOptionsUIDs","item","handleOnErrors","_errors","useMemo","label","__html","isDateValid","toDateString","Slot","Incrementer","quantityValue","renderOptions","Swatches","renderGiftCardOptions","giftCardAttributes","attr","validElements","giftCardAttr","index","giftCardData","prevOptions","optionValues","existingOption","opt","GiftCardOptions","uid","idx","field","newEnteredOptions","updatedData","updatedOptions","error","renderDownloadableOptions","downloadableAttributes","downloadableAttr","downloadableValue","DownloadableOptions","selected","prevUIDs","newOptionsUIDs","callback","attrs","nextSeparator","separator","Icon","Breadcrumbs","text","p","link","categories","domElement","vnode","_button","icon","buttonProps","button","Button","url","Image","PriceRange","toLanguageTag","_j","_k","Fragment","transformProductData"],"mappings":"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"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { HTMLAttributes } from 'preact/compat';
|
|
2
|
+
import { Container } from '@dropins/tools/types/elsie/src/lib';
|
|
3
|
+
import { ProductModel } from '../../data/models';
|
|
4
|
+
|
|
5
|
+
export interface ProductDownloadableOptionsProps extends HTMLAttributes<HTMLDivElement> {
|
|
6
|
+
scope?: string;
|
|
7
|
+
}
|
|
8
|
+
export declare const ProductDownloadableOptions: Container<ProductDownloadableOptionsProps, ProductModel | null>;
|
|
9
|
+
//# sourceMappingURL=ProductDownloadableOptions.d.ts.map
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* ADOBE CONFIDENTIAL
|
|
3
|
+
* __________________
|
|
4
|
+
* Copyright 2024 Adobe
|
|
5
|
+
* All Rights Reserved.
|
|
6
|
+
* __________________
|
|
7
|
+
* NOTICE: All information contained herein is, and remains
|
|
8
|
+
* the property of Adobe and its suppliers, if any. The intellectual
|
|
9
|
+
* and technical concepts contained herein are proprietary to Adobe
|
|
10
|
+
* and its suppliers and are protected by all applicable intellectual
|
|
11
|
+
* property laws, including trade secret and copyright laws.
|
|
12
|
+
* Dissemination of this information or reproduction of this material
|
|
13
|
+
* is strictly forbidden unless prior written permission is obtained
|
|
14
|
+
* from Adobe.
|
|
15
|
+
*/
|
|
16
|
+
export * from './ProductDownloadableOptions';
|
|
17
|
+
export { ProductDownloadableOptions as default } from './ProductDownloadableOptions';
|
|
18
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
/*! Copyright 2026 Adobe
|
|
2
|
+
All Rights Reserved. */
|
|
3
|
+
import{jsx as r}from"@dropins/tools/preact-jsx-runtime.js";import{classes as p}from"@dropins/tools/lib.js";import{s as f}from"../chunks/getProductConfigurationValues.js";import"@dropins/tools/event-bus.js";import{g as D}from"../chunks/getFetchedProductData.js";import{D as b}from"../chunks/DownloadableOptions2.js";import{u as g,g as h}from"../chunks/useProductData.js";import"@dropins/tools/preact-compat.js";import"@dropins/tools/components.js";/* empty css */import"@dropins/tools/i18n.js";const I=({initialData:c=null,scope:m,children:w,...o})=>{const{data:s,values:u}=g({scope:m,initialData:c,initialValues:{optionsUIDs:[]}}),d=(e,l)=>{const t=u.optionsUIDs||[];let a;l?t.includes(e)?a=t:a=[...t,e]:a=t.filter(n=>n!==e),f(n=>({...n,optionsUIDs:a}))},i=h(s,"ac_downloadable");return!s||i.length===0?null:r("div",{...o,className:p(["pdp-downloadable-options",o.className]),children:i.map((e,l)=>{var t,a;return r(b,{label:e.label,value:e.value,onLinkChange:d,currency:(a=(t=s.prices)==null?void 0:t.final)==null?void 0:a.currency,className:o.className},`downloadable-${l}`)})})};I.getInitialData=D;export{I as ProductDownloadableOptions,I as default};
|
|
4
|
+
//# sourceMappingURL=ProductDownloadableOptions.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ProductDownloadableOptions.js","sources":["/@dropins/storefront-pdp/src/containers/ProductDownloadableOptions/ProductDownloadableOptions.tsx"],"sourcesContent":["/**\n * ADOBE CONFIDENTIAL\n * __________________\n * Copyright 2024 Adobe\n * All Rights Reserved.\n * __________________\n * NOTICE: All information contained herein is, and remains\n * the property of Adobe and its suppliers, if any. The intellectual\n * and technical concepts contained herein are proprietary to Adobe\n * and its suppliers and are protected by all applicable intellectual\n * property laws, including trade secret and copyright laws.\n * Dissemination of this information or reproduction of this material\n * is strictly forbidden unless prior written permission is obtained\n * from Adobe.\n */\n\nimport { HTMLAttributes } from 'preact/compat';\nimport { Container, classes } from '@adobe-commerce/elsie/lib';\nimport { ProductModel } from '@/pdp/data/models';\nimport {\n getFetchedProductData,\n setProductConfigurationValues,\n} from '@/pdp/api';\nimport { DownloadableOptions } from '@/pdp/components/DownloadableOptions';\nimport { useProductData, getAttributesById } from '@/pdp/lib/useProductData';\n\nexport interface ProductDownloadableOptionsProps\n extends HTMLAttributes<HTMLDivElement> {\n scope?: string;\n}\n\nexport const ProductDownloadableOptions: Container<\n ProductDownloadableOptionsProps,\n ProductModel | null\n> = ({ initialData = null, scope, children, ...props }) => {\n const { data, values } = useProductData({\n scope,\n initialData,\n initialValues: { optionsUIDs: [] },\n });\n\n const handleLinkChange = (uid: string, selected: boolean) => {\n const prevUIDs = values.optionsUIDs || [];\n let newOptionsUIDs;\n\n if (!selected) {\n newOptionsUIDs = prevUIDs.filter((id) => id !== uid);\n } else if (prevUIDs.includes(uid)) {\n newOptionsUIDs = prevUIDs;\n } else {\n newOptionsUIDs = [...prevUIDs, uid];\n }\n\n setProductConfigurationValues((prev) => ({\n ...prev,\n optionsUIDs: newOptionsUIDs,\n }));\n };\n\n const downloadableAttributes = getAttributesById(data, 'ac_downloadable');\n\n if (!data) return null;\n\n if (downloadableAttributes.length === 0) return null;\n\n return (\n <div\n {...props}\n className={classes(['pdp-downloadable-options', props.className])}\n >\n {downloadableAttributes.map((downloadable, index) => (\n <DownloadableOptions\n key={`downloadable-${index}`}\n label={downloadable.label}\n value={downloadable.value}\n onLinkChange={handleLinkChange}\n currency={data.prices?.final?.currency}\n className={props.className}\n />\n ))}\n </div>\n );\n};\n\nProductDownloadableOptions.getInitialData = getFetchedProductData;\n"],"names":["ProductDownloadableOptions","initialData","scope","children","props","data","values","useProductData","handleLinkChange","uid","selected","prevUIDs","newOptionsUIDs","id","setProductConfigurationValues","prev","downloadableAttributes","getAttributesById","jsx","classes","downloadable","index","DownloadableOptions","_b","_a","getFetchedProductData"],"mappings":"ugBA+Ba,MAAAA,EAGT,CAAC,CAAE,YAAAC,EAAc,KAAM,MAAAC,EAAO,SAAAC,EAAU,GAAGC,KAAY,CACzD,KAAM,CAAE,KAAAC,EAAM,OAAAC,CAAO,EAAIC,EAAe,CACtC,MAAAL,EACA,YAAAD,EACA,cAAe,CAAE,YAAa,CAAG,CAAA,CAAA,CAClC,EAEKO,EAAmB,CAACC,EAAaC,IAAsB,CACrD,MAAAC,EAAWL,EAAO,aAAe,CAAC,EACpC,IAAAM,EAECF,EAEMC,EAAS,SAASF,CAAG,EACbG,EAAAD,EAEAC,EAAA,CAAC,GAAGD,EAAUF,CAAG,EAJlCG,EAAiBD,EAAS,OAAQE,GAAOA,IAAOJ,CAAG,EAOrDK,EAA+BC,IAAU,CACvC,GAAGA,EACH,YAAaH,CAAA,EACb,CACJ,EAEMI,EAAyBC,EAAkBZ,EAAM,iBAAiB,EAIpE,MAFA,CAACA,GAEDW,EAAuB,SAAW,EAAU,KAG9CE,EAAC,MAAA,CACE,GAAGd,EACJ,UAAWe,EAAQ,CAAC,2BAA4Bf,EAAM,SAAS,CAAC,EAE/D,SAAuBY,EAAA,IAAI,CAACI,EAAcC,IACzC,SAAA,OAAAH,EAACI,EAAA,CAEC,MAAOF,EAAa,MACpB,MAAOA,EAAa,MACpB,aAAcZ,EACd,UAAUe,GAAAC,EAAAnB,EAAK,SAAL,YAAAmB,EAAa,QAAb,YAAAD,EAAoB,SAC9B,UAAWnB,EAAM,SAAA,EALZ,gBAAgBiB,CAAK,EAO7B,EAAA,CAAA,CACH,CAEJ,EAEArB,EAA2B,eAAiByB"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/*! Copyright 2026 Adobe
|
|
2
2
|
All Rights Reserved. */
|
|
3
|
-
import{jsx as A,jsxs as K}from"@dropins/tools/preact-jsx-runtime.js";import{useState as R,useEffect as U,useMemo as w}from"@dropins/tools/preact-compat.js";import{Slot as Z}from"@dropins/tools/lib.js";import{Image as j}from"@dropins/tools/components.js";import{events as V}from"@dropins/tools/event-bus.js";import{g as W}from"../chunks/getFetchedProductData.js";import{Z as X,C as v,O as Y}from"../chunks/Zoom.js";/* empty css */import"@dropins/tools/preact-hooks.js";/* empty css */import{useText as $}from"@dropins/tools/i18n.js";import"@dropins/tools/preact.js";const s=({initialData:G=null,scope:I,controls:k="dots",loop:C=!0,peak:H=!1,gap:N=null,arrows:Q=!0,arrowsOnMainImage:F=!1,zoom:h=!1,imageParams:t,thumbnailParams:o,children:L,slots:l,...q})=>{var y,T,_,S,D,E;const
|
|
3
|
+
import{jsx as A,jsxs as K}from"@dropins/tools/preact-jsx-runtime.js";import{useState as R,useEffect as U,useMemo as w}from"@dropins/tools/preact-compat.js";import{Slot as Z}from"@dropins/tools/lib.js";import{Image as j}from"@dropins/tools/components.js";import{events as V}from"@dropins/tools/event-bus.js";import{g as W}from"../chunks/getFetchedProductData.js";import{Z as X,C as v,O as Y}from"../chunks/Zoom.js";/* empty css */import"@dropins/tools/preact-hooks.js";/* empty css *//* empty css */import{useText as $}from"@dropins/tools/i18n.js";import"@dropins/tools/preact.js";const s=({initialData:G=null,scope:I,controls:k="dots",loop:C=!0,peak:H=!1,gap:N=null,arrows:Q=!0,arrowsOnMainImage:F=!1,zoom:h=!1,imageParams:t,thumbnailParams:o,children:L,slots:l,...q})=>{var y,T,_,S,D,E;const n=$("PDP.Product.Image.label").label,[e,z]=R(G),[f,B]=R(null);U(()=>{const r=V.on("pdp/data",z,{scope:I});return()=>{r==null||r.off()}},[I]);const g=w(()=>({data:e}),[e]),x=w(()=>{var r;return((r=e==null?void 0:e.images)==null?void 0:r.map(({label:i,url:c},p)=>{const d=({...u})=>{var O;const M={title:i,src:c,alt:n==null?void 0:n.replace("{product}",i).replace("{key}",String(p+1)).replace("{total}",String((O=e==null?void 0:e.images)==null?void 0:O.length)),width:(t==null?void 0:t.width)??960,height:(t==null?void 0:t.height)??1191,params:t??{width:960},loading:p===0?"eager":"lazy",...u};return A(Z,{name:"CarouselMainImage",slot:l==null?void 0:l.CarouselMainImage,context:{...g,defaultImageProps:M},children:A(j,{...M})})};return h?A(X,{closeButton:typeof h=="object"?h.closeButton:!1,children:A(d,{})},c):A(d,{onClick:()=>B(p)},c)}))??A("img",{src:"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7",className:"pdp-product-gallery__images__placeholder",width:(t==null?void 0:t.width)??960,height:(t==null?void 0:t.height)??1191,"aria-hidden":!0},"pleaceholder")},[n,e==null?void 0:e.images,t,h,g,l==null?void 0:l.CarouselMainImage]),J=w(()=>{var r;return((r=e==null?void 0:e.images)==null?void 0:r.map(({label:i,url:c},p)=>{var u;const d={title:i,src:c,alt:n==null?void 0:n.replace("{product}",i).replace("{key}",String(p+1)).replace("{total}",String((u=e==null?void 0:e.images)==null?void 0:u.length)),width:(o==null?void 0:o.width)??200,height:(o==null?void 0:o.height)??248,params:o??{width:200},loading:"lazy"};return A(Z,{name:"CarouselThumbnail",slotTag:"span",contentTag:"span",slot:l==null?void 0:l.CarouselThumbnail,context:{...g,defaultImageProps:d},children:A(j,{...d})},c)}))??A("img",{src:"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7",className:"pdp-product-gallery__thumbnail__placeholder",width:(o==null?void 0:o.width)??200,height:(o==null?void 0:o.height)??248,"aria-hidden":!0},"pleaceholder")},[n,e==null?void 0:e.images,o,g,l==null?void 0:l.CarouselThumbnail]);return e?K("div",{...q,children:[A(v,{arrows:!!((y=e==null?void 0:e.images)!=null&&y.length)&&Q,arrowsOnMainImage:F,controls:(T=e==null?void 0:e.images)!=null&&T.length?k:void 0,loop:C&&!!((_=e.images)!=null&&_.length),peak:!!((S=e==null?void 0:e.images)!=null&&S.length)&&H,gap:N,defaultIndex:f||0,thumbnails:J,children:x}),f===null?null:A(Y,{onClose:()=>B(null),centered:!0,children:A(v,{arrows:!!((D=e==null?void 0:e.images)!=null&&D.length),width:"100%",height:"100%",defaultIndex:f,loop:C&&!!((E=e.images)!=null&&E.length),controls:"dots",isZoomed:!0,children:x})})]}):null};s.getInitialData=W;export{s as ProductGallery,s as default};
|
|
4
4
|
//# sourceMappingURL=ProductGallery.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ProductGallery.js","sources":["/@dropins/storefront-pdp/src/containers/ProductGallery/ProductGallery.tsx"],"sourcesContent":["import { HTMLAttributes, useEffect, useMemo, useState } from 'preact/compat';\nimport {\n Container,\n ResolveImageUrlOptions,\n Slot,\n SlotProps,\n} from '@adobe-commerce/elsie/lib';\n\nimport { Image, ImageProps } from '@adobe-commerce/elsie/components';\nimport { events } from '@adobe-commerce/event-bus';\nimport { ProductModel } from '@/pdp/data/models/product-model';\nimport { getFetchedProductData } from '@/pdp/api';\nimport { useText } from '@adobe-commerce/elsie/i18n';\nimport { Carousel, Overlay, Zoom } from '@/pdp/components';\n\ntype DefaultSlotContext = {\n data: ProductModel | null;\n};\n\nexport interface ProductGalleryProps\n extends Omit<HTMLAttributes<HTMLDivElement>, 'controls'> {\n scope?: string;\n controls?: 'thumbnailsRow' | 'thumbnailsColumn' | 'dots' | null;\n loop?: boolean;\n peak?: boolean;\n gap?: 'small' | 'medium' | 'large' | null;\n arrows?: boolean;\n arrowsOnMainImage?: boolean;\n imageParams?: ResolveImageUrlOptions;\n thumbnailParams?: ResolveImageUrlOptions;\n zoom?: { closeButton: boolean } | boolean;\n slots?: {\n CarouselThumbnail?: SlotProps<\n DefaultSlotContext & { defaultImageProps: ImageProps }\n >;\n CarouselMainImage?: SlotProps<\n DefaultSlotContext & { defaultImageProps: ImageProps }\n >;\n };\n}\n\nexport const ProductGallery: Container<\n ProductGalleryProps,\n ProductModel | null\n> = ({\n initialData = null,\n scope,\n controls = 'dots',\n loop = true,\n peak = false,\n gap = null,\n arrows = true,\n arrowsOnMainImage = false,\n zoom = false,\n imageParams,\n thumbnailParams,\n children,\n slots,\n ...props\n}) => {\n const ImagesLabel = useText('PDP.Product.Image.label').label;\n\n const [data, setData] = useState<ProductModel | null>(initialData);\n\n const [zoomTo, setZoomTo] = useState<number | null>(null);\n\n useEffect(() => {\n const dataEvent = events.on('pdp/data', setData, { scope });\n return () => {\n dataEvent?.off();\n };\n }, [scope]);\n\n const defaultSlotContext: DefaultSlotContext = useMemo(\n () => ({ data }),\n [data]\n );\n\n const images = useMemo(\n () =>\n data?.images?.map(({ label, url }, key) => {\n const Item = ({ ...itemProps }) => {\n const defaultProps = {\n title: label,\n src: url,\n alt: ImagesLabel?.replace('{product}', label)\n .replace('{key}', String(key + 1))\n .replace('{total}', String(data?.images?.length)),\n\n // TODO: change width/height for image aspect ratio\n // pending https://jira.corp.adobe.com/browse/DATA-5122\n width: imageParams?.width ?? 960,\n height: imageParams?.height ?? 1191,\n params: imageParams ?? { width: 960 },\n loading: key === 0 ? 'eager' : 'lazy',\n ...itemProps,\n } as const;\n\n return (\n <Slot\n name=\"CarouselMainImage\"\n slot={slots?.CarouselMainImage}\n context={{\n ...defaultSlotContext,\n defaultImageProps: defaultProps,\n }}\n >\n <Image {...defaultProps} />\n </Slot>\n );\n };\n\n return zoom ? (\n <Zoom\n key={url}\n closeButton={typeof zoom === 'object' ? zoom.closeButton : false}\n >\n <Item />\n </Zoom>\n ) : (\n <Item key={url} onClick={() => setZoomTo(key)} />\n );\n }) ?? (\n <img\n key=\"pleaceholder\"\n src=\"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\"\n className=\"pdp-product-gallery__images__placeholder\"\n width={imageParams?.width ?? 960}\n height={imageParams?.height ?? 1191}\n aria-hidden\n />\n ),\n [\n ImagesLabel,\n data?.images,\n imageParams,\n zoom,\n defaultSlotContext,\n slots?.CarouselMainImage,\n ]\n );\n\n const thumbnails = useMemo(() => {\n return (\n data?.images?.map(({ label, url }, key) => {\n const defaultProps = {\n title: label,\n src: url,\n alt: ImagesLabel?.replace('{product}', label)\n .replace('{key}', String(key + 1))\n .replace('{total}', String(data?.images?.length)),\n\n // TODO: change width/height for image aspect ratio\n // pending https://jira.corp.adobe.com/browse/DATA-5122\n width: thumbnailParams?.width ?? 200,\n height: thumbnailParams?.height ?? 248,\n params: thumbnailParams ?? { width: 200 },\n loading: 'lazy',\n } as const;\n\n return (\n <Slot\n key={url}\n name=\"CarouselThumbnail\"\n slotTag=\"span\"\n contentTag=\"span\"\n slot={slots?.CarouselThumbnail}\n context={{\n ...defaultSlotContext,\n defaultImageProps: defaultProps,\n }}\n >\n <Image {...defaultProps} />\n </Slot>\n );\n }) ?? (\n <img\n key=\"pleaceholder\"\n src=\"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\"\n className=\"pdp-product-gallery__thumbnail__placeholder\"\n width={thumbnailParams?.width ?? 200}\n height={thumbnailParams?.height ?? 248}\n aria-hidden\n />\n )\n );\n }, [\n ImagesLabel,\n data?.images,\n thumbnailParams,\n defaultSlotContext,\n slots?.CarouselThumbnail,\n ]);\n\n if (!data) return null;\n\n return (\n <div {...props}>\n {/* Carousel */}\n <Carousel\n arrows={!!data?.images?.length && arrows}\n arrowsOnMainImage={arrowsOnMainImage}\n controls={data?.images?.length ? controls : undefined}\n loop={loop && !!data.images?.length}\n peak={!!data?.images?.length && peak}\n gap={gap}\n defaultIndex={zoomTo || 0}\n thumbnails={thumbnails}\n >\n {images}\n </Carousel>\n\n {/* Zoom Overlay */}\n {zoomTo === null ? null : (\n <Overlay onClose={() => setZoomTo(null)} centered>\n <Carousel\n arrows={!!data?.images?.length}\n width=\"100%\"\n height=\"100%\"\n defaultIndex={zoomTo}\n loop={loop && !!data.images?.length}\n controls=\"dots\"\n isZoomed\n >\n {images}\n </Carousel>\n </Overlay>\n )}\n </div>\n );\n};\n\nProductGallery.getInitialData = getFetchedProductData;\n"],"names":["ProductGallery","initialData","scope","controls","loop","peak","gap","arrows","arrowsOnMainImage","zoom","imageParams","thumbnailParams","children","slots","props","ImagesLabel","useText","data","setData","useState","zoomTo","setZoomTo","useEffect","dataEvent","events","defaultSlotContext","useMemo","images","_a","label","url","key","Item","itemProps","defaultProps","jsx","Slot","Image","Zoom","thumbnails","jsxs","Carousel","_b","_c","_d","Overlay","_e","_f","getFetchedProductData"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"ProductGallery.js","sources":["/@dropins/storefront-pdp/src/containers/ProductGallery/ProductGallery.tsx"],"sourcesContent":["import { HTMLAttributes, useEffect, useMemo, useState } from 'preact/compat';\nimport {\n Container,\n ResolveImageUrlOptions,\n Slot,\n SlotProps,\n} from '@adobe-commerce/elsie/lib';\n\nimport { Image, ImageProps } from '@adobe-commerce/elsie/components';\nimport { events } from '@adobe-commerce/event-bus';\nimport { ProductModel } from '@/pdp/data/models/product-model';\nimport { getFetchedProductData } from '@/pdp/api';\nimport { useText } from '@adobe-commerce/elsie/i18n';\nimport { Carousel, Overlay, Zoom } from '@/pdp/components';\n\ntype DefaultSlotContext = {\n data: ProductModel | null;\n};\n\nexport interface ProductGalleryProps\n extends Omit<HTMLAttributes<HTMLDivElement>, 'controls'> {\n scope?: string;\n controls?: 'thumbnailsRow' | 'thumbnailsColumn' | 'dots' | null;\n loop?: boolean;\n peak?: boolean;\n gap?: 'small' | 'medium' | 'large' | null;\n arrows?: boolean;\n arrowsOnMainImage?: boolean;\n imageParams?: ResolveImageUrlOptions;\n thumbnailParams?: ResolveImageUrlOptions;\n zoom?: { closeButton: boolean } | boolean;\n slots?: {\n CarouselThumbnail?: SlotProps<\n DefaultSlotContext & { defaultImageProps: ImageProps }\n >;\n CarouselMainImage?: SlotProps<\n DefaultSlotContext & { defaultImageProps: ImageProps }\n >;\n };\n}\n\nexport const ProductGallery: Container<\n ProductGalleryProps,\n ProductModel | null\n> = ({\n initialData = null,\n scope,\n controls = 'dots',\n loop = true,\n peak = false,\n gap = null,\n arrows = true,\n arrowsOnMainImage = false,\n zoom = false,\n imageParams,\n thumbnailParams,\n children,\n slots,\n ...props\n}) => {\n const ImagesLabel = useText('PDP.Product.Image.label').label;\n\n const [data, setData] = useState<ProductModel | null>(initialData);\n\n const [zoomTo, setZoomTo] = useState<number | null>(null);\n\n useEffect(() => {\n const dataEvent = events.on('pdp/data', setData, { scope });\n return () => {\n dataEvent?.off();\n };\n }, [scope]);\n\n const defaultSlotContext: DefaultSlotContext = useMemo(\n () => ({ data }),\n [data]\n );\n\n const images = useMemo(\n () =>\n data?.images?.map(({ label, url }, key) => {\n const Item = ({ ...itemProps }) => {\n const defaultProps = {\n title: label,\n src: url,\n alt: ImagesLabel?.replace('{product}', label)\n .replace('{key}', String(key + 1))\n .replace('{total}', String(data?.images?.length)),\n\n // TODO: change width/height for image aspect ratio\n // pending https://jira.corp.adobe.com/browse/DATA-5122\n width: imageParams?.width ?? 960,\n height: imageParams?.height ?? 1191,\n params: imageParams ?? { width: 960 },\n loading: key === 0 ? 'eager' : 'lazy',\n ...itemProps,\n } as const;\n\n return (\n <Slot\n name=\"CarouselMainImage\"\n slot={slots?.CarouselMainImage}\n context={{\n ...defaultSlotContext,\n defaultImageProps: defaultProps,\n }}\n >\n <Image {...defaultProps} />\n </Slot>\n );\n };\n\n return zoom ? (\n <Zoom\n key={url}\n closeButton={typeof zoom === 'object' ? zoom.closeButton : false}\n >\n <Item />\n </Zoom>\n ) : (\n <Item key={url} onClick={() => setZoomTo(key)} />\n );\n }) ?? (\n <img\n key=\"pleaceholder\"\n src=\"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\"\n className=\"pdp-product-gallery__images__placeholder\"\n width={imageParams?.width ?? 960}\n height={imageParams?.height ?? 1191}\n aria-hidden\n />\n ),\n [\n ImagesLabel,\n data?.images,\n imageParams,\n zoom,\n defaultSlotContext,\n slots?.CarouselMainImage,\n ]\n );\n\n const thumbnails = useMemo(() => {\n return (\n data?.images?.map(({ label, url }, key) => {\n const defaultProps = {\n title: label,\n src: url,\n alt: ImagesLabel?.replace('{product}', label)\n .replace('{key}', String(key + 1))\n .replace('{total}', String(data?.images?.length)),\n\n // TODO: change width/height for image aspect ratio\n // pending https://jira.corp.adobe.com/browse/DATA-5122\n width: thumbnailParams?.width ?? 200,\n height: thumbnailParams?.height ?? 248,\n params: thumbnailParams ?? { width: 200 },\n loading: 'lazy',\n } as const;\n\n return (\n <Slot\n key={url}\n name=\"CarouselThumbnail\"\n slotTag=\"span\"\n contentTag=\"span\"\n slot={slots?.CarouselThumbnail}\n context={{\n ...defaultSlotContext,\n defaultImageProps: defaultProps,\n }}\n >\n <Image {...defaultProps} />\n </Slot>\n );\n }) ?? (\n <img\n key=\"pleaceholder\"\n src=\"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\"\n className=\"pdp-product-gallery__thumbnail__placeholder\"\n width={thumbnailParams?.width ?? 200}\n height={thumbnailParams?.height ?? 248}\n aria-hidden\n />\n )\n );\n }, [\n ImagesLabel,\n data?.images,\n thumbnailParams,\n defaultSlotContext,\n slots?.CarouselThumbnail,\n ]);\n\n if (!data) return null;\n\n return (\n <div {...props}>\n {/* Carousel */}\n <Carousel\n arrows={!!data?.images?.length && arrows}\n arrowsOnMainImage={arrowsOnMainImage}\n controls={data?.images?.length ? controls : undefined}\n loop={loop && !!data.images?.length}\n peak={!!data?.images?.length && peak}\n gap={gap}\n defaultIndex={zoomTo || 0}\n thumbnails={thumbnails}\n >\n {images}\n </Carousel>\n\n {/* Zoom Overlay */}\n {zoomTo === null ? null : (\n <Overlay onClose={() => setZoomTo(null)} centered>\n <Carousel\n arrows={!!data?.images?.length}\n width=\"100%\"\n height=\"100%\"\n defaultIndex={zoomTo}\n loop={loop && !!data.images?.length}\n controls=\"dots\"\n isZoomed\n >\n {images}\n </Carousel>\n </Overlay>\n )}\n </div>\n );\n};\n\nProductGallery.getInitialData = getFetchedProductData;\n"],"names":["ProductGallery","initialData","scope","controls","loop","peak","gap","arrows","arrowsOnMainImage","zoom","imageParams","thumbnailParams","children","slots","props","ImagesLabel","useText","data","setData","useState","zoomTo","setZoomTo","useEffect","dataEvent","events","defaultSlotContext","useMemo","images","_a","label","url","key","Item","itemProps","defaultProps","jsx","Slot","Image","Zoom","thumbnails","jsxs","Carousel","_b","_c","_d","Overlay","_e","_f","getFetchedProductData"],"mappings":"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"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/*! Copyright 2026 Adobe
|
|
2
2
|
All Rights Reserved. */
|
|
3
|
-
import{jsx as
|
|
3
|
+
import{jsx as p}from"@dropins/tools/preact-jsx-runtime.js";import{classes as g}from"@dropins/tools/lib.js";import{s as h}from"../chunks/getProductConfigurationValues.js";import"@dropins/tools/event-bus.js";import{s as O}from"../chunks/isProductConfigurationValid.js";import{g as C}from"../chunks/getFetchedProductData.js";import{G as V}from"../chunks/GiftCardOptions2.js";import{u as v,g as x}from"../chunks/useProductData.js";import"@dropins/tools/preact-hooks.js";import"@dropins/tools/components.js";/* empty css */import"@dropins/tools/i18n.js";import"@dropins/tools/preact-compat.js";const P=({initialData:l=null,scope:m,children:N,...e})=>{const{data:r,values:d}=v({scope:m,initialData:l,initialValues:{enteredOptions:[]}}),u=(i,a)=>{const n=d.enteredOptions||[],o=n.findIndex(t=>t.uid===i)!==-1?n.map(t=>t.uid===i?{...t,value:a}:t):[...n,{uid:i,value:a}];h(t=>({...t,enteredOptions:o}))},f=i=>{O(()=>i)};if(!r)return null;const c=x(r,"ac_giftcard");return c.length===0?null:p("div",{...e,className:g(["pdp-gift-card-options",e.className]),children:c.map((i,a)=>{var n,s,o;return p(V,{options:((n=i.value)==null?void 0:n.options)||[],className:e.className,optionValues:(d.enteredOptions||[]).map(t=>({id:t.uid,value:t.value})),currency:(o=(s=r.prices)==null?void 0:s.final)==null?void 0:o.currency,onOptionChange:u,onValidationChange:f},`giftcard-${a}`)})})};P.getInitialData=C;export{P as ProductGiftCardOptions,P as default};
|
|
4
4
|
//# sourceMappingURL=ProductGiftCardOptions.js.map
|