yt-uikit 0.7.378-VolumeBundleVari.0 → 0.7.378-VolumeBundleVari.1

package/dist/esm/index.js

@@ -3876,7 +3876,7 @@ import*as e from"react";import t,{forwardRef as n,useImperativeHandle as r,useRe
   scrollbar-width: none;
 
   -ms-overflow-style: none;
-`,Hf=(e,t)=>{if(!t)return{};for(const n of t)if(n.productId==e)return n;return{}};function Wf({bundle:e,addToCartFunction:n,currentProductId:r}){const s=i(()=>{if(r){const t="gid://shopify/Product/"+r,n=e.products?.some(e=>e.productId===t);return n?t:e.products?.[0]?.productId}return e.products?.[0]?.productId},[r,e.products]),d=i(()=>Hf(s,e.products),[s,e.products]),p=o(null),u=o(null),m=o({}),[f,g]=c(""),h=e.customizations??{},x=(i(()=>d?.productDetails?.variants?.edges?.reduce((e,{node:t})=>t.inventoryQuantity>0?e+=1:e,0),[d]),i(()=>Hf(s,e.products)?.id,[s,e.products]));i(()=>x?Hf(s,e.products):void 0,[s,e.products,x]),i(()=>e.products?.some(e=>e.productDetails?.options?.some(e=>e.values.length>1))||!1,[e.products]),h.volumeBundle;const y=i(()=>e?.volumeTiers||[],[e?.volumeTiers]),b=y.findIndex(e=>e.isDefault),[v,w]=c(-1!==b?y[b].tier:y?.[0]?.tier||1),[C,k]=c(d?.productDetails?.variants?.edges?.[0]?.node?.id||""),[E,T]=c({}),[S,$]=c(y.reduce((e,t,n)=>(e[t.tier-1]=Array.from({length:t.minimumQuantity},()=>d?.productDetails?.options?.map(e=>e.values[0])||[]),e),{})||{}),[B,z]=c(!1),[D,I]=c(window.innerWidth<550),[_,O]=c(null);o([]);const P=o([]);l(()=>{const e=()=>{I(window.innerWidth<550)};return window.addEventListener("resize",e),()=>{window.removeEventListener("resize",e)}},[]),l(()=>{const e=e=>{_&&P.current[_.index]&&P.current[_.index][_.optionIndex]&&!P.current[_.index][_.optionIndex]?.contains(e.target)&&O(null)};return document.addEventListener("mousedown",e),()=>{document.removeEventListener("mousedown",e)}},[_]);const A=a(e=>{if(!h.general?.trackInventory)return null;const t=y.find(t=>t.tier===e);if(!t)return null;const n=t.minimumQuantity,r=d?.productDetails?.variants?.edges||[];for(const e of r){const t=e.node;if(t.inventoryQuantity>=n&&t.availableForSale){const e=t.title.split(" / ");return Array(n).fill(e)}}const o=[],a={},i=[...r].sort((e,t)=>t.node.inventoryQuantity-e.node.inventoryQuantity);for(let e=0;e<n&&o.length<n;e++){let e=!1;for(const t of i){const n=t.node,r=a[n.id]||0;if(n.inventoryQuantity>r&&n.availableForSale){const t=n.title.split(" / ");o.push(t),a[n.id]=r+1,e=!0;break}}if(!e)return null}return o.length===n?o:null},[d,y]),N=a(e=>{if(!h.general?.trackInventory)return!0;const t=y.find(t=>t.tier===e);if(!t)return!1;const n=t.minimumQuantity,r=d?.productDetails?.variants?.edges||[];let o=0;for(const e of r){const t=e.node;t.availableForSale&&(o+=Math.max(0,t.inventoryQuantity))}return o>=n},[h.general?.trackInventory,y,d]);l(()=>{const e={},t=d?.productDetails?.variants?.edges?.[0]?.node?.id||"";t&&y.forEach(n=>{e[n.tier]={};for(let r=0;r<n.minimumQuantity;r++)e[n.tier][r]=t}),T(e)},[d?.id,y?.map(e=>`${e.tier}-${e.minimumQuantity}`).join("|")]),l(()=>{if(!m.current[v]){const e=A(v);if(e){const t=v-1;$(n=>({...n,[t]:e}));const n={};e.forEach((e,t)=>{const r=e.join(" / "),o=d?.productDetails?.variants?.edges?.find(e=>e.node.title===r)?.node.id||C;n[t]=o}),T(e=>({...e,[v]:n}))}m.current[v]=!0}},[v,d,C,A]);const F=(e,t)=>e?.productDetails?.variants?.edges?.find(e=>e.node.id===t)?.node,M=a((e,t,n,r,o)=>{if(!h?.general?.trackInventory)return!0;const a=y.find(t=>t.tier===e);if(!a)return!1;const i=a.minimumQuantity,l=e-1,c=[...n];c[r]=o;const s=c.join(" / "),p=d?.productDetails?.variants?.edges?.find(e=>e.node.title===s)?.node;if(!p||!p.availableForSale||p.inventoryQuantity<=0)return!1;const u={};for(let e=0;e<i;e++){let n;if(e===t)n=p.id;else{const t=(S[l]?.[e]||d.productDetails.options.map(e=>e.values[0])).join(" / "),r=d?.productDetails?.variants?.edges?.find(e=>e.node.title===t);if(!r)return!1;n=r.node.id}u[n]=(u[n]||0)+1}for(const[e,t]of Object.entries(u)){const n=F(d,e);if(n&&t>n.inventoryQuantity)return!1}return!0},[h?.general?.trackInventory,y,d,S]),R=a(e=>{if(!h.general?.trackInventory)return!0;const t=y.find(t=>t.tier===e);if(!t)return!1;const n=t.minimumQuantity,r=e-1,o={};for(let e=0;e<n;e++){const t=(S[r]?.[e]||d.productDetails.options.map(e=>e.values[0])).join(" / "),n=d?.productDetails?.variants?.edges?.find(e=>e.node.title===t);if(!n)return!1;const a=n.node.id;o[a]=(o[a]||0)+1}for(const[e,t]of Object.entries(o)){const n=F(d,e);if(n&&t>n.inventoryQuantity)return!1}return!0},[h.general?.trackInventory,y,d,S]),L=(e,t,n)=>{T(r=>({...r,[e]:{...r[e]||{},[t]:n}}))},j=a(()=>!1===h.general?.trackInventory?d?.productDetails?.variants?.edges?.[0]?.node:d?.productDetails?.variants?.edges?.find(e=>e.node.inventoryQuantity>0)?.node||d?.productDetails?.variants?.edges?.[0]?.node,[d]),V=a(()=>new URLSearchParams(window.location.search).get("variant")||"",[]),H=()=>{const e=V();if(e){const t=d?.productDetails?.variants?.edges?.find(t=>String(t.node.id)==="gid://shopify/ProductVariant/"+String(e));if(t&&t.node.inventoryQuantity>0)k(String(t.node.id));else{const e=j();e&&k(String(e.id))}}};console.log("selected variant",C),l(()=>{const e=()=>{const e=new URL(window.location.href).searchParams.get("variant");g(e),k(e)},t=e=>{const t=history[e];return function(...n){const r=t.apply(this,n);return window.dispatchEvent(new Event(e.toLowerCase())),r}};return history.pushState=t("pushState"),history.replaceState=t("replaceState"),window.addEventListener("pushstate",e),window.addEventListener("replacestate",e),e(),()=>{window.removeEventListener("pushstate",e),window.removeEventListener("replacestate",e)}},[]),l(()=>{H();const e=new Event("urlChange");let t=!0;const n=window.history.pushState,r=window.history.replaceState;return window.history.pushState=function(){t&&(n.apply(this,arguments),window.dispatchEvent(e))},window.history.replaceState=function(){t&&(r.apply(this,arguments),window.dispatchEvent(e))},window.addEventListener("urlChange",H),()=>{t=!1,window.removeEventListener("urlChange",H),window.history.pushState=n,window.history.replaceState=r}},[V,d?.id,j]);const W=t=>{const n=y.find(e=>e.tier===t);if(!n)return{original:0,discounted:0};let r=0,o=0;const a=E[t]||{};for(let e=0;e<n.minimumQuantity;e++){const t=a[e]||C,n=F(d,t);n&&(n.compareAtPrice?r+=Number.parseFloat(n.compareAtPrice):r+=Number.parseFloat(n.price),o+=Number.parseFloat(n.price))}return"percentOff"===e?.discountType?o*=1-n.discountValue/100:"amountOff"===e?.discountType&&(o-=n.discountValue),o<0&&(o=0),{original:r,discounted:o,discountValue:n.discountValue}},U=(e,t,n,r)=>{let o=F(e,t);if(r){const a=E[r]?.[n||0]||t;o=F(e,a)}return o?.image?.url?o.image.url:e.productDetails?.media?.edges[0]?.node?.preview?.image?.url||""},Q=i(()=>y.find(e=>e.tier===v),[y,v]),G=i(()=>Q?W(Q.tier):null,[Q,E,C]),Y=i(()=>{if(!Q||!G)return;const e=E[Q.tier]||{},t={};for(let n=0;n<Q.minimumQuantity;n++){const r=e[n]||C;t[r]=(t[r]||0)+1}return t},[Q?.minimumQuantity,C,E,G]),q=i(()=>Object.entries(Y??{}).map(([e,t])=>({variantId:e,quantity:t})),[Y]);if(l(()=>{if(!Q||!G)return;const e={tier:v,items:Q.minimumQuantity,discountedPrice:G.discounted,originalPrice:G.original,variants:q,productId:d?.id??null,tierMeta:{title:Q.title,subtitle:Q.subtitle,badgeTitle:Q.badgeTitle},productData:d,tierData:Q},t=u.current;return t&&JSON.stringify(t)===JSON.stringify(e)?void 0:(p.current&&clearTimeout(p.current),p.current=window.setTimeout(()=>{u.current=e;const t=new CustomEvent("ytBundleTierChange",{detail:e});window.dispatchEvent(t)},50),()=>{p.current&&clearTimeout(p.current)})},[v,Q?.tier,Q?.minimumQuantity,G?.discounted,G?.original,d?.id,JSON.stringify(q)]),!n)return t.createElement(t.Fragment,null);const Z=h.volumeBundle?.cardStyle,K=h.general?.primaryColor,X=h.general?.secondaryColor,J=h.general.primaryContrastColor,ee=h.general.secondaryContrastColor,te="high"===e.cornerRadiusType?"20px":"medium"===e.cornerRadiusType?"6px":"0px",ne="bundles"==e.appName?e.pageHeader?.title:e?.title,re="bundles"==e.appName?e.pageHeader?.description:e?.subtitle;return t.createElement(ff,{verticalMargin:h.volumeBundle?.verticalMargin,backgroundColor:h.volumeBundle?.sectionBackgroundColor,className:"yt-bundle-container"},t.createElement(gf,{className:"yt-bundle-header"},ne&&ne.trim().length>0&&t.createElement(hf,{fontSize:h.volumeBundle?.titleFontSize,backgroundColor:h.volumeBundle?.titleBackgroundColor,textColor:h.volumeBundle?.titleTextColor,className:"yt-bundle-header-title"},ne),t.createElement(xf,{className:"yt-bundle-header-subtitle",fontSize:h.volumeBundle?.subtitleFontSize},re)),"vertical"===Z?t.createElement("div",{style:{display:"grid",gridTemplateColumns:D||4===y.length?"repeat(2, 1fr)":y.length>4?"repeat(3, 1fr)":`repeat(${y.length}, 1fr)`,justifyItems:"center",gap:D?"10px":"16px",paddingTop:"10px"},className:"yt-bundle-vertical-container"},y.map(n=>{const r=W(n.tier),o=r.original-r.discounted,a=v===n.tier,i=!N(n.tier);return t.createElement(t.Fragment,{key:n.tier},t.createElement("div",{style:{display:"flex",flexDirection:"column",gap:"8px",borderRadius:te||"24px",...a?{border:`2px solid ${K}`}:{border:`1px solid ${X}`},boxShadow:`6px 6px 0px -1px ${a?K:X}20`,...n.badgeTitle&&{position:"relative"},zIndex:5,backgroundColor:i?"#f5f5f5":"white",cursor:i?"not-allowed":"pointer",position:"relative",height:"100%",maxHeight:"350px",width:"100%",opacity:i?.6:1},className:"yt-volume-vertical-tier-item "+(a?"yt-volume-vertical-tier-item-active":""),"data-tier":n.tier,"data-discount-value":r.discountValue,"data-discount-type":e?.discountType,"data-minimum-quantity":n.minimumQuantity,"data-original-price":r.original.toFixed(2),"data-discounted-price":r.discounted.toFixed(2),onClick:()=>!i&&w(n.tier)},n.badgeTitle&&t.createElement("div",{style:{position:"absolute",top:"-15px",zIndex:-1,left:"0",right:"0",width:"80%",textAlign:"center",margin:"0 auto",fontSize:"10px",clipPath:"polygon(2% 0%, 98% 0%, 100% 100%, 0% 100%)",backgroundColor:a?K:X,color:a?J:ee,padding:"2px 0",borderRadius:"12px 12px 0px 0px",lineHeight:"normal"},className:a?"yt-volume-vertical-tier-badge-active":"yt-volume-vertical-tier-badge","data-tier":n.tier,"data-badge-title":n.badgeTitle},n.badgeTitle),t.createElement("div",{style:{position:"relative",width:"100%",display:"flex",justifyContent:"center",height:"fit-content"},className:"yt-volume-vertical-tier-save-badge-container"},0!==r.discountValue&&t.createElement(t.Fragment,null,D&&o&&!!r?.discountValue&&"Enabled"===h.volumeBundle?.discountBadgeVisibility&&t.createElement("div",{style:{lineHeight:"normal",position:"absolute",right:"5px",top:"8px"}},t.createElement(Cf,{primaryBackgroundColorCta:a?K:X,isSelected:a,style:{height:"fit-content",fontSize:"10px",lineHeight:"normal",color:a?J:ee},className:"yt-volume-vertical-tier-save-badge","data-tier":n.tier,"data-discount-value":r.discountValue,"data-discount-type":e?.discountType}," ","percentOff"===e?.discountType?`${r.discountValue}% Off`:`Save ${Lh(h.general.currencySymbol,e.storeCurrencyCode)}${Rh(r.discountValue)}`))),n.imageUrl&&t.createElement("img",{src:n.imageUrl,style:{objectFit:"cover",aspectRatio:"1/1",width:"100%",maxHeight:"160px",maxWidth:"160px",height:"fit-content",borderTopLeftRadius:te||"24px",borderTopRightRadius:te||"24px"},className:"yt-volume-vertical-tier-badge"})),t.createElement("div",{style:{padding:"8px",paddingTop:"0"}},t.createElement(kf,{style:{display:"flex",width:"100%",gap:"4px"},className:"yt-volume-vertical-details-container"},t.createElement("div",{style:{display:"flex",alignItems:"center",position:"relative",width:"100%"},className:"yt-volume-vertical-details-title-container"},t.createElement(Ef,{style:{fontSize:D?"12px":"14px",lineHeight:"normal"},className:"yt-volume-vertical-details-title"},n.title?n.title:t.createElement(t.Fragment,null,"Buy ",n.minimumQuantity,", Get"," ",n.discountValue,"% Off")),!D&&o&&!!r?.discountValue&&"Enabled"===h.volumeBundle?.discountBadgeVisibility&&t.createElement(Cf,{primaryBackgroundColorCta:a?K:X,isSelected:a,style:{height:"fit-content",fontSize:"10px",lineHeight:"normal",color:a?J:ee},className:"yt-volume-vertical-tier-save-badge","data-tier":n.tier,"data-discount-value":r.discountValue,"data-discount-type":e?.discountType}," ","percentOff"===e?.discountType?`${r.discountValue}% Off`:`Save ${Lh(h.general.currencySymbol,e.storeCurrencyCode)}${Rh(r.discountValue)}`),a&&n.imageUrl&&t.createElement("div",{style:{lineHeight:"normal",position:"absolute",right:"0px"},className:"yt-volume-vertical-tier-selected-check"},t.createElement("span",{style:{display:"flex",alignItems:"center",justifyContent:"center",width:"16px",height:"16px",borderRadius:"50%",backgroundColor:K,color:J,padding:"2px"}},t.createElement(fo,{style:{paddingBottom:"1px"},size:20,fontWeight:20})))),t.createElement(Tf,{style:{lineHeight:"normal",fontSize:D?"10px":"14px",color:"#666"},className:"yt-volume-vertical-details-subtitle"},n.subtitle?n.subtitle:t.createElement(t.Fragment,null))),t.createElement(Sf,{style:{textAlign:"left",marginTop:"4px",display:"flex",flexDirection:"row",flexWrap:"wrap",alignItems:"center"},className:"yt-volume-vertical-details-price","data-tier":n.tier,"data-original-price":r.original.toFixed(2),"data-discounted-price":r.discounted.toFixed(2),"data-savings":o.toFixed(2)},t.createElement($f,{style:{marginLeft:"0",lineHeight:"normal",marginRight:"8px"},className:"yt-volume-vertical-details-price-discount"},Lh(h.general.currencySymbol,e.storeCurrencyCode),Rh(r.discounted.toFixed(2))),o?t.createElement(Bf,{style:{lineHeight:"normal"},className:"yt-volume-vertical-details-price-original"},Lh(h.general.currencySymbol,e.storeCurrencyCode),Rh(r.original.toFixed(2))):"")),a&&!n.imageUrl&&t.createElement("div",{style:{lineHeight:"normal",position:"absolute",right:"10px",bottom:"10px"},className:"yt-volume-vertical-tier-selected-check"},t.createElement("span",{style:{display:"flex",alignItems:"center",justifyContent:"center",width:"16px",height:"16px",borderRadius:"50%",backgroundColor:K,color:J,padding:"2px"}},t.createElement(fo,{style:{paddingBottom:"1px"},size:20,fontWeight:20})))))})):t.createElement(t.Fragment,null,y.map(n=>{const r=W(n.tier),o=r.original-r.discounted,a=!N(n.tier);return t.createElement(t.Fragment,{key:n.tier},n.badgeTitle&&t.createElement(yf,{primaryTextColorCta:J,primaryBackgroundColorCta:K,style:{lineHeight:"normal"},className:"yt-volume-horizontal-tier-badge","data-tier":n.tier,"data-badge-title":n.badgeTitle},n.badgeTitle),t.createElement(bf,{cornerRadiusType:e?.cornerRadiusType??"",key:n.tier,primaryBackgroundColorCta:K??"",isSelected:v===n.tier,onClick:()=>w(n.tier),style:{borderRadius:te,cursor:"pointer",backgroundColor:a?"#f5f5f5":"white",opacity:a?.6:1},className:"yt-volume-horizontal-tier-container "+(v===n.tier?"yt-volume-horizontal-tier-container-active":""),"data-tier":n.tier,"data-discount-value":r.discountValue,"data-discount-type":e?.discountType,"data-minimum-quantity":n.minimumQuantity,"data-original-price":r.original.toFixed(2),"data-discounted-price":r.discounted.toFixed(2)},t.createElement(vf,{cornerRadiusType:e?.cornerRadiusType??"",style:{borderRadius:te,borderBottomLeftRadius:"0px",borderBottomRightRadius:"0px"},className:"yt-volume-horizontal-tier-header"},t.createElement(wf,{className:"yt-volume-horizontal-tier-info"},t.createElement(Of,{"data-active":v===n.tier,accentColor:K,className:"yt-volume-horizontal-tier-radio-wrapper"},t.createElement(Pf,{name:"tier",checked:v===n.tier,onChange:()=>!a&&w(n.tier),disabled:a,className:"yt-volume-horizontal-tier-radio-hidden"}),t.createElement(Af,{accentColor:K,className:"yt-volume-horizontal-tier-radio-custom"})),t.createElement(kf,{className:"yt-volume-horizontal-tier-details"},t.createElement("div",{style:{display:"flex"},className:"yt-volume-horizontal-tier-title-container"},t.createElement(Ef,{style:{lineHeight:"normal"},className:"yt-volume-horizontal-tier-title"},n.title?n.title:t.createElement(t.Fragment,null,"Buy ",n.minimumQuantity,", Get"," ",n.discountValue,"% Off")),o&&r?.discountValue&&"Enabled"===h.volumeBundle?.discountBadgeVisibility?t.createElement(Cf,{primaryBackgroundColorCta:K,isSelected:v===n.tier,style:{lineHeight:"normal"},className:"yt-volume-horizontal-tier-save-badge","data-tier":n.tier,"data-discount-value":r.discountValue,"data-discount-type":e?.discountType}," ","percentOff"===e?.discountType?`${r.discountValue}% Off`:`Save ${Lh(h.general.currencySymbol,e.storeCurrencyCode)}${Rh(r.discountValue)}`):""),t.createElement(Tf,{style:{lineHeight:"normal"},className:"yt-volume-horizontal-tier-subtitle"},n.subtitle?n.subtitle:t.createElement(t.Fragment,null)))),t.createElement(Sf,{style:{lineHeight:"normal"},className:"yt-volume-horizontal-tier-price","data-tier":n.tier,"data-original-price":r.original.toFixed(2),"data-discounted-price":r.discounted.toFixed(2),"data-savings":o.toFixed(2)},o?t.createElement(Bf,{style:{lineHeight:"normal"},className:"yt-volume-horizontal-tier-original-price"},Lh(h.general.currencySymbol,e.storeCurrencyCode),Rh(r.original.toFixed(2))):"",t.createElement($f,{className:"yt-volume-horizontal-tier-discounted-price"},Lh(h.general.currencySymbol,e.storeCurrencyCode),Rh(r.discounted.toFixed(2))))),v===n.tier&&t.createElement(zf,{className:"yt-volume-horizontal-tier-product-grid",style:{padding:d.productDetails.variants.edges.length<=1?"0":"10px 15px",gap:d.productDetails.variants.edges.length<=1?"0":"10px"}},Array.from({length:n.minimumQuantity}).map((r,o)=>{const i=n.tier-1,l=(S[i]||[])[o]||d.productDetails.options?.map(e=>e.values[0])||[],c=d?.productDetails?.options.some(e=>e.values.length>1);return t.createElement("div",{key:o,style:{display:"flex",gap:"10px",alignItems:"center",position:"relative"},className:"yt-volume-horizontal-tier-product-item"},c&&t.createElement(Nf,{src:U(d,C,o,n.tier),alt:d?.productDetails?.title||"Product",className:"yt-volume-horizontal-tier-product-image"}),"auto"===h?.volumeBundle?.variantSelectorType?t.createElement("div",{style:{display:"flex",gap:"8px",flexWrap:"wrap"}},d?.productDetails?.options?.map((r,s)=>{if(!c)return null;const p=_?.tier===n.tier&&_?.index===o&&_?.optionIndex===s,u=e?.variantOptions?.options?.find(e=>e.name===r.name);let m="";return"color"===u?.type&&(m=u?.values?.find(e=>e.name===l[s])?.value||""),t.createElement(Lf,{key:s,ref:e=>{P.current[o]||(P.current[o]=[]),P.current[o][s]=e},style:{zIndex:p?1e3:"auto",display:"flex"},isActive:p},t.createElement(jf,{onClick:e=>{e.stopPropagation(),O(p?null:{tier:n.tier,index:o,optionIndex:s})},isActive:p,disabled:a},"color"===u?.type&&m&&t.createElement("div",{className:"yt-fixedBundle-product-card_color-swatch",style:{display:"inline-block",width:20,height:20,borderRadius:"50%",backgroundColor:m||"transparent",border:"1px solid #ddd"}}),l[s],t.createElement(no,null)),p&&t.createElement(Vf,{style:{zIndex:1001}},r.values.map(e=>{const r=[...l];r[s]=e;const c=!M(n.tier,o,l,s,e)||a,p=d.productDetails.variants.edges.find(({node:e})=>e.title===r.join(" / "))?.node,m=e=>{if(c)return void e.stopPropagation();$(e=>{const t={...e},n=[...t[i]||[]];return n[o]=r,t[i]=n,t});const t=p?.id||C;L(n.tier,o,t),O(null)},f=u?.values.find(t=>t.name===e);return"image"===u?.type&&f?.value?t.createElement(Ff,{key:e,onClick:m,style:{opacity:c?.5:1,cursor:c?"not-allowed":"pointer"}},t.createElement(Mf,{src:f.value,alt:e}),e,c&&" (Out of stock)"):"color"===u?.type&&f?.value?t.createElement(Ff,{key:e,onClick:m,style:{opacity:c?.5:1,cursor:c?"not-allowed":"pointer"}},t.createElement(Rf,{style:{backgroundColor:f.value}}),e,c&&"Out of stock"):t.createElement(Ff,{key:e,onClick:m,style:{opacity:c?.5:1,cursor:c?"not-allowed":"pointer"}},e,c&&" (Out of stock)")})))})):t.createElement(Df,{style:{display:"flex",flexDirection:"column",gap:"5px"},className:"yt-volume-horizontal-tier-variant-selector"},d?.productDetails?.options.map((r,c)=>{if(!(r.values.length>1))return null;const s=e.variantOptions?.options?.find(e=>e.name===r.name)||null;return t.createElement("div",{key:r.name,style:{width:"100%",display:"flex",flexDirection:"row",gap:"8px",alignItems:"center"},className:"yt-volume-horizontal-tier-variant-option"},t.createElement("div",{style:{display:"flex",flexDirection:"row",alignItems:"center",gap:"8px",flexWrap:"wrap"},className:"yt-volume-horizontal-tier-variant-values"},r.values.map(e=>{const r=l[c]===e,p=!M(n.tier,o,l,c,e)||a,u=s?.values.find(t=>t.name===e),m=t=>{if(t.preventDefault(),t.stopPropagation(),p)return;const r=[...l];r[c]=e,$(e=>{const t={...e},n=[...t[i]||[]];return n[o]=r,t[i]=n,t});const a=r.join(" / "),s=d.productDetails.variants.edges.find(e=>e.node.title===a)?.node.id||C;L(n.tier,o,s)},f={opacity:p?.5:1,cursor:p?"not-allowed":"pointer"};return"color"===s?.type&&u?.value?t.createElement("button",{key:e,onClick:m,style:{...f,borderRadius:"50%",padding:"1px",backgroundColor:"white",border:r?`1px solid ${h.general?.ctaBackgroundColor||"#121212"}`:"1px solid transparent",lineHeight:"normal"},className:"yt-volume-horizontal-tier-variant-color-button",disabled:p},t.createElement("div",{style:{width:r?"24px":"20px",height:r?"24px":"20px",borderRadius:"50%",backgroundColor:u.value,lineHeight:"normal",boxShadow:"rgba(9, 30, 66, 0.25) 0px 4px 8px -2px, rgba(9, 30, 66, 0.08) 0px 0px 0px 2px"}},t.createElement("span",null))):"image"===s?.type&&u?.value?t.createElement("button",{key:e,onClick:m,style:{...f,border:r?`1px solid ${h.general?.ctaBackgroundColor||"#121212"}`:"1px solid #E4E4E4",borderRadius:"100%",backgroundColor:r?"#F7F7F7":"transparent",padding:"0px",width:r?"20px":"18px",height:r?"20px":"18px",overflow:"hidden"},className:"yt-volume-horizontal-tier-variant-image-button",disabled:p},t.createElement("img",{src:u.value,alt:e,style:{width:r?"26px":"24px",height:r?"26px":"24px",objectFit:"cover",borderRadius:"100%",aspectRatio:"1/1"}})):t.createElement(If,{key:e,isSelected:r,onClick:m,style:{...f,padding:"4px 8px",border:r?`1px solid ${h.general?.ctaBackgroundColor||"#121212"}`:"1px solid #E4E4E4",borderRadius:"16px",backgroundColor:r?"#F7F7F7":"transparent",color:"#707070",cursor:"pointer",fontSize:"12px",fontWeight:"600",lineHeight:"normal"},className:"yt-volume-horizontal-tier-variant-button-default",disabled:p},e)})))})))}))))})),e?.showCta&&t.createElement("div",{style:{position:"relative"}},t.createElement(_f,{bgColor:R(v)?h.general?.ctaBackgroundColor:"#ccc",textColor:R(v)?h.general?.ctaTextColor:"#666",border:`1px solid ${R(v)?h.general?.ctaBorderColor||"#121212":"#999"}`,shadow:h.general.ctaShadowType,padding:h.general?.ctaPadding,width:h.general?.ctaWidth,hoverProperties:{customizeHoverState:!!R(v)&&h.general?.customizeHoverState,backgroundColor:h.general?.ctaHoverBackgroundColor,textColor:h.general?.ctaHoverTextColor},onClick:async()=>{if(R(v))try{z(!0);const e=y.find(e=>e.tier===v);if(!e)return;const t={},r=E[e.tier]||{};for(let n=0;n<e.minimumQuantity;n++){const e=r[n]||C;t[e]?t[e].quantity+=1:t[e]={quantity:1}}const o=W(e.tier),a=Array.from({length:e.minimumQuantity},(e,t)=>r[t]||C);n&&await n(o.original,a)}catch(e){console.error("VolumeBundle handleAddToCart error:",e)}finally{z(!1)}else console.error("Selected tier is out of stock")},borderRadius:h.general.ctaBorderRadius??"",disabled:B||!R(v),className:"yt-volume-add-to-cart-button"},R(v)?t.createElement(t.Fragment,null,B?t.createElement(aa,{color:"white",loading:B,size:15,"aria-label":"Loading Spinner","data-testid":"loader"}):t.createElement("div",{style:{display:"flex",flexDirection:"row",gap:"8px",justifyContent:"center",alignItems:"center"}},t.createElement("span",null,h.volumeBundle?.ctaTitle??"Add Bundle to Cart")," ","•",t.createElement("div",{className:"yt-volume-add-to-cart-button-info"},(()=>{const n=W(v);return t.createElement(t.Fragment,null,Lh(h.general.currencySymbol,e.storeCurrencyCode),Rh(n.discounted.toFixed(2))," ",n?.original&&t.createElement("span",{style:{lineHeight:"normal",textDecoration:"line-through",fontWeight:"550"}},Lh(h.general.currencySymbol,e.storeCurrencyCode),Rh(n?.original.toFixed(2))," "))})()))):t.createElement(t.Fragment,null,"Out of Stock"))))}const Uf=x.div`
+`,Hf=(e,t)=>{if(!t)return{};for(const n of t)if(n.productId==e)return n;return{}};function Wf({bundle:e,addToCartFunction:n,currentProductId:r}){const s=i(()=>{if(r){const t="gid://shopify/Product/"+r,n=e.products?.some(e=>e.productId===t);return n?t:e.products?.[0]?.productId}return e.products?.[0]?.productId},[r,e.products]),d=i(()=>Hf(s,e.products),[s,e.products]),p=o(null),u=o(null),m=o({}),[f,g]=c(""),h=e.customizations??{},x=(i(()=>d?.productDetails?.variants?.edges?.reduce((e,{node:t})=>t.inventoryQuantity>0?e+=1:e,0),[d]),i(()=>Hf(s,e.products)?.id,[s,e.products]));i(()=>x?Hf(s,e.products):void 0,[s,e.products,x]),i(()=>e.products?.some(e=>e.productDetails?.options?.some(e=>e.values.length>1))||!1,[e.products]),h.volumeBundle;const y=i(()=>e?.volumeTiers||[],[e?.volumeTiers]),b=y.findIndex(e=>e.isDefault),[v,w]=c(-1!==b?y[b].tier:y?.[0]?.tier||1),[C,k]=c(d?.productDetails?.variants?.edges?.[0]?.node?.id||""),[E,T]=c({}),[S,$]=c(y.reduce((e,t,n)=>(e[t.tier-1]=Array.from({length:t.minimumQuantity},()=>d?.productDetails?.options?.map(e=>e.values[0])||[]),e),{})||{}),[B,z]=c(!1),[D,I]=c(window.innerWidth<550),[_,O]=c(null);o([]);const P=o([]);l(()=>{const e=()=>{I(window.innerWidth<550)};return window.addEventListener("resize",e),()=>{window.removeEventListener("resize",e)}},[]),l(()=>{const e=e=>{_&&P.current[_.index]&&P.current[_.index][_.optionIndex]&&!P.current[_.index][_.optionIndex]?.contains(e.target)&&O(null)};return document.addEventListener("mousedown",e),()=>{document.removeEventListener("mousedown",e)}},[_]);const A=a(e=>{if(!h.general?.trackInventory)return null;const t=y.find(t=>t.tier===e);if(!t)return null;const n=t.minimumQuantity,r=d?.productDetails?.variants?.edges||[];for(const e of r){const t=e.node;if(t.inventoryQuantity>=n&&t.availableForSale){const e=t.title.split(" / ");return Array(n).fill(e)}}const o=[],a={},i=[...r].sort((e,t)=>t.node.inventoryQuantity-e.node.inventoryQuantity);for(let e=0;e<n&&o.length<n;e++){let e=!1;for(const t of i){const n=t.node,r=a[n.id]||0;if(n.inventoryQuantity>r&&n.availableForSale){const t=n.title.split(" / ");o.push(t),a[n.id]=r+1,e=!0;break}}if(!e)return null}return o.length===n?o:null},[d,y]),N=a(e=>{if(!h.general?.trackInventory)return!0;const t=y.find(t=>t.tier===e);if(!t)return!1;const n=t.minimumQuantity,r=d?.productDetails?.variants?.edges||[];let o=0;for(const e of r){const t=e.node;t.availableForSale&&(o+=Math.max(0,t.inventoryQuantity))}return o>=n},[h.general?.trackInventory,y,d]);l(()=>{const e={},t=d?.productDetails?.variants?.edges?.[0]?.node?.id||"";t&&y.forEach(n=>{e[n.tier]={};for(let r=0;r<n.minimumQuantity;r++)e[n.tier][r]=t}),T(e)},[d?.id,y?.map(e=>`${e.tier}-${e.minimumQuantity}`).join("|")]),l(()=>{if(!m.current[v]){const e=A(v);if(e){const t=v-1;$(n=>({...n,[t]:e}));const n={};e.forEach((e,t)=>{const r=e.join(" / "),o=d?.productDetails?.variants?.edges?.find(e=>e.node.title===r)?.node.id||C;n[t]=o}),T(e=>({...e,[v]:n}))}m.current[v]=!0}},[v,d,C,A]);const F=(e,t)=>e?.productDetails?.variants?.edges?.find(e=>e.node.id===t)?.node,M=a((e,t,n,r,o)=>{if(!h?.general?.trackInventory)return!0;const a=y.find(t=>t.tier===e);if(!a)return!1;const i=a.minimumQuantity,l=e-1,c=[...n];c[r]=o;const s=c.join(" / "),p=d?.productDetails?.variants?.edges?.find(e=>e.node.title===s)?.node;if(!p||!p.availableForSale||p.inventoryQuantity<=0)return!1;const u={};for(let e=0;e<i;e++){let n;if(e===t)n=p.id;else{const t=(S[l]?.[e]||d.productDetails.options.map(e=>e.values[0])).join(" / "),r=d?.productDetails?.variants?.edges?.find(e=>e.node.title===t);if(!r)return!1;n=r.node.id}u[n]=(u[n]||0)+1}for(const[e,t]of Object.entries(u)){const n=F(d,e);if(n&&t>n.inventoryQuantity)return!1}return!0},[h?.general?.trackInventory,y,d,S]),R=a(e=>{if(!h.general?.trackInventory)return!0;const t=y.find(t=>t.tier===e);if(!t)return!1;const n=t.minimumQuantity,r=e-1,o={};for(let e=0;e<n;e++){const t=(S[r]?.[e]||d.productDetails.options.map(e=>e.values[0])).join(" / "),n=d?.productDetails?.variants?.edges?.find(e=>e.node.title===t);if(!n)return!1;const a=n.node.id;o[a]=(o[a]||0)+1}for(const[e,t]of Object.entries(o)){const n=F(d,e);if(n&&t>n.inventoryQuantity)return!1}return!0},[h.general?.trackInventory,y,d,S]),L=(e,t,n)=>{T(r=>({...r,[e]:{...r[e]||{},[t]:n}}))},j=a(()=>!1===h.general?.trackInventory?d?.productDetails?.variants?.edges?.[0]?.node:d?.productDetails?.variants?.edges?.find(e=>e.node.inventoryQuantity>0)?.node||d?.productDetails?.variants?.edges?.[0]?.node,[d]),V=a(()=>new URLSearchParams(window.location.search).get("variant")||"",[]),H=()=>{const e=V();if(e){const t=d?.productDetails?.variants?.edges?.find(t=>String(t.node.id)==="gid://shopify/ProductVariant/"+String(e));if(t&&t.node.inventoryQuantity>0)k(String(t.node.id));else{const e=j();e&&k(String(e.id))}}};console.log("selected variant",C),l(()=>{const e=()=>{const e=new URL(window.location.href).searchParams.get("variant");g(e),k(e)},t=e=>{const t=history[e];return function(...n){const r=t.apply(this,n);return window.dispatchEvent(new Event(e.toLowerCase())),r}};return history.pushState=t("pushState"),history.replaceState=t("replaceState"),window.addEventListener("pushstate",e),window.addEventListener("replacestate",e),e(),()=>{window.removeEventListener("pushstate",e),window.removeEventListener("replacestate",e)}},[]),l(()=>{H();const e=new Event("urlChange");let t=!0;const n=window.history.pushState,r=window.history.replaceState;return window.history.pushState=function(){t&&(n.apply(this,arguments),window.dispatchEvent(e))},window.history.replaceState=function(){t&&(r.apply(this,arguments),window.dispatchEvent(e))},window.addEventListener("urlChange",H),()=>{t=!1,window.removeEventListener("urlChange",H),window.history.pushState=n,window.history.replaceState=r}},[V,d?.id,j]);const W=t=>{const n=y.find(e=>e.tier===t);if(!n)return{original:0,discounted:0};let r=0,o=0;const a=E[t]||{};for(let e=0;e<n.minimumQuantity;e++){const t=a[e]||C,n=F(d,t);n&&(n.compareAtPrice?r+=Number.parseFloat(n.compareAtPrice):r+=Number.parseFloat(n.price),o+=Number.parseFloat(n.price))}return"percentOff"===e?.discountType?o*=1-n.discountValue/100:"amountOff"===e?.discountType&&(o-=n.discountValue),o<0&&(o=0),{original:r,discounted:o,discountValue:n.discountValue}},U=(e,t,n,r)=>{let o=F(e,t);if(r){const a=E[r]?.[n||0]||t;o=F(e,a)}return o?.image?.url?o.image.url:e.productDetails?.media?.edges[0]?.node?.preview?.image?.url||""},Q=i(()=>y.find(e=>e.tier===v),[y,v]),G=i(()=>Q?W(Q.tier):null,[Q,E,C]),Y=i(()=>{if(!Q||!G)return;const e=E[Q.tier]||{},t={};for(let n=0;n<Q.minimumQuantity;n++){const r=e[n]||C;t[r]=(t[r]||0)+1}return t},[Q?.minimumQuantity,C,E,G]),q=i(()=>Object.entries(Y??{}).map(([e,t])=>({variantId:e,quantity:t})),[Y]);if(l(()=>{if(!Q||!G)return;const e={tier:v,items:Q.minimumQuantity,discountedPrice:G.discounted,originalPrice:G.original,variants:q,productId:d?.id??null,tierMeta:{title:Q.title,subtitle:Q.subtitle,badgeTitle:Q.badgeTitle},productData:d,tierData:Q},t=u.current;return t&&JSON.stringify(t)===JSON.stringify(e)?void 0:(p.current&&clearTimeout(p.current),p.current=window.setTimeout(()=>{u.current=e;const t=new CustomEvent("ytBundleTierChange",{detail:e});window.dispatchEvent(t)},50),()=>{p.current&&clearTimeout(p.current)})},[v,Q?.tier,Q?.minimumQuantity,G?.discounted,G?.original,d?.id,JSON.stringify(q)]),l(()=>{if(!C||!Q)return;const e=F(d,C);if(e){const t={};for(let e=0;e<Q.minimumQuantity;e++)t[e]=C;T(e=>({...e,[v]:t}));const n=e.title.split(" / "),r=Array(Q.minimumQuantity).fill(n);$(e=>({...e,[v-1]:r}))}},[C,v,d,Q]),!n)return t.createElement(t.Fragment,null);const Z=h.volumeBundle?.cardStyle,K=h.general?.primaryColor,X=h.general?.secondaryColor,J=h.general.primaryContrastColor,ee=h.general.secondaryContrastColor,te="high"===e.cornerRadiusType?"20px":"medium"===e.cornerRadiusType?"6px":"0px",ne="bundles"==e.appName?e.pageHeader?.title:e?.title,re="bundles"==e.appName?e.pageHeader?.description:e?.subtitle;return t.createElement(ff,{verticalMargin:h.volumeBundle?.verticalMargin,backgroundColor:h.volumeBundle?.sectionBackgroundColor,className:"yt-bundle-container"},t.createElement(gf,{className:"yt-bundle-header"},ne&&ne.trim().length>0&&t.createElement(hf,{fontSize:h.volumeBundle?.titleFontSize,backgroundColor:h.volumeBundle?.titleBackgroundColor,textColor:h.volumeBundle?.titleTextColor,className:"yt-bundle-header-title"},ne),t.createElement(xf,{className:"yt-bundle-header-subtitle",fontSize:h.volumeBundle?.subtitleFontSize},re)),"vertical"===Z?t.createElement("div",{style:{display:"grid",gridTemplateColumns:D||4===y.length?"repeat(2, 1fr)":y.length>4?"repeat(3, 1fr)":`repeat(${y.length}, 1fr)`,justifyItems:"center",gap:D?"10px":"16px",paddingTop:"10px"},className:"yt-bundle-vertical-container"},y.map(n=>{const r=W(n.tier),o=r.original-r.discounted,a=v===n.tier,i=!N(n.tier);return t.createElement(t.Fragment,{key:n.tier},t.createElement("div",{style:{display:"flex",flexDirection:"column",gap:"8px",borderRadius:te||"24px",...a?{border:`2px solid ${K}`}:{border:`1px solid ${X}`},boxShadow:`6px 6px 0px -1px ${a?K:X}20`,...n.badgeTitle&&{position:"relative"},zIndex:5,backgroundColor:i?"#f5f5f5":"white",cursor:i?"not-allowed":"pointer",position:"relative",height:"100%",maxHeight:"350px",width:"100%",opacity:i?.6:1},className:"yt-volume-vertical-tier-item "+(a?"yt-volume-vertical-tier-item-active":""),"data-tier":n.tier,"data-discount-value":r.discountValue,"data-discount-type":e?.discountType,"data-minimum-quantity":n.minimumQuantity,"data-original-price":r.original.toFixed(2),"data-discounted-price":r.discounted.toFixed(2),onClick:()=>!i&&w(n.tier)},n.badgeTitle&&t.createElement("div",{style:{position:"absolute",top:"-15px",zIndex:-1,left:"0",right:"0",width:"80%",textAlign:"center",margin:"0 auto",fontSize:"10px",clipPath:"polygon(2% 0%, 98% 0%, 100% 100%, 0% 100%)",backgroundColor:a?K:X,color:a?J:ee,padding:"2px 0",borderRadius:"12px 12px 0px 0px",lineHeight:"normal"},className:a?"yt-volume-vertical-tier-badge-active":"yt-volume-vertical-tier-badge","data-tier":n.tier,"data-badge-title":n.badgeTitle},n.badgeTitle),t.createElement("div",{style:{position:"relative",width:"100%",display:"flex",justifyContent:"center",height:"fit-content"},className:"yt-volume-vertical-tier-save-badge-container"},0!==r.discountValue&&t.createElement(t.Fragment,null,D&&o&&!!r?.discountValue&&"Enabled"===h.volumeBundle?.discountBadgeVisibility&&t.createElement("div",{style:{lineHeight:"normal",position:"absolute",right:"5px",top:"8px"}},t.createElement(Cf,{primaryBackgroundColorCta:a?K:X,isSelected:a,style:{height:"fit-content",fontSize:"10px",lineHeight:"normal",color:a?J:ee},className:"yt-volume-vertical-tier-save-badge","data-tier":n.tier,"data-discount-value":r.discountValue,"data-discount-type":e?.discountType}," ","percentOff"===e?.discountType?`${r.discountValue}% Off`:`Save ${Lh(h.general.currencySymbol,e.storeCurrencyCode)}${Rh(r.discountValue)}`))),n.imageUrl&&t.createElement("img",{src:n.imageUrl,style:{objectFit:"cover",aspectRatio:"1/1",width:"100%",maxHeight:"160px",maxWidth:"160px",height:"fit-content",borderTopLeftRadius:te||"24px",borderTopRightRadius:te||"24px"},className:"yt-volume-vertical-tier-badge"})),t.createElement("div",{style:{padding:"8px",paddingTop:"0"}},t.createElement(kf,{style:{display:"flex",width:"100%",gap:"4px"},className:"yt-volume-vertical-details-container"},t.createElement("div",{style:{display:"flex",alignItems:"center",position:"relative",width:"100%"},className:"yt-volume-vertical-details-title-container"},t.createElement(Ef,{style:{fontSize:D?"12px":"14px",lineHeight:"normal"},className:"yt-volume-vertical-details-title"},n.title?n.title:t.createElement(t.Fragment,null,"Buy ",n.minimumQuantity,", Get"," ",n.discountValue,"% Off")),!D&&o&&!!r?.discountValue&&"Enabled"===h.volumeBundle?.discountBadgeVisibility&&t.createElement(Cf,{primaryBackgroundColorCta:a?K:X,isSelected:a,style:{height:"fit-content",fontSize:"10px",lineHeight:"normal",color:a?J:ee},className:"yt-volume-vertical-tier-save-badge","data-tier":n.tier,"data-discount-value":r.discountValue,"data-discount-type":e?.discountType}," ","percentOff"===e?.discountType?`${r.discountValue}% Off`:`Save ${Lh(h.general.currencySymbol,e.storeCurrencyCode)}${Rh(r.discountValue)}`),a&&n.imageUrl&&t.createElement("div",{style:{lineHeight:"normal",position:"absolute",right:"0px"},className:"yt-volume-vertical-tier-selected-check"},t.createElement("span",{style:{display:"flex",alignItems:"center",justifyContent:"center",width:"16px",height:"16px",borderRadius:"50%",backgroundColor:K,color:J,padding:"2px"}},t.createElement(fo,{style:{paddingBottom:"1px"},size:20,fontWeight:20})))),t.createElement(Tf,{style:{lineHeight:"normal",fontSize:D?"10px":"14px",color:"#666"},className:"yt-volume-vertical-details-subtitle"},n.subtitle?n.subtitle:t.createElement(t.Fragment,null))),t.createElement(Sf,{style:{textAlign:"left",marginTop:"4px",display:"flex",flexDirection:"row",flexWrap:"wrap",alignItems:"center"},className:"yt-volume-vertical-details-price","data-tier":n.tier,"data-original-price":r.original.toFixed(2),"data-discounted-price":r.discounted.toFixed(2),"data-savings":o.toFixed(2)},t.createElement($f,{style:{marginLeft:"0",lineHeight:"normal",marginRight:"8px"},className:"yt-volume-vertical-details-price-discount"},Lh(h.general.currencySymbol,e.storeCurrencyCode),Rh(r.discounted.toFixed(2))),o?t.createElement(Bf,{style:{lineHeight:"normal"},className:"yt-volume-vertical-details-price-original"},Lh(h.general.currencySymbol,e.storeCurrencyCode),Rh(r.original.toFixed(2))):"")),a&&!n.imageUrl&&t.createElement("div",{style:{lineHeight:"normal",position:"absolute",right:"10px",bottom:"10px"},className:"yt-volume-vertical-tier-selected-check"},t.createElement("span",{style:{display:"flex",alignItems:"center",justifyContent:"center",width:"16px",height:"16px",borderRadius:"50%",backgroundColor:K,color:J,padding:"2px"}},t.createElement(fo,{style:{paddingBottom:"1px"},size:20,fontWeight:20})))))})):t.createElement(t.Fragment,null,y.map(n=>{const r=W(n.tier),o=r.original-r.discounted,a=!N(n.tier);return t.createElement(t.Fragment,{key:n.tier},n.badgeTitle&&t.createElement(yf,{primaryTextColorCta:J,primaryBackgroundColorCta:K,style:{lineHeight:"normal"},className:"yt-volume-horizontal-tier-badge","data-tier":n.tier,"data-badge-title":n.badgeTitle},n.badgeTitle),t.createElement(bf,{cornerRadiusType:e?.cornerRadiusType??"",key:n.tier,primaryBackgroundColorCta:K??"",isSelected:v===n.tier,onClick:()=>w(n.tier),style:{borderRadius:te,cursor:"pointer",backgroundColor:a?"#f5f5f5":"white",opacity:a?.6:1},className:"yt-volume-horizontal-tier-container "+(v===n.tier?"yt-volume-horizontal-tier-container-active":""),"data-tier":n.tier,"data-discount-value":r.discountValue,"data-discount-type":e?.discountType,"data-minimum-quantity":n.minimumQuantity,"data-original-price":r.original.toFixed(2),"data-discounted-price":r.discounted.toFixed(2)},t.createElement(vf,{cornerRadiusType:e?.cornerRadiusType??"",style:{borderRadius:te,borderBottomLeftRadius:"0px",borderBottomRightRadius:"0px"},className:"yt-volume-horizontal-tier-header"},t.createElement(wf,{className:"yt-volume-horizontal-tier-info"},t.createElement(Of,{"data-active":v===n.tier,accentColor:K,className:"yt-volume-horizontal-tier-radio-wrapper"},t.createElement(Pf,{name:"tier",checked:v===n.tier,onChange:()=>!a&&w(n.tier),disabled:a,className:"yt-volume-horizontal-tier-radio-hidden"}),t.createElement(Af,{accentColor:K,className:"yt-volume-horizontal-tier-radio-custom"})),t.createElement(kf,{className:"yt-volume-horizontal-tier-details"},t.createElement("div",{style:{display:"flex"},className:"yt-volume-horizontal-tier-title-container"},t.createElement(Ef,{style:{lineHeight:"normal"},className:"yt-volume-horizontal-tier-title"},n.title?n.title:t.createElement(t.Fragment,null,"Buy ",n.minimumQuantity,", Get"," ",n.discountValue,"% Off")),o&&r?.discountValue&&"Enabled"===h.volumeBundle?.discountBadgeVisibility?t.createElement(Cf,{primaryBackgroundColorCta:K,isSelected:v===n.tier,style:{lineHeight:"normal"},className:"yt-volume-horizontal-tier-save-badge","data-tier":n.tier,"data-discount-value":r.discountValue,"data-discount-type":e?.discountType}," ","percentOff"===e?.discountType?`${r.discountValue}% Off`:`Save ${Lh(h.general.currencySymbol,e.storeCurrencyCode)}${Rh(r.discountValue)}`):""),t.createElement(Tf,{style:{lineHeight:"normal"},className:"yt-volume-horizontal-tier-subtitle"},n.subtitle?n.subtitle:t.createElement(t.Fragment,null)))),t.createElement(Sf,{style:{lineHeight:"normal"},className:"yt-volume-horizontal-tier-price","data-tier":n.tier,"data-original-price":r.original.toFixed(2),"data-discounted-price":r.discounted.toFixed(2),"data-savings":o.toFixed(2)},o?t.createElement(Bf,{style:{lineHeight:"normal"},className:"yt-volume-horizontal-tier-original-price"},Lh(h.general.currencySymbol,e.storeCurrencyCode),Rh(r.original.toFixed(2))):"",t.createElement($f,{className:"yt-volume-horizontal-tier-discounted-price"},Lh(h.general.currencySymbol,e.storeCurrencyCode),Rh(r.discounted.toFixed(2))))),v===n.tier&&t.createElement(zf,{className:"yt-volume-horizontal-tier-product-grid",style:{padding:d.productDetails.variants.edges.length<=1?"0":"10px 15px",gap:d.productDetails.variants.edges.length<=1?"0":"10px"}},Array.from({length:n.minimumQuantity}).map((r,o)=>{const i=n.tier-1,l=(S[i]||[])[o]||d.productDetails.options?.map(e=>e.values[0])||[],c=d?.productDetails?.options.some(e=>e.values.length>1);return t.createElement("div",{key:o,style:{display:"flex",gap:"10px",alignItems:"center",position:"relative"},className:"yt-volume-horizontal-tier-product-item"},c&&t.createElement(Nf,{src:U(d,C,o,n.tier),alt:d?.productDetails?.title||"Product",className:"yt-volume-horizontal-tier-product-image"}),"auto"===h?.volumeBundle?.variantSelectorType?t.createElement("div",{style:{display:"flex",gap:"8px",flexWrap:"wrap"}},d?.productDetails?.options?.map((r,s)=>{if(!c)return null;const p=_?.tier===n.tier&&_?.index===o&&_?.optionIndex===s,u=e?.variantOptions?.options?.find(e=>e.name===r.name);let m="";return"color"===u?.type&&(m=u?.values?.find(e=>e.name===l[s])?.value||""),t.createElement(Lf,{key:s,ref:e=>{P.current[o]||(P.current[o]=[]),P.current[o][s]=e},style:{zIndex:p?1e3:"auto",display:"flex"},isActive:p},t.createElement(jf,{onClick:e=>{e.stopPropagation(),O(p?null:{tier:n.tier,index:o,optionIndex:s})},isActive:p,disabled:a},"color"===u?.type&&m&&t.createElement("div",{className:"yt-fixedBundle-product-card_color-swatch",style:{display:"inline-block",width:20,height:20,borderRadius:"50%",backgroundColor:m||"transparent",border:"1px solid #ddd"}}),l[s],t.createElement(no,null)),p&&t.createElement(Vf,{style:{zIndex:1001}},r.values.map(e=>{const r=[...l];r[s]=e;const c=!M(n.tier,o,l,s,e)||a,p=d.productDetails.variants.edges.find(({node:e})=>e.title===r.join(" / "))?.node,m=e=>{if(c)return void e.stopPropagation();$(e=>{const t={...e},n=[...t[i]||[]];return n[o]=r,t[i]=n,t});const t=p?.id||C;L(n.tier,o,t),O(null)},f=u?.values.find(t=>t.name===e);return"image"===u?.type&&f?.value?t.createElement(Ff,{key:e,onClick:m,style:{opacity:c?.5:1,cursor:c?"not-allowed":"pointer"}},t.createElement(Mf,{src:f.value,alt:e}),e,c&&" (Out of stock)"):"color"===u?.type&&f?.value?t.createElement(Ff,{key:e,onClick:m,style:{opacity:c?.5:1,cursor:c?"not-allowed":"pointer"}},t.createElement(Rf,{style:{backgroundColor:f.value}}),e,c&&"Out of stock"):t.createElement(Ff,{key:e,onClick:m,style:{opacity:c?.5:1,cursor:c?"not-allowed":"pointer"}},e,c&&" (Out of stock)")})))})):t.createElement(Df,{style:{display:"flex",flexDirection:"column",gap:"5px"},className:"yt-volume-horizontal-tier-variant-selector"},d?.productDetails?.options.map((r,c)=>{if(!(r.values.length>1))return null;const s=e.variantOptions?.options?.find(e=>e.name===r.name)||null;return t.createElement("div",{key:r.name,style:{width:"100%",display:"flex",flexDirection:"row",gap:"8px",alignItems:"center"},className:"yt-volume-horizontal-tier-variant-option"},t.createElement("div",{style:{display:"flex",flexDirection:"row",alignItems:"center",gap:"8px",flexWrap:"wrap"},className:"yt-volume-horizontal-tier-variant-values"},r.values.map(e=>{const r=l[c]===e,p=!M(n.tier,o,l,c,e)||a,u=s?.values.find(t=>t.name===e),m=t=>{if(t.preventDefault(),t.stopPropagation(),p)return;const r=[...l];r[c]=e,$(e=>{const t={...e},n=[...t[i]||[]];return n[o]=r,t[i]=n,t});const a=r.join(" / "),s=d.productDetails.variants.edges.find(e=>e.node.title===a)?.node.id||C;L(n.tier,o,s)},f={opacity:p?.5:1,cursor:p?"not-allowed":"pointer"};return"color"===s?.type&&u?.value?t.createElement("button",{key:e,onClick:m,style:{...f,borderRadius:"50%",padding:"1px",backgroundColor:"white",border:r?`1px solid ${h.general?.ctaBackgroundColor||"#121212"}`:"1px solid transparent",lineHeight:"normal"},className:"yt-volume-horizontal-tier-variant-color-button",disabled:p},t.createElement("div",{style:{width:r?"24px":"20px",height:r?"24px":"20px",borderRadius:"50%",backgroundColor:u.value,lineHeight:"normal",boxShadow:"rgba(9, 30, 66, 0.25) 0px 4px 8px -2px, rgba(9, 30, 66, 0.08) 0px 0px 0px 2px"}},t.createElement("span",null))):"image"===s?.type&&u?.value?t.createElement("button",{key:e,onClick:m,style:{...f,border:r?`1px solid ${h.general?.ctaBackgroundColor||"#121212"}`:"1px solid #E4E4E4",borderRadius:"100%",backgroundColor:r?"#F7F7F7":"transparent",padding:"0px",width:r?"20px":"18px",height:r?"20px":"18px",overflow:"hidden"},className:"yt-volume-horizontal-tier-variant-image-button",disabled:p},t.createElement("img",{src:u.value,alt:e,style:{width:r?"26px":"24px",height:r?"26px":"24px",objectFit:"cover",borderRadius:"100%",aspectRatio:"1/1"}})):t.createElement(If,{key:e,isSelected:r,onClick:m,style:{...f,padding:"4px 8px",border:r?`1px solid ${h.general?.ctaBackgroundColor||"#121212"}`:"1px solid #E4E4E4",borderRadius:"16px",backgroundColor:r?"#F7F7F7":"transparent",color:"#707070",cursor:"pointer",fontSize:"12px",fontWeight:"600",lineHeight:"normal"},className:"yt-volume-horizontal-tier-variant-button-default",disabled:p},e)})))})))}))))})),e?.showCta&&t.createElement("div",{style:{position:"relative"}},t.createElement(_f,{bgColor:R(v)?h.general?.ctaBackgroundColor:"#ccc",textColor:R(v)?h.general?.ctaTextColor:"#666",border:`1px solid ${R(v)?h.general?.ctaBorderColor||"#121212":"#999"}`,shadow:h.general.ctaShadowType,padding:h.general?.ctaPadding,width:h.general?.ctaWidth,hoverProperties:{customizeHoverState:!!R(v)&&h.general?.customizeHoverState,backgroundColor:h.general?.ctaHoverBackgroundColor,textColor:h.general?.ctaHoverTextColor},onClick:async()=>{if(R(v))try{z(!0);const e=y.find(e=>e.tier===v);if(!e)return;const t={},r=E[e.tier]||{};for(let n=0;n<e.minimumQuantity;n++){const e=r[n]||C;t[e]?t[e].quantity+=1:t[e]={quantity:1}}const o=W(e.tier),a=Array.from({length:e.minimumQuantity},(e,t)=>r[t]||C);n&&await n(o.original,a)}catch(e){console.error("VolumeBundle handleAddToCart error:",e)}finally{z(!1)}else console.error("Selected tier is out of stock")},borderRadius:h.general.ctaBorderRadius??"",disabled:B||!R(v),className:"yt-volume-add-to-cart-button"},R(v)?t.createElement(t.Fragment,null,B?t.createElement(aa,{color:"white",loading:B,size:15,"aria-label":"Loading Spinner","data-testid":"loader"}):t.createElement("div",{style:{display:"flex",flexDirection:"row",gap:"8px",justifyContent:"center",alignItems:"center"}},t.createElement("span",null,h.volumeBundle?.ctaTitle??"Add Bundle to Cart")," ","•",t.createElement("div",{className:"yt-volume-add-to-cart-button-info"},(()=>{const n=W(v);return t.createElement(t.Fragment,null,Lh(h.general.currencySymbol,e.storeCurrencyCode),Rh(n.discounted.toFixed(2))," ",n?.original&&t.createElement("span",{style:{lineHeight:"normal",textDecoration:"line-through",fontWeight:"550"}},Lh(h.general.currencySymbol,e.storeCurrencyCode),Rh(n?.original.toFixed(2))," "))})()))):t.createElement(t.Fragment,null,"Out of Stock"))))}const Uf=x.div`
   container-type: inline-size;
   border-radius: ${e=>e.borderRadius?e.borderRadius:"8px"};
   max-width: 800px;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "yt-uikit",
-  "version": "0.7.378-VolumeBundleVari.0",
+  "version": "0.7.378-VolumeBundleVari.1",
   "description": "YourToken UI Kit",
   "scripts": {
     "rollup": "tsc && rollup -c",