yt-uikit 0.8.9-mixandmatchoverlayFix.0 → 0.8.9-mixandmatchoverlayFix.2

package/dist/esm/index.js

@@ -4220,8 +4220,8 @@ import*as e from"react";import t,{forwardRef as n,useImperativeHandle as r,useRe
   position: fixed;
   top: 0;
   left: 0;
-  width: 100vw;
-  height: 100vh;
+  width: 100%;
+  height: 100%;
   background-color: rgba(0, 0, 0, 0.5);
   display: flex;
   align-items: center;
@@ -4242,7 +4242,7 @@ import*as e from"react";import t,{forwardRef as n,useImperativeHandle as r,useRe
 
   @media (max-width: 600px) {
     width: 100%;
-    max-height: 57%;
+    max-height: 60%;
     position: absolute;
     left: 0;
     right: 0;
@@ -4408,7 +4408,7 @@ import*as e from"react";import t,{forwardRef as n,useImperativeHandle as r,useRe
     font-size: 11px;
     padding: 4px 8px;
   }
-`,jg=({bundle:e,addToCartFunction:n})=>{const[r,a]=c({}),[s,d]=c(!1),[p,u]=c(0),[m,f]=c(0),[g,x]=c(""),[h,y]=c([]),[b,v]=c({}),[C,k]=c(!1),[E,T]=c(window.innerWidth<450),S=e.builderTiers?.productTier||[],$=i(()=>(e,t)=>{const n=e?.variants?.edges?.find(e=>e.node.id===t),r=n?.node;return r?e.tracksInventory&&r.inventoryItem?.tracked?r.inventoryQuantity>0?r.inventoryQuantity:r.inventoryQuantity<=0&&"continue"===r.inventoryPolicy?1/0:0:1/0:0},[]),{originalPrice:B,dealPrice:z,offerValue:N}=i(()=>{const t=[];let n=0;Object.values(r).forEach(e=>{e.productId&&e.variantId&&(t.push({productId:e.productId,variantId:e.variantId}),n++)});let o=0,a=0;for(const{productId:n,variantId:r}of t){const t=e.products.find(e=>e.productId===n);if(!t)continue;const i=t.productDetails.variants.edges.find(e=>e.node.id===r)?.node;if(!i)continue;const l=Number.parseFloat(i.price||"0"),c=Number.parseFloat(i.compareAtPrice||"0");o+=l,a+=c>0?c:l}let i=o;(n===S.length||e?.dealAmount)&&(e?.percentageOff?i=o*(1-e.percentageOff/100):e?.dealAmount?i=e.dealAmount:e?.amountOff&&e.amountOff<o&&(i=o-e.amountOff));const l=a||o,c=l-i;return{originalPrice:l.toFixed(2),dealPrice:i.toFixed(2),offerValue:c.toFixed(2)}},[e,r,S.length]);l(()=>{u(S.length-Object.keys(r).length)},[r]),l(()=>{const e={};let t=!1;S.forEach((n,r)=>{if(n.isFixed&&n.products&&n.products.length>0){const o=n.products[0];if(o&&o.productId){const n=o.variantIds?.[0]||I(o.productId);n&&(e[r]={productId:o.productId,variantId:n},t=!0)}}}),t&&a(t=>({...t,...e}))},[S]),l(()=>{if(null===m||0===S.length)return;const t=S[m].products.map(e=>e.productId),n=new Map;e.products.forEach(e=>{t.includes(e.productId)&&!n.has(e.productId)&&n.set(e.productId,e)});let r=Array.from(n.values());if(""!==g.trim()){const e=g.toLowerCase();r=r.filter(t=>t.productDetails.title.toLowerCase().includes(e)||t.productDetails.selectedVariant?.displayName?.toLowerCase().includes(e)||t.productDetails.collections?.edges?.some(t=>t.node.title.toLowerCase().includes(e)))}y(r)},[g,e.products,m,S]);const D=t=>{const n=e.products.find(e=>e.productId===t);return n?.productDetails},I=t=>{const n=e.products.find(e=>e.productId===t);if(!n||!n.productDetails.variants.edges.length)return"";const r=n.productDetails.variants.edges.find(e=>$(n.productDetails,e.node.id)>0)?.node;return r?r.id:n.productDetails.variants.edges[0].node.id},_=(t,n)=>{if(null==m)return;const r=n||I(t),o=e.products.find(e=>e.productId===t);if(o){if(0===$(o.productDetails,r))return void console.log("Cannot select out of stock variant")}a(e=>({...e,[m]:{productId:t,variantId:r}})),d(!1),x("")},P=e=>{a(t=>{const n={...t};return delete n[e],n}),v({})},A=t=>{const n=S[t];if(n.isFixed)return;f(t),d(!0),x("");const r=n.products.map(e=>e.productId),o=e.products.filter(e=>r.includes(e.productId)),a=new Map;o.forEach(e=>{a.has(e.productId)||a.set(e.productId,e)}),y(Array.from(a.values()))};l(()=>{const e=()=>{T(window.innerWidth<450)};return window.addEventListener("resize",e),()=>{window.removeEventListener("resize",e)}},[]);const O=e.customizations,F=E,M="bundles"===e.appName?e.pageHeader?.title:e?.title,R="bundles"===e.appName?e.pageHeader?.description:e?.subtitle;return t.createElement(t.Fragment,null,t.createElement(sg,{verticalMargin:O.comboBundle.verticalMargin,borderRadius:"20px"},O.comboBundle.embedContentVisibility&&t.createElement(dg,null,O.comboBundle?.embedContentVisibility&&O.comboBundle?.selectedEmbedContentVisibilityOptions?.includes("Combo Title")&&t.createElement("div",{style:{display:"flex",flexDirection:"column",gap:"8px",marginBottom:"10px",width:"100%",textAlign:O.comboBundle.infoAlignment||"left"}},t.createElement("h2",{style:{fontSize:"28px",color:O.comboBundle?.titleTextColor||"#000",fontWeight:"bold",lineHeight:"1.6",margin:0}},M)),O.comboBundle?.selectedEmbedContentVisibilityOptions?.includes("Combo Price")&&Number(z)>1&&t.createElement(t.Fragment,null,t.createElement(pg,{infoAlignment:O.comboBundle.infoAlignment},t.createElement(ug,null,ph(O.general.currencySymbol,e.storeCurrencyCode),dh(z)),Number(z)<Number(B)&&t.createElement(mg,{style:{minWidth:"fit-content"}},ph(O.general.currencySymbol,e.storeCurrencyCode)," ",dh(B)),t.createElement(fg,{style:{minWidth:"fit-content"}},"In Stock")),t.createElement(gg,{style:{textAlign:O.comboBundle.infoAlignment||"left",fontSize:O.comboBundle.productDescriptionFontSize}},"Tax included. Shipping calculated at checkout."))),t.createElement(xg,{gridSize:S.length,isHorizontal:F},S.map((e,n)=>{const a=(e=>!!r[e]&&!!r[e].productId)(n),{product:i,variantId:c}=(e=>{const t=r?.[e];return t?{product:D(t.productId),variantId:t.variantId}:{product:void 0,variantId:""}})(n),s=i?((e,t)=>{if(!e||!e.variants.edges)return null;const n=e.variants.edges.find(e=>e.node.id===t);return n?.node})(i,c):null,d=e.isFixed,p=o(null);return l(()=>{const e=p.current;if(!e)return;const t=e.querySelector("span");if(!t)return;const n=e.clientWidth,r=t.scrollWidth;if(r<=n)return e.setAttribute("data-overflow","false"),e.style.removeProperty("--scroll-end"),void e.style.removeProperty("--duration");const o=-(r-n);e.style.setProperty("--scroll-end",`${o}px`);const a=2*Math.max(1,Math.abs(o)/40)+3;e.style.setProperty("--duration",`${a}s`),e.setAttribute("data-overflow","true")},[s?.displayName,s?.title]),a&&i?t.createElement(hg,{key:`tier-${n}`,onClick:()=>!d&&A(n),style:{borderRadius:"20px",cursor:d?"default":"pointer"},isHorizontal:F,infoAlignment:O.comboBundle.infoAlignment},!d&&t.createElement(kg,{onClick:e=>{e.stopPropagation(),P(n)}},"×"),t.createElement(bg,{src:i?.featuredMedia?.preview?.image?.url||"/placeholder.svg?height=200&width=200",alt:i?.title,style:{aspectRatio:O?.general.imageAspectRatio||"1/1"},isHorizontal:F}),t.createElement(vg,{style:{color:"#1e1e1e",textAlign:"center",...F&&"right"===O.comboBundle.infoAlignment&&{padding:"0 8px",textAlign:"right",alignItems:"flex-end"},...F&&"left"===O.comboBundle.infoAlignment&&{padding:"0 5px",textAlign:"left",alignItems:"flex-start"},...!F&&"left"===O.comboBundle.infoAlignment&&{padding:"0 10px"},...F&&"center"===O.comboBundle.infoAlignment&&{textAlign:"left",alignItems:"flex-start",padding:"0 5px"}},isHorizontal:F},t.createElement(Cg,{style:{fontSize:"15px",width:"100%",display:"flex",alignItems:"center",fontWeight:"600",textAlign:"center",lineHeight:"normal"},ref:p},t.createElement("span",null,i?.title," - ",s?.title)))):t.createElement(yg,{key:`tier-${n}`,onClick:()=>!d&&A(n),isHorizontal:F,infoAlignment:O.comboBundle.infoAlignment,style:{cursor:d?"default":"pointer"}},d?t.createElement("div",{style:{textAlign:"center",width:"100%",height:"100%",display:"flex",flexDirection:"column",justifyContent:"center",alignItems:"center"}},t.createElement("div",{style:{fontSize:"12px",color:"#666",marginBottom:"8px"}},"Fixed Product"),t.createElement("div",{style:{fontSize:"14px",fontWeight:"600"}},e.title||`Product ${n+1}`)):t.createElement(t.Fragment,null,t.createElement("div",{style:{width:"100%",height:"80%",display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",borderTopLeftRadius:"18px",borderTopRightRadius:"18px",flexShrink:0,backgroundColor:"#f8f9fa"}},t.createElement(Eg,null,"+")),t.createElement(wg,{style:{fontSize:"15px",fontWeight:"600",color:O.comboBundle.titleTextColor||"#1e1e1e",lineHeight:"normal",height:"20%",display:"flex",alignItems:"center",justifyContent:"center"},isHorizontal:F,infoAlignment:O.comboBundle.infoAlignment},t.createElement("p",{style:{width:"80%",margin:"0",height:"100%",display:"flex",justifyContent:"center",alignItems:"center"}},e.title?`${e.title}`:`Select Product ${n+1}`))))})),t.createElement(Tg,{hoverProperties:{customizeHoverState:O.general.customizeHoverState,backgroundColor:O.general.ctaHoverBackgroundColor,textColor:O.general.ctaHoverTextColor},borderRadius:O.general.ctaBorderRadius,primaryBgColor:O.general.ctaBackgroundColor,onClick:async()=>{k(!0);try{if(p>0)return console.log("Please select all products"),void k(!1);const t=Object.values(r).map(e=>e.variantId),o=Object.values(r).map(t=>{const n=e.products.find(e=>e.productId===t.productId);if(!n)return null;const r=n?.productDetails?.variants?.edges?.find(e=>e.node.id===t.variantId)?.node;return r?{variantId:t.variantId,price:Number(r.price)}:null}).filter(Boolean);await n(t.length,t,Number(z),o)}catch(e){console.log("Add to cart error:",e)}finally{k(!1)}},textColor:O.general.ctaTextColor,borderColor:O.general.ctaBorderColor},0===p?C?t.createElement(ga,{color:"white",loading:C,size:15,"aria-label":"Loading Spinner","data-testid":"loader"}):t.createElement(t.Fragment,null,O.comboBundle.ctaTitle||"Add Bundle to cart"):`Add ${p} more item(s)`),O.comboBundle?.embedContentVisibility&&O.comboBundle?.selectedEmbedContentVisibilityOptions?.includes("Combo Description")&&t.createElement("div",{style:{margin:"20px 0px"}},t.createElement("h4",{style:{fontSize:"16px",color:O.comboBundle?.descriptionTextColor||"#000",lineHeight:"1.2",margin:0,padding:"8px",backgroundColor:O.general.primaryColor+"20",textAlign:O.comboBundle.infoAlignment||"left"}},"Description"),t.createElement("div",{style:{fontSize:O.comboBundle.productDescriptionFontSize||"16px",color:O.comboBundle?.descriptionTextColor||"#000",lineHeight:"1.2",padding:"8px",backgroundColor:O.general.primaryColor+"08",textAlign:O.comboBundle.infoAlignment||"left"},dangerouslySetInnerHTML:{__html:R}}))),s&&w(t.createElement(Sg,{onClick:()=>d(!1)},t.createElement($g,{onClick:e=>e.stopPropagation()},t.createElement(Bg,{style:{position:"sticky",top:0,background:"#fff",zIndex:10}},t.createElement("div",{style:{display:"flex",width:"100%",gap:"2px",alignItems:"center",marginBottom:"8px"}},t.createElement(zg,{placeholder:"Search",value:g,onChange:e=>{x(e.target.value)}}),t.createElement(Ng,{onClick:()=>d(!1)},"Cancel")),t.createElement("div",{style:{height:"1px",width:"100%",backgroundColor:"#EBEBEB"}})),t.createElement("div",{style:{marginBottom:E?"20px":"5px",flex:1,minHeight:0,overflow:"scroll"}},t.createElement(Dg,{style:{height:"auto",flex:"unset"}},h.length>0?h.map(n=>{const o=n.productDetails,a=(e=>{if(null==m)return!1;const t=r?.[m];return!!t&&t.productId===e})(n.productId),i=I(n.productId);let l=i||"";return l=a&&null!==m?r?.[m]?.variantId||l:b[n.productId]||i,t.createElement(Ig,{className:"mixAndMatch-product-item",primaryBgColor:O.general.primaryColor||"#1e1e1e",key:o.id,isSelected:a,onClick:()=>{_(n.productId,l)}},t.createElement(_g,{className:"mixAndMatch-vendor-image",src:o.featuredMedia?.preview?.image?.url||"/placeholder.svg?height=50&width=50",alt:o.title}),t.createElement(Pg,{className:"mixAndMatch-vendor-info"},t.createElement(Ag,{className:"mixAndMatch-vendor-name"},o.title),t.createElement(Rg,{className:"mixAndMatch-variant-options"},o.variants.edges.map(({node:e})=>{const r=0===$(o,e.id);return t.createElement(Lg,{className:"mixAndMatch-variant-button "+(l===e.id?"mixAndMatch-variant-button--selected":""),primaryBgColor:O.general?.primaryColor,disabled:!!a||r,key:e.id,isSelected:l===e.id,tierHasProductId:!!a,onClick:t=>{var o,a;t.stopPropagation(),r||(o=n.productId,a=e.id,v(e=>({...e,[o]:a})))},style:{opacity:r?.5:1,cursor:r?"not-allowed":"pointer"}},e.title)}))),t.createElement(Og,{cornerRadiusType:e?.cornerRadiusType??"",primaryBgColor:O.general?.primaryColor||"#1e1e1e",onClick:()=>a?P(m||0):_(n.productId,l)},a?t.createElement(Fg,null,"Added"):" + Add"))}):t.createElement(Mg,null,'No products found matching "',g,'"'))))),document.body))},Vg=h.div`
+`,jg=({bundle:e,addToCartFunction:n})=>{const[r,a]=c({}),[s,d]=c(!1),[p,u]=c(0),[m,f]=c(0),[g,x]=c(""),[h,y]=c([]),[b,v]=c({}),[C,k]=c(!1),[E,T]=c(window.innerWidth<450),S=e.builderTiers?.productTier||[],$=i(()=>(e,t)=>{const n=e?.variants?.edges?.find(e=>e.node.id===t),r=n?.node;return r?e.tracksInventory&&r.inventoryItem?.tracked?r.inventoryQuantity>0?r.inventoryQuantity:r.inventoryQuantity<=0&&"continue"===r.inventoryPolicy?1/0:0:1/0:0},[]),{originalPrice:B,dealPrice:z,offerValue:N}=i(()=>{const t=[];let n=0;Object.values(r).forEach(e=>{e.productId&&e.variantId&&(t.push({productId:e.productId,variantId:e.variantId}),n++)});let o=0,a=0;for(const{productId:n,variantId:r}of t){const t=e.products.find(e=>e.productId===n);if(!t)continue;const i=t.productDetails.variants.edges.find(e=>e.node.id===r)?.node;if(!i)continue;const l=Number.parseFloat(i.price||"0"),c=Number.parseFloat(i.compareAtPrice||"0");o+=l,a+=c>0?c:l}let i=o;(n===S.length||e?.dealAmount)&&(e?.percentageOff?i=o*(1-e.percentageOff/100):e?.dealAmount?i=e.dealAmount:e?.amountOff&&e.amountOff<o&&(i=o-e.amountOff));const l=a||o,c=l-i;return{originalPrice:l.toFixed(2),dealPrice:i.toFixed(2),offerValue:c.toFixed(2)}},[e,r,S.length]);l(()=>{u(S.length-Object.keys(r).length)},[r]),l(()=>{const e={};let t=!1;S.forEach((n,r)=>{const o=n.products||[];if((n.isFixed||1===o.length)&&o.length>0){const n=o[0];if(n?.productId){const o=n.variantIds?.[0]||I(n.productId);o&&(e[r]={productId:n.productId,variantId:o},t=!0)}}}),t&&a(t=>({...t,...e}))},[S]),l(()=>{if(null===m||0===S.length)return;const t=S[m].products.map(e=>e.productId),n=new Map;e.products.forEach(e=>{t.includes(e.productId)&&!n.has(e.productId)&&n.set(e.productId,e)});let r=Array.from(n.values());if(""!==g.trim()){const e=g.toLowerCase();r=r.filter(t=>t.productDetails.title.toLowerCase().includes(e)||t.productDetails.selectedVariant?.displayName?.toLowerCase().includes(e)||t.productDetails.collections?.edges?.some(t=>t.node.title.toLowerCase().includes(e)))}y(r)},[g,e.products,m,S]);const D=t=>{const n=e.products.find(e=>e.productId===t);return n?.productDetails},I=t=>{const n=e.products.find(e=>e.productId===t);if(!n||!n.productDetails.variants.edges.length)return"";const r=n.productDetails.variants.edges.find(e=>$(n.productDetails,e.node.id)>0)?.node;return r?r.id:n.productDetails.variants.edges[0].node.id},_=(t,n)=>{if(null==m)return;const r=n||I(t),o=e.products.find(e=>e.productId===t);if(o){if(0===$(o.productDetails,r))return void console.log("Cannot select out of stock variant")}a(e=>({...e,[m]:{productId:t,variantId:r}})),d(!1),x("")},P=e=>{a(t=>{const n={...t};return delete n[e],n}),v({})},A=t=>{const n=S[t];if(n.isFixed)return;f(t),d(!0),x("");const r=n.products.map(e=>e.productId),o=e.products.filter(e=>r.includes(e.productId)),a=new Map;o.forEach(e=>{a.has(e.productId)||a.set(e.productId,e)}),y(Array.from(a.values()))};l(()=>{const e=()=>{T(window.innerWidth<450)};return window.addEventListener("resize",e),()=>{window.removeEventListener("resize",e)}},[]);const O=e.customizations,F=E,M="bundles"===e.appName?e.pageHeader?.title:e?.title,R="bundles"===e.appName?e.pageHeader?.description:e?.subtitle;return t.createElement(t.Fragment,null,t.createElement(sg,{verticalMargin:O.comboBundle.verticalMargin,borderRadius:"20px"},O.comboBundle.embedContentVisibility&&t.createElement(dg,null,O.comboBundle?.embedContentVisibility&&O.comboBundle?.selectedEmbedContentVisibilityOptions?.includes("Combo Title")&&t.createElement("div",{style:{display:"flex",flexDirection:"column",gap:"8px",marginBottom:"10px",width:"100%",textAlign:O.comboBundle.infoAlignment||"left"}},t.createElement("h2",{style:{fontSize:"28px",color:O.comboBundle?.titleTextColor||"#000",fontWeight:"bold",lineHeight:"1.6",margin:0}},M)),O.comboBundle?.selectedEmbedContentVisibilityOptions?.includes("Combo Price")&&Number(z)>1&&t.createElement(t.Fragment,null,t.createElement(pg,{infoAlignment:O.comboBundle.infoAlignment},t.createElement(ug,null,ph(O.general.currencySymbol,e.storeCurrencyCode),dh(z)),Number(z)<Number(B)&&t.createElement(mg,{style:{minWidth:"fit-content"}},ph(O.general.currencySymbol,e.storeCurrencyCode)," ",dh(B)),t.createElement(fg,{style:{minWidth:"fit-content"}},"In Stock")),t.createElement(gg,{style:{textAlign:O.comboBundle.infoAlignment||"left",fontSize:O.comboBundle.productDescriptionFontSize}},"Tax included. Shipping calculated at checkout."))),t.createElement(xg,{gridSize:S.length,isHorizontal:F},S.map((e,n)=>{const a=(e=>!!r[e]&&!!r[e].productId)(n),{product:i,variantId:c}=(e=>{const t=r?.[e];return t?{product:D(t.productId),variantId:t.variantId}:{product:void 0,variantId:""}})(n),s=i?((e,t)=>{if(!e||!e.variants.edges)return null;const n=e.variants.edges.find(e=>e.node.id===t);return n?.node})(i,c):null,d=e.isFixed,p=o(null);return l(()=>{const e=p.current;if(!e)return;const t=e.querySelector("span");if(!t)return;const n=e.clientWidth,r=t.scrollWidth;if(r<=n)return e.setAttribute("data-overflow","false"),e.style.removeProperty("--scroll-end"),void e.style.removeProperty("--duration");const o=-(r-n);e.style.setProperty("--scroll-end",`${o}px`);const a=2*Math.max(1,Math.abs(o)/40)+3;e.style.setProperty("--duration",`${a}s`),e.setAttribute("data-overflow","true")},[s?.displayName,s?.title]),a&&i?t.createElement(hg,{key:`tier-${n}`,onClick:()=>!d&&A(n),style:{borderRadius:"20px",cursor:d?"default":"pointer"},isHorizontal:F,infoAlignment:O.comboBundle.infoAlignment},!d&&t.createElement(kg,{onClick:e=>{e.stopPropagation(),P(n)}},"×"),t.createElement(bg,{src:i?.featuredMedia?.preview?.image?.url||"/placeholder.svg?height=200&width=200",alt:i?.title,style:{aspectRatio:O?.general.imageAspectRatio||"1/1"},isHorizontal:F}),t.createElement(vg,{style:{color:"#1e1e1e",textAlign:"center",...F&&"right"===O.comboBundle.infoAlignment&&{padding:"0 8px",textAlign:"right",alignItems:"flex-end"},...F&&"left"===O.comboBundle.infoAlignment&&{padding:"0 5px",textAlign:"left",alignItems:"flex-start"},...!F&&"left"===O.comboBundle.infoAlignment&&{padding:"0 10px"},...F&&"center"===O.comboBundle.infoAlignment&&{textAlign:"left",alignItems:"flex-start",padding:"0 5px"}},isHorizontal:F},t.createElement(Cg,{style:{fontSize:"15px",width:"100%",display:"flex",alignItems:"center",fontWeight:"600",textAlign:"center",lineHeight:"normal"},ref:p},t.createElement("span",null,i?.title," - ",s?.title)))):t.createElement(yg,{key:`tier-${n}`,onClick:()=>!d&&A(n),isHorizontal:F,infoAlignment:O.comboBundle.infoAlignment,style:{cursor:d?"default":"pointer"}},d?t.createElement("div",{style:{textAlign:"center",width:"100%",height:"100%",display:"flex",flexDirection:"column",justifyContent:"center",alignItems:"center"}},t.createElement("div",{style:{fontSize:"12px",color:"#666",marginBottom:"8px"}},"Fixed Product"),t.createElement("div",{style:{fontSize:"14px",fontWeight:"600"}},e.title||`Product ${n+1}`)):t.createElement(t.Fragment,null,t.createElement("div",{style:{width:"100%",height:"80%",display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",borderTopLeftRadius:"18px",borderTopRightRadius:"18px",flexShrink:0,backgroundColor:"#f8f9fa"}},t.createElement(Eg,null,"+")),t.createElement(wg,{style:{fontSize:"15px",fontWeight:"600",color:O.comboBundle.titleTextColor||"#1e1e1e",lineHeight:"normal",height:"20%",display:"flex",alignItems:"center",justifyContent:"center"},isHorizontal:F,infoAlignment:O.comboBundle.infoAlignment},t.createElement("p",{style:{width:"80%",margin:"0",height:"100%",display:"flex",justifyContent:"center",alignItems:"center"}},e.title?`${e.title}`:`Select Product ${n+1}`))))})),t.createElement(Tg,{hoverProperties:{customizeHoverState:O.general.customizeHoverState,backgroundColor:O.general.ctaHoverBackgroundColor,textColor:O.general.ctaHoverTextColor},borderRadius:O.general.ctaBorderRadius,primaryBgColor:O.general.ctaBackgroundColor,onClick:async()=>{k(!0);try{if(p>0)return console.log("Please select all products"),void k(!1);const t=Object.values(r).map(e=>e.variantId),o=Object.values(r).map(t=>{const n=e.products.find(e=>e.productId===t.productId);if(!n)return null;const r=n?.productDetails?.variants?.edges?.find(e=>e.node.id===t.variantId)?.node;return r?{variantId:t.variantId,price:Number(r.price)}:null}).filter(Boolean);await n(t.length,t,Number(z),o)}catch(e){console.log("Add to cart error:",e)}finally{k(!1)}},textColor:O.general.ctaTextColor,borderColor:O.general.ctaBorderColor},0===p?C?t.createElement(ga,{color:"white",loading:C,size:15,"aria-label":"Loading Spinner","data-testid":"loader"}):t.createElement(t.Fragment,null,O.comboBundle.ctaTitle||"Add Bundle to cart"):`Add ${p} more item(s)`),O.comboBundle?.embedContentVisibility&&O.comboBundle?.selectedEmbedContentVisibilityOptions?.includes("Combo Description")&&t.createElement("div",{style:{margin:"20px 0px"}},t.createElement("h4",{style:{fontSize:"16px",color:O.comboBundle?.descriptionTextColor||"#000",lineHeight:"1.2",margin:0,padding:"8px",backgroundColor:O.general.primaryColor+"20",textAlign:O.comboBundle.infoAlignment||"left"}},"Description"),t.createElement("div",{style:{fontSize:O.comboBundle.productDescriptionFontSize||"16px",color:O.comboBundle?.descriptionTextColor||"#000",lineHeight:"1.2",padding:"8px",backgroundColor:O.general.primaryColor+"08",textAlign:O.comboBundle.infoAlignment||"left"},dangerouslySetInnerHTML:{__html:R}}))),s&&w(t.createElement(Sg,{onClick:()=>d(!1)},t.createElement($g,{onClick:e=>e.stopPropagation()},t.createElement(Bg,{style:{position:"sticky",top:0,background:"#fff",zIndex:10}},t.createElement("div",{style:{display:"flex",width:"100%",gap:"2px",alignItems:"center",marginBottom:"8px"}},t.createElement(zg,{placeholder:"Search",value:g,onChange:e=>{x(e.target.value)}}),t.createElement(Ng,{onClick:()=>d(!1)},"Cancel")),t.createElement("div",{style:{height:"1px",width:"100%",backgroundColor:"#EBEBEB"}})),t.createElement("div",{style:{marginBottom:E?"20px":"5px",flex:1,minHeight:0,overflow:"scroll"}},t.createElement(Dg,{style:{height:"auto",flex:"unset"}},h.length>0?h.map(n=>{const o=n.productDetails,a=(e=>{if(null==m)return!1;const t=r?.[m];return!!t&&t.productId===e})(n.productId),i=I(n.productId);let l=i||"";return l=a&&null!==m?r?.[m]?.variantId||l:b[n.productId]||i,t.createElement(Ig,{className:"mixAndMatch-product-item",primaryBgColor:O.general.primaryColor||"#1e1e1e",key:o.id,isSelected:a,onClick:()=>{_(n.productId,l)}},t.createElement(_g,{className:"mixAndMatch-vendor-image",src:o.featuredMedia?.preview?.image?.url||"/placeholder.svg?height=50&width=50",alt:o.title}),t.createElement(Pg,{className:"mixAndMatch-vendor-info"},t.createElement(Ag,{className:"mixAndMatch-vendor-name"},o.title),t.createElement(Rg,{className:"mixAndMatch-variant-options"},o.variants.edges.map(({node:e})=>{const r=0===$(o,e.id);return t.createElement(Lg,{className:"mixAndMatch-variant-button "+(l===e.id?"mixAndMatch-variant-button--selected":""),primaryBgColor:O.general?.primaryColor,disabled:!!a||r,key:e.id,isSelected:l===e.id,tierHasProductId:!!a,onClick:t=>{var o,a;t.stopPropagation(),r||(o=n.productId,a=e.id,v(e=>({...e,[o]:a})))},style:{opacity:r?.5:1,cursor:r?"not-allowed":"pointer"}},e.title)}))),t.createElement(Og,{cornerRadiusType:e?.cornerRadiusType??"",primaryBgColor:O.general?.primaryColor||"#1e1e1e",onClick:()=>a?P(m||0):_(n.productId,l)},a?t.createElement(Fg,null,"Added"):" + Add"))}):t.createElement(Mg,null,'No products found matching "',g,'"'))))),document.body))},Vg=h.div`
   border-radius: 8px;
   container-type: inline-size;
 `,Wg=h.div`

package/package.json

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