@lime-bundles/widget 1.0.0 → 2.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +76 -72
- package/dist/index.cjs +2643 -344
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +22 -50
- package/dist/index.d.ts +22 -50
- package/dist/index.js +2654 -352
- package/dist/index.js.map +1 -1
- package/dist/lime-bundle.global.js +1243 -86
- package/dist/lime-bundle.global.js.map +1 -1
- package/docs/README.md +81 -0
- package/docs/css-variables.md +158 -0
- package/docs/hydrogen.md +185 -0
- package/docs/react-nextjs.md +379 -0
- package/docs/web-component.md +282 -0
- package/package.json +5 -4
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";var LimeBundles=(()=>{var
|
|
1
|
+
"use strict";var LimeBundles=(()=>{var Q=Object.defineProperty;var Ue=Object.getOwnPropertyDescriptor;var Oe=Object.getOwnPropertyNames;var He=Object.prototype.hasOwnProperty;var $e=(e,t)=>{for(var n in t)Q(e,n,{get:t[n],enumerable:!0})},We=(e,t,n,o)=>{if(t&&typeof t=="object"||typeof t=="function")for(let r of Oe(t))!He.call(e,r)&&r!==n&&Q(e,r,{get:()=>t[r],enumerable:!(o=Ue(t,r))||o.enumerable});return e};var qe=e=>We(Q({},"__esModule",{value:!0}),e);var qt={};$e(qt,{LimeBundleElement:()=>z});var te=class extends Error{constructor(e){super(e.map(t=>t.message).join("; ")),this.errors=e,this.name="StorefrontApiError"}},Ne="2025-10";function Y(e){let t=e.apiVersion??Ne,n=`https://${e.shopDomain}/api/${t}/graphql.json`;return{async query(o,r,a){let i={"Content-Type":"application/json","X-Shopify-Storefront-Access-Token":e.accessToken};e.buyerIp&&(i["Shopify-Storefront-Buyer-IP"]=e.buyerIp);let d=await fetch(n,{method:"POST",headers:i,body:JSON.stringify({query:o,variables:r}),signal:a?.signal});if(!d.ok)throw new te([{message:`Storefront API error: ${d.status} ${d.statusText}`}]);let l=await d.json();if(l.errors?.length)throw new te(l.errors);return l.data}}}var le=`#graphql
|
|
2
2
|
query BundleMetaobject($id: ID!) {
|
|
3
3
|
metaobject(id: $id) {
|
|
4
4
|
id
|
|
@@ -82,7 +82,7 @@
|
|
|
82
82
|
}
|
|
83
83
|
}
|
|
84
84
|
}
|
|
85
|
-
`,
|
|
85
|
+
`,de=`#graphql
|
|
86
86
|
query ShopCustomCss {
|
|
87
87
|
shop {
|
|
88
88
|
metafield(namespace: "$app", key: "custom_css") {
|
|
@@ -90,7 +90,7 @@
|
|
|
90
90
|
}
|
|
91
91
|
}
|
|
92
92
|
}
|
|
93
|
-
`,
|
|
93
|
+
`,se=`#graphql
|
|
94
94
|
query BundlesForProduct($handle: String!) {
|
|
95
95
|
product(handle: $handle) {
|
|
96
96
|
id
|
|
@@ -185,102 +185,1259 @@
|
|
|
185
185
|
}
|
|
186
186
|
}
|
|
187
187
|
}
|
|
188
|
-
`,
|
|
188
|
+
`,ce=`#graphql
|
|
189
189
|
mutation CartCreate($input: CartInput!) {
|
|
190
190
|
cartCreate(input: $input) {
|
|
191
191
|
cart { id checkoutUrl }
|
|
192
192
|
userErrors { field message }
|
|
193
193
|
}
|
|
194
194
|
}
|
|
195
|
-
`,
|
|
195
|
+
`,ue=`#graphql
|
|
196
196
|
mutation CartLinesAdd($cartId: ID!, $lines: [CartLineInput!]!) {
|
|
197
197
|
cartLinesAdd(cartId: $cartId, lines: $lines) {
|
|
198
198
|
cart { id checkoutUrl }
|
|
199
199
|
userErrors { field message }
|
|
200
200
|
}
|
|
201
201
|
}
|
|
202
|
-
`,y=class extends Error{constructor(r,e){super(r),this.reason=e,this.name="BundleParseError"}},ae=new Set(["fixed","mix_match","volume"]),ie=new Set(["active"]);function k(r,e){try{return oe(r,e)}catch(t){if(t instanceof y)return null;throw t}}function oe(r,e){let t=new Map(e.map(d=>[d.key,d])),a=t.get("title")?.value??"Bundle",n=t.get("bundle_type")?.value,s=t.get("status")?.value;if(!n||!ae.has(n))throw new y(`Invalid or missing bundle_type: ${n??"null"}`,"invalid_type");let i=n;if(!s||!ie.has(s))throw new y(`Bundle is not active: status=${s??"null"}`,"inactive");let l=s,o=t.get("starts_at")?.value??null,c=t.get("ends_at")?.value??null,u=new Date;if(o){let d=new Date(o);if(Number.isNaN(d.getTime()))throw new y(`Invalid starts_at: ${o}`,"invalid_type");if(d>u)throw new y(`Bundle not yet started: starts_at=${o}`,"not_started")}if(c){let d=new Date(c);if(Number.isNaN(d.getTime()))throw new y(`Invalid ends_at: ${c}`,"invalid_type");if(d<u)throw new y(`Bundle has expired: ends_at=${c}`,"expired")}let p=se(t),m=le(t),f=de(t),h={id:r,title:a,status:l,products:p,discountConfig:m,widgetConfig:f,startsAt:o,endsAt:c,discountLabel:t.get("discount_label")?.value??null,abTestId:t.get("ab_test_id")?.value??null,abTestConfig:B(t,"ab_test_config")};switch(i){case"fixed":return{...h,bundleType:"fixed"};case"volume":return{...h,bundleType:"volume",volumeTiers:ce(t)};case"mix_match":return{...h,bundleType:"mix_match",minQuantity:L(t,"min_quantity"),maxQuantity:L(t,"max_quantity")}}}function se(r){let e=[],t=r.get("products");if(t?.reference&&"variants"in t.reference&&e.push(t.reference),t?.references?.nodes)for(let n of t.references.nodes)"variants"in n?e.push(n):"products"in n&&n.products?.nodes&&e.push(...n.products.nodes);let a=r.get("collection");if(a?.references?.nodes)for(let n of a.references.nodes)"products"in n&&n.products?.nodes&&e.push(...n.products.nodes);return e}function le(r){return{discountType:r.get("discount_type")?.value??"percentage",discountValue:parseFloat(r.get("discount_value")?.value??"0"),allowStacking:r.get("allow_stacking")?.value==="true"}}function de(r){let e=B(r,"widget_config");if(e&&typeof e=="object"){let t=e;return{primaryColor:t.primaryColor??null,ctaText:t.ctaText??null,outOfStockBehavior:t.outOfStockBehavior??"hide"}}return{primaryColor:null,ctaText:null,outOfStockBehavior:"hide"}}function ce(r){let e=B(r,"volume_tiers");return Array.isArray(e)?e.filter(t=>typeof t=="object"&&t!==null).map(t=>({minQuantity:Number(t.minQuantity??0),discountType:t.discountType??"percentage",discountValue:Number(t.discountValue??0),label:t.label??null})):[]}function B(r,e){let t=r.get(e)?.value;if(!t)return null;try{return JSON.parse(t)}catch{return null}}function L(r,e){let t=r.get(e)?.value;if(!t)return null;let a=parseInt(t,10);return isNaN(a)?null:a}function q(r,e,t){return[...r].sort((n,s)=>n.minQuantity-s.minQuantity).map(n=>{let s=n.discountType==="percentage"?e*(n.discountValue/100):n.discountValue,i=Math.max(0,e-s),l=e-i,o=e>0?l/e*100:0,c=t>=n.minQuantity;return{tier:n,unitPrice:i,savings:l,savingsPercent:o,isActive:c}})}function F(r,e,t){return e!==null&&r<e?{valid:!1,totalQuantity:r,message:`Select at least ${e} item${e!==1?"s":""}`}:t!==null&&r>t?{valid:!1,totalQuantity:r,message:`Select at most ${t} item${t!==1?"s":""}`}:{valid:!0,totalQuantity:r,message:null}}async function U(r,e){await j(r,{shopDomain:r.shopDomain,eventType:"bundle_impression",bundleGid:e.bundleGid,bundleType:e.bundleType,productId:e.productId,abTestId:e.abTestId,abVariant:e.abVariant,occurredAt:new Date().toISOString()})}async function V(r,e){await j(r,{shopDomain:r.shopDomain,eventType:"bundle_add_to_cart",...e,occurredAt:new Date().toISOString()})}function H(r,e){if(typeof IntersectionObserver>"u")return e(),()=>{};let t=new IntersectionObserver(a=>{for(let n of a)n.isIntersecting&&(e(),t.unobserve(n.target))},{threshold:.5});return t.observe(r),()=>t.disconnect()}async function j(r,e){let t=`${r.appUrl}/api/analytics`,a=JSON.stringify(e);try{(await fetch(t,{method:"POST",headers:{"Content-Type":"application/json"},body:a})).ok||(await new Promise(s=>setTimeout(s,2e3)),await fetch(t,{method:"POST",headers:{"Content-Type":"application/json"},body:a}))}catch{try{typeof navigator<"u"&&navigator.sendBeacon&&navigator.sendBeacon(t,a)}catch{}}}var _e=720*60*60,Ce=720*60*60;var D=1e4,ue=[[/@import/i,"@import rules"],[/@charset/i,"@charset declarations"],[/expression\s*\(/i,"CSS expressions"],[/-moz-binding/i,"-moz-binding"],[/-webkit-binding/i,"-webkit-binding"],[/behavior\s*:/i,"behavior property"]],pe=/^(https:|\/[^/]|\.\/|\.\.\/|#)/;function me(r){if(r.length>D)return{ok:!1,error:`CSS exceeds ${D.toLocaleString("en-US")} character limit`};let e=r.replace(/\/\*[\s\S]*?\*\//g,"");try{e=e.replace(/\\([0-9a-fA-F]{1,6})[ \t\n\f]?/g,(n,s)=>{let i=parseInt(s,16);return i<0||i>1114111?"\uFFFD":String.fromCodePoint(i)}),e=e.replace(/\\\r?\n/g,""),e=e.replace(/\\([^\n\r\f0-9a-fA-F])/g,"$1")}catch{return{ok:!1,error:"CSS contains invalid unicode escape sequences"}}e=e.replace(/</g,"").replace(/>/g,"");for(let[n,s]of ue)if(n.test(e))return{ok:!1,error:`CSS contains blocked pattern: ${s}`};let t=/url\s*\(\s*([\s\S]*?)\s*\)/gi,a;for(;(a=t.exec(e))!==null;){let n=a[1].trim();if((n.startsWith("'")||n.startsWith('"'))&&(n=n.slice(1)),(n.endsWith("'")||n.endsWith('"'))&&(n=n.slice(0,-1)),n=n.trim(),n&&!pe.test(n))return{ok:!1,error:"CSS url() values must use https:// or relative paths"}}return{ok:!0,css:e}}var be="lb-custom-css-";function z(r,e){if(typeof document>"u"||!e)return!1;let t=me(e);if(!t.ok||!t.css.trim())return!1;let a=be+fe(r),n=document.getElementById(a);return n||(n=document.createElement("style"),n.id=a,n.setAttribute("data-lime-bundles","custom-css"),document.head.appendChild(n)),n.textContent!==t.css&&(n.textContent=t.css),!0}function fe(r){let e=2166136261;for(let t=0;t<r.length;t++)e^=r.charCodeAt(t),e=Math.imul(e,16777619);return(e>>>0).toString(16)}function _(r,e){let t=typeof r=="string"?parseFloat(r):r;try{return new Intl.NumberFormat(void 0,{style:"currency",currency:e}).format(t)}catch{return`${e} ${t.toFixed(2)}`}}function G(r,e,t){let a=e.products[0]?.priceRange.minVariantPrice.currencyCode??"USD",n=document.createElement("h3");if(n.className="lb-bundle__title",n.textContent=e.title,n.setAttribute("part","title"),r.appendChild(n),e.discountLabel){let l=document.createElement("span");l.className="lb-bundle__discount-badge",l.textContent=e.discountLabel,r.appendChild(l)}let s=document.createElement("div");s.className="lb-bundle__products";for(let l of e.products){let o=document.createElement("div");if(o.className="lb-bundle__product",o.setAttribute("part","product"),l.featuredImage){let u=document.createElement("img");u.src=l.featuredImage.url,u.alt=l.featuredImage.altText??l.title,u.className="lb-bundle__product-image",u.loading="lazy",o.appendChild(u)}let c=document.createElement("div");c.className="lb-bundle__product-info",c.innerHTML=`
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
202
|
+
`,U=class extends Error{constructor(e,t){super(e),this.reason=t,this.name="BundleParseError"}},D={header:{textColor:"#FFFFFF",headerStyle:"gradient",gradientStart:"#C62828",gradientEnd:"#AD1457",saveBadgeBgColor:"#FFFFFF",saveBadgeTextColor:"#AD1457",saveBadgeBorderColor:"#FFFFFF",saveBadgeBorderWidth:0,saveBadgeBorderRadius:8,countdownBgColor:"#FFF0F3",countdownTextColor:"#C62828"},layout:{backgroundColor:"#FFFFFF",borderColor:"#E5E5E5",borderWidth:1,borderRadius:12},productList:{textColor:"#1A1A1A",imageBorderWidth:0,imageBorderColor:"#E5E5E5",imageBorderRadius:8,variantBorderWidth:1,variantBorderColor:"#E5E5E5",variantBorderRadius:8,showPrice:!0,showCompareAtPrice:!0,showCountBubble:!0,countBubbleBgColor:"#1A1A1A",countBubbleTextColor:"#FFFFFF"},pricing:{showSaveBadge:!0,showComparePrice:!0,showPerUnitPrice:!0,showItemCount:!0,showCompareAtPrice:!0},cta:{ctaText:"Add to cart",primaryColor:"#1A1A1A",buttonTextColor:"#FFFFFF",borderWidth:0,borderColor:"#1A1A1A",borderRadius:12},savingsBar:{visible:!0,bgColor:"#EDFBF1",textColor:"#2DB554",borderWidth:0,borderColor:"#2DB554",borderRadius:8},countdown:{showCountdown:!0},popularBadge:{visible:!0,text:"Most Popular",bgColor:"#1A1A1A",textColor:"#FFFFFF",borderWidth:0,borderColor:"#1A1A1A",borderRadius:12},outOfStockBehavior:"show_greyed_out",showSearch:!0,pickerBgColor:"#FFFFFF",pickerTextColor:"#1A1A1A",pickerBorderWidth:0,pickerBorderColor:"#E5E5E5",pickerBorderRadius:16,pickerSearchBorderWidth:1,pickerSearchBorderColor:"#E5E5E5",pickerSearchBorderRadius:8,pickerProductBorderWidth:0,pickerProductBorderColor:"#E5E5E5",pickerProductBorderRadius:8,pickerShowCountBubble:!0,pickerCountBubbleBgColor:"#1A1A1A",pickerCountBubbleTextColor:"#FFFFFF",pickerAddBgColor:"#1A1A1A",pickerAddLabelColor:"#FFFFFF",pickerAddBorderWidth:0,pickerAddBorderColor:"#1A1A1A",pickerAddBorderRadius:8,pickerVariantBorderWidth:1,pickerVariantBorderColor:"#1A1A1A",pickerVariantBorderRadius:8,tierBorderColor:"#E5E5E5",tierBorderWidth:1,tierBorderRadius:12,tierSelectedBorderColor:"#1A1A1A",tierSelectedBorderWidth:2,defaultTier:"first"};function ze(e){if(!e||typeof e!="object")return D;let t=e;return{...D,...t,defaultTier:je(t.defaultTier),header:{...D.header,...t.header??{}},layout:{...D.layout,...t.layout??{}},productList:{...D.productList,...t.productList??{}},pricing:{...D.pricing,...t.pricing??{}},cta:{...D.cta,...t.cta??{}},savingsBar:{...D.savingsBar,...t.savingsBar??{}},countdown:{...D.countdown,...t.countdown??{}},popularBadge:{...D.popularBadge,...t.popularBadge??{}}}}function je(e){return e==="first"||e==="best_value"||typeof e=="number"&&Number.isInteger(e)&&e>=0?e:D.defaultTier}function Ge(e){return{primaryColor:e.cta.primaryColor,backgroundColor:e.layout.backgroundColor,textColor:e.productList.textColor,borderColor:e.layout.borderColor,borderWidth:e.layout.borderWidth,buttonTextColor:e.cta.buttonTextColor,ctaBorderWidth:e.cta.borderWidth,ctaBorderColor:e.cta.borderColor,ctaBorderRadius:e.cta.borderRadius,savingsBarBgColor:e.savingsBar.bgColor,savingsBarTextColor:e.savingsBar.textColor,savingsBarBorderWidth:e.savingsBar.borderWidth,savingsBarBorderColor:e.savingsBar.borderColor,savingsBarBorderRadius:e.savingsBar.borderRadius,borderRadius:e.layout.borderRadius,headerTextColor:e.header.textColor,saveBadgeBgColor:e.header.saveBadgeBgColor,saveBadgeTextColor:e.header.saveBadgeTextColor,saveBadgeBorderColor:e.header.saveBadgeBorderColor,saveBadgeBorderWidth:e.header.saveBadgeBorderWidth,saveBadgeBorderRadius:e.header.saveBadgeBorderRadius,countdownBgColor:e.header.countdownBgColor,countdownTextColor:e.header.countdownTextColor,headerStyle:e.header.headerStyle,headerGradientStart:e.header.gradientStart,headerGradientEnd:e.header.gradientEnd,showSaveBadge:e.pricing.showSaveBadge,imageBorderWidth:e.productList.imageBorderWidth,imageBorderColor:e.productList.imageBorderColor,imageBorderRadius:e.productList.imageBorderRadius,variantBorderWidth:e.productList.variantBorderWidth,variantBorderColor:e.productList.variantBorderColor,variantBorderRadius:e.productList.variantBorderRadius,countBubbleBgColor:e.productList.countBubbleBgColor,countBubbleTextColor:e.productList.countBubbleTextColor,showProductPrice:e.productList.showPrice,showProductCompareAtPrice:e.productList.showCompareAtPrice,showCountBubble:e.productList.showCountBubble,showCountdown:e.countdown.showCountdown,ctaText:e.cta.ctaText,outOfStockBehavior:e.outOfStockBehavior,showComparePrice:e.pricing.showComparePrice,showPerUnitPrice:e.pricing.showPerUnitPrice,showItemCount:e.pricing.showItemCount,showCompareAtPrice:e.pricing.showCompareAtPrice,showMostPopular:e.popularBadge.visible,popularBadgeText:e.popularBadge.text,popularBadgeBgColor:e.popularBadge.bgColor,popularBadgeTextColor:e.popularBadge.textColor,popularBadgeBorderWidth:e.popularBadge.borderWidth,popularBadgeBorderColor:e.popularBadge.borderColor,popularBadgeBorderRadius:e.popularBadge.borderRadius,showSearch:e.showSearch,pickerBgColor:e.pickerBgColor,pickerTextColor:e.pickerTextColor,pickerBorderWidth:e.pickerBorderWidth,pickerBorderColor:e.pickerBorderColor,pickerBorderRadius:e.pickerBorderRadius,pickerSearchBorderWidth:e.pickerSearchBorderWidth,pickerSearchBorderColor:e.pickerSearchBorderColor,pickerSearchBorderRadius:e.pickerSearchBorderRadius,pickerProductBorderWidth:e.pickerProductBorderWidth,pickerProductBorderColor:e.pickerProductBorderColor,pickerProductBorderRadius:e.pickerProductBorderRadius,pickerShowCountBubble:e.pickerShowCountBubble,pickerCountBubbleBgColor:e.pickerCountBubbleBgColor,pickerCountBubbleTextColor:e.pickerCountBubbleTextColor,pickerAddBgColor:e.pickerAddBgColor,pickerAddLabelColor:e.pickerAddLabelColor,pickerAddBorderWidth:e.pickerAddBorderWidth,pickerAddBorderColor:e.pickerAddBorderColor,pickerAddBorderRadius:e.pickerAddBorderRadius,pickerVariantBorderWidth:e.pickerVariantBorderWidth,pickerVariantBorderColor:e.pickerVariantBorderColor,pickerVariantBorderRadius:e.pickerVariantBorderRadius,tierBorderColor:e.tierBorderColor,tierBorderWidth:e.tierBorderWidth,tierBorderRadius:e.tierBorderRadius,tierSelectedBorderColor:e.tierSelectedBorderColor,tierSelectedBorderWidth:e.tierSelectedBorderWidth,defaultTier:e.defaultTier,...e.popularBadge.tierIndex!==void 0&&{mostPopularTierIndex:e.popularBadge.tierIndex}}}var Qe={primaryColor:"--lb-primary-color",backgroundColor:"--lb-bg",textColor:"--lb-text",imageBorderWidth:"--lb-image-border-width",imageBorderColor:"--lb-image-border-color",imageBorderRadius:"--lb-image-border-radius",variantBorderWidth:"--lb-variant-border-width",variantBorderColor:"--lb-variant-border-color",variantBorderRadius:"--lb-variant-radius",countBubbleBgColor:"--lb-qty-badge-bg",countBubbleTextColor:"--lb-qty-badge-color",borderColor:"--lb-border",borderWidth:"--lb-border-width",buttonTextColor:"--lb-btn-text",borderRadius:"--lb-radius",headerTextColor:"--lb-header-text",saveBadgeBgColor:"--lb-save-badge-bg",saveBadgeTextColor:"--lb-save-badge-text",saveBadgeBorderColor:"--lb-save-badge-border-color",saveBadgeBorderWidth:"--lb-save-badge-border-width",saveBadgeBorderRadius:"--lb-save-badge-radius",countdownBgColor:"--lb-countdown-bg",countdownTextColor:"--lb-countdown-text",ctaBorderWidth:"--lb-cta-border-width",ctaBorderColor:"--lb-cta-border-color",ctaBorderRadius:"--lb-cta-radius",savingsBarBgColor:"--lb-savings-bar-bg",savingsBarTextColor:"--lb-savings-bar-text",savingsBarBorderWidth:"--lb-savings-bar-border-width",savingsBarBorderColor:"--lb-savings-bar-border-color",savingsBarBorderRadius:"--lb-savings-bar-radius",tierBorderColor:"--lb-tier-border-color",tierBorderWidth:"--lb-tier-border-width",tierBorderRadius:"--lb-tier-radius",tierSelectedBorderColor:"--lb-tier-selected-border-color",tierSelectedBorderWidth:"--lb-tier-selected-border-width",popularBadgeBgColor:"--lb-popular-badge-bg",popularBadgeTextColor:"--lb-popular-badge-text",popularBadgeBorderWidth:"--lb-popular-badge-border-width",popularBadgeBorderColor:"--lb-popular-badge-border-color",popularBadgeBorderRadius:"--lb-popular-badge-radius",headerGradientStart:"--lb-header-start",headerGradientEnd:"--lb-header-end",pickerBgColor:"--lb-picker-bg",pickerTextColor:"--lb-picker-text",pickerBorderWidth:"--lb-picker-border-width",pickerBorderColor:"--lb-picker-border-color",pickerBorderRadius:"--lb-picker-radius",pickerSearchBorderWidth:"--lb-picker-search-border-width",pickerSearchBorderColor:"--lb-picker-search-border-color",pickerSearchBorderRadius:"--lb-picker-search-radius",pickerProductBorderWidth:"--lb-picker-product-border-width",pickerProductBorderColor:"--lb-picker-product-border-color",pickerProductBorderRadius:"--lb-picker-product-radius",pickerCountBubbleBgColor:"--lb-picker-qty-badge-bg",pickerCountBubbleTextColor:"--lb-picker-qty-badge-color",pickerAddBgColor:"--lb-picker-add-bg",pickerAddLabelColor:"--lb-picker-add-label",pickerAddBorderWidth:"--lb-picker-add-border-width",pickerAddBorderColor:"--lb-picker-add-border-color",pickerAddBorderRadius:"--lb-picker-add-radius",pickerVariantBorderWidth:"--lb-picker-variant-border-width",pickerVariantBorderColor:"--lb-picker-variant-border-color",pickerVariantBorderRadius:"--lb-picker-variant-radius"},Ye=new Set(["borderRadius","borderWidth","saveBadgeBorderWidth","saveBadgeBorderRadius","tierBorderWidth","tierBorderRadius","tierSelectedBorderWidth","savingsBarBorderWidth","savingsBarBorderRadius","ctaBorderWidth","ctaBorderRadius","popularBadgeBorderWidth","popularBadgeBorderRadius","imageBorderWidth","imageBorderRadius","variantBorderWidth","variantBorderRadius","pickerBorderWidth","pickerBorderRadius","pickerSearchBorderWidth","pickerSearchBorderRadius","pickerProductBorderWidth","pickerProductBorderRadius","pickerAddBorderWidth","pickerAddBorderRadius","pickerVariantBorderWidth","pickerVariantBorderRadius"]);function pe(e,t){let n=Ge(t);for(let[o,r]of Object.entries(Qe)){let a=n[o];if(a==null)continue;let i=Ye.has(o)?`${a}px`:String(a);e.style.setProperty(r,i)}e.style.setProperty("--lb-product-price-display",t.productList.showPrice?"block":"none"),e.style.setProperty("--lb-product-compare-display",t.productList.showCompareAtPrice?"inline":"none"),e.style.setProperty("--lb-qty-badge-display",t.productList.showCountBubble?"flex":"none"),e.style.setProperty("--lb-picker-qty-badge-display",t.pickerShowCountBubble?"flex":"none"),t.header.headerStyle==="solid"?e.style.setProperty("--lb-header-bg",t.header.gradientStart):e.style.setProperty("--lb-header-bg",`linear-gradient(135deg, ${t.header.gradientStart}, ${t.header.gradientEnd})`)}var Ke=new Set(["fixed","mix_match","volume"]),Xe=new Set(["active"]);function K(e,t){try{return Je(e,t)}catch(n){if(n instanceof U)return null;throw n}}function Je(e,t){let n=new Map(t.map(v=>[v.key,v])),o=n.get("title")?.value??"Bundle",r=n.get("bundle_type")?.value,a=n.get("status")?.value;if(!r||!Ke.has(r))throw new U(`Invalid or missing bundle_type: ${r??"null"}`,"invalid_type");let i=r;if(!a||!Xe.has(a))throw new U(`Bundle is not active: status=${a??"null"}`,"inactive");let d=a,l=n.get("starts_at")?.value??null,u=n.get("ends_at")?.value??null,c=new Date;if(l){let v=new Date(l);if(Number.isNaN(v.getTime()))throw new U(`Invalid starts_at: ${l}`,"invalid_type");if(v>c)throw new U(`Bundle not yet started: starts_at=${l}`,"not_started")}if(u){let v=new Date(u);if(Number.isNaN(v.getTime()))throw new U(`Invalid ends_at: ${u}`,"invalid_type");if(v<c)throw new U(`Bundle has expired: ends_at=${u}`,"expired")}let p=Ze(n),f=et(n),h=tt(n),m={id:e,title:o,description:n.get("description")?.value||null,status:d,products:p,discountConfig:f,widgetConfig:h,startsAt:l,endsAt:u,discountLabel:n.get("discount_label")?.value??null,selectedVariantIds:rt(n),productQuantities:re(n,"product_quantities"),variantQuantities:re(n,"variant_quantities"),abTestId:n.get("ab_test_id")?.value??null,abVariantB:nt(n)};switch(i){case"fixed":return{...m,bundleType:"fixed"};case"volume":return{...m,bundleType:"volume",volumeTiers:ot(n)};case"mix_match":return{...m,bundleType:"mix_match",minQuantity:ne(n,"min_quantity",{min:1}),maxQuantity:ne(n,"max_quantity",{min:1})}}}function Ze(e){let t=[],n=e.get("products");if(n?.reference&&"variants"in n.reference&&t.push(n.reference),n?.references?.nodes)for(let r of n.references.nodes)"variants"in r?t.push(r):"products"in r&&r.products?.nodes&&t.push(...r.products.nodes);let o=e.get("collection");if(o?.references?.nodes)for(let r of o.references.nodes)"products"in r&&r.products?.nodes&&t.push(...r.products.nodes);return t}function et(e){return{discountType:e.get("discount_type")?.value??"percentage",discountValue:parseFloat(e.get("discount_value")?.value??"0"),allowStacking:e.get("allow_stacking")?.value==="true"}}function tt(e){return ze(N(e,"widget_config"))}function rt(e){let t=N(e,"selected_variant_ids");if(!Array.isArray(t))return null;let n=[];for(let o of t)Array.isArray(o)?n.push(o.filter(r=>typeof r=="string")):n.push([]);return n}function re(e,t){let n=N(e,t);if(!n||typeof n!="object"||Array.isArray(n))return{};let o={};for(let[r,a]of Object.entries(n)){let i=typeof a=="number"?a:Number(a);Number.isFinite(i)&&i>=0&&(o[r]=i)}return o}function nt(e){if(!e.get("ab_test_id")?.value)return null;let n={},o=e.get("ab_title")?.value;o&&(n.title=o);let r=e.get("ab_description")?.value;r&&(n.description=r);let a=e.get("ab_discount_type")?.value,i=e.get("ab_discount_value")?.value;if(a&&(a==="percentage"||a==="fixed_amount")&&i){let l=parseFloat(i);Number.isFinite(l)&&(n.discountConfig={discountType:a,discountValue:l,allowStacking:e.get("allow_stacking")?.value==="true"})}let d=N(e,"ab_volume_tiers");return Array.isArray(d)&&(n.volumeTiers=d.filter(l=>typeof l=="object"&&l!==null).map(be)),Object.keys(n).length===0?null:n}function ot(e){let t=N(e,"volume_tiers");return Array.isArray(t)?t.filter(n=>typeof n=="object"&&n!==null).map(be):[]}function be(e){let t=Number(e.minQuantity??0),n={minQuantity:Number.isFinite(t)&&t>=0?t:0};return typeof e.percentage=="number"&&Number.isFinite(e.percentage)&&(n.percentage=e.percentage),typeof e.amount=="number"&&Number.isFinite(e.amount)&&(n.amount=e.amount),n}function N(e,t){let n=e.get(t)?.value;if(!n)return null;try{return JSON.parse(n)}catch{return null}}function ne(e,t,n={}){let o=e.get(t)?.value;if(!o)return null;let r=parseInt(o,10);return isNaN(r)||n.min!==void 0&&r<n.min?null:r}function he(e){let t=e.abVariantB;if(!t)return e;let n=t.title??e.title,o=t.description!==void 0?t.description:e.description,r=t.discountConfig??e.discountConfig;switch(e.bundleType){case"volume":return{...e,title:n,description:o,discountConfig:r,volumeTiers:t.volumeTiers??e.volumeTiers};case"mix_match":return{...e,title:n,description:o,discountConfig:r};case"fixed":return{...e,title:n,description:o,discountConfig:r}}}async function me(e,t){await ve(e,{shopDomain:e.shopDomain,eventType:"bundle_impression",bundleGid:t.bundleGid,bundleType:t.bundleType,productId:t.productId,abTestId:t.abTestId,abVariant:t.abVariant,occurredAt:new Date().toISOString()})}async function ge(e,t){await ve(e,{shopDomain:e.shopDomain,eventType:"bundle_add_to_cart",...t,occurredAt:new Date().toISOString()})}function fe(e,t){if(typeof IntersectionObserver>"u")return t(),()=>{};let n=new IntersectionObserver(o=>{for(let r of o)r.isIntersecting&&(t(),n.unobserve(r.target))},{threshold:.5});return n.observe(e),()=>n.disconnect()}async function ve(e,t){let n=`${e.appUrl}/api/analytics`,o=JSON.stringify(t);try{(await fetch(n,{method:"POST",headers:{"Content-Type":"application/json"},body:o})).ok||(await new Promise(a=>setTimeout(a,2e3)),await fetch(n,{method:"POST",headers:{"Content-Type":"application/json"},body:o}))}catch{try{typeof navigator<"u"&&navigator.sendBeacon&&navigator.sendBeacon(n,o)}catch{}}}var it=!1;function at(){if(it)return!0;if(typeof window>"u")return!1;let e=window.Shopify;try{return e?.customerPrivacy?.analyticsProcessingAllowed?.()===!0}catch{return!1}}var oe="lb_session",lt=720*60*60,dt=720*60*60;function xe(e){return`__Host-_lb_ab_${e}`}async function Ce(e,t,n,o){if(typeof document>"u")return null;let r=st(o);if(r&&r.testId===n)return{variant:r.variant,testId:n,persisted:!0};if(!at())return{variant:"A",testId:n,persisted:!1};let a=ut(),i=pt(a,n);ct(o,n,i);try{fetch(`${e}/api/ab-assign`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({shopDomain:t,testId:n,sessionId:a,variant:i})}).catch(()=>{})}catch{}return{variant:i,testId:n,persisted:!0}}function st(e){if(typeof document>"u")return null;let n=`${xe(e)}=`,r=document.cookie.split(";").map(l=>l.trim()).find(l=>l.startsWith(n));if(!r)return null;let a=r.substring(n.length),[i,d]=a.split("|");return i!=="A"&&i!=="B"||!d?null:{testId:d,variant:i}}function ct(e,t,n){if(typeof document>"u")return;let o=xe(e),r=`${n}|${t}|${Date.now()}`;document.cookie=`${o}=${r}; Path=/; Max-Age=${dt}; SameSite=Lax; Secure`}function ut(){if(typeof document>"u")return ie();let t=document.cookie.split(";").map(o=>o.trim()).find(o=>o.startsWith(`${oe}=`))?.split("=")[1];if(t)return t;let n=ie();return document.cookie=`${oe}=${n}; path=/; max-age=${lt}; SameSite=Lax; Secure`,n}function ie(){return typeof crypto<"u"&&crypto.randomUUID?crypto.randomUUID():"xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g,e=>{let t=Math.random()*16|0;return(e==="x"?t:t&3|8).toString(16)})}function pt(e,t){let n=e+":"+t,o=2166136261;for(let r=0;r<n.length;r++)o^=n.charCodeAt(r),o=Math.imul(o,16777619);return(o>>>0)%2===0?"A":"B"}var ae=1e4,bt=[[/@import/i,"@import rules"],[/@charset/i,"@charset declarations"],[/expression\s*\(/i,"CSS expressions"],[/-moz-binding/i,"-moz-binding"],[/-webkit-binding/i,"-webkit-binding"],[/behavior\s*:/i,"behavior property"]],ht=/^(https:|\/[^/]|\.\/|\.\.\/|#)/;function X(e){if(e.length>ae)return{ok:!1,error:`CSS exceeds ${ae.toLocaleString("en-US")} character limit`};let t=e.replace(/\/\*[\s\S]*?\*\//g,"");try{t=t.replace(/\\([0-9a-fA-F]{1,6})[ \t\n\f]?/g,(r,a)=>{let i=parseInt(a,16);return i<0||i>1114111?"\uFFFD":String.fromCodePoint(i)}),t=t.replace(/\\\r?\n/g,""),t=t.replace(/\\([^\n\r\f0-9a-fA-F])/g,"$1")}catch{return{ok:!1,error:"CSS contains invalid unicode escape sequences"}}t=t.replace(/</g,"").replace(/>/g,"");for(let[r,a]of bt)if(r.test(t))return{ok:!1,error:`CSS contains blocked pattern: ${a}`};let n=/url\s*\(\s*([\s\S]*?)\s*\)/gi,o;for(;(o=n.exec(t))!==null;){let r=o[1].trim();if((r.startsWith("'")||r.startsWith('"'))&&(r=r.slice(1)),(r.endsWith("'")||r.endsWith('"'))&&(r=r.slice(0,-1)),r=r.trim(),r&&!ht.test(r))return{ok:!1,error:"CSS url() values must use https:// or relative paths"}}return{ok:!0,css:t}}var mt="lb-custom-css-";function ye(e,t){if(typeof document>"u"||!t)return!1;let n=X(t);if(!n.ok||!n.css.trim())return!1;let o=mt+gt(e),r=document.getElementById(o);return r||(r=document.createElement("style"),r.id=o,r.setAttribute("data-lime-bundles","custom-css"),document.head.appendChild(r)),r.textContent!==n.css&&(r.textContent=n.css),!0}function gt(e){let t=2166136261;for(let n=0;n<e.length;n++)t^=e.charCodeAt(n),t=Math.imul(t,16777619);return(t>>>0).toString(16)}function P(e){if(e==null)return 0;let t=typeof e=="string"?parseFloat(e):e;return Number.isFinite(t)?Math.round(t*100):0}function _(e,t){try{return new Intl.NumberFormat(void 0,{style:"currency",currency:t}).format(e/100)}catch{return`${t} ${(e/100).toFixed(2)}`}}function we(e,t){return Math.max(0,e-Math.floor(e*t/100))}function J(e,t=e.productQuantities,n=e.widgetConfig.pricing.showSaveBadge){let{discountType:o,discountValue:r}=e.discountConfig,a=[],i=0,d=0;for(let p of e.products){let f=p.variants.nodes.find(C=>C.availableForSale)??p.variants.nodes[0];if(!f)continue;let h=P(f.price.amount),m=t[p.id]??1,v=h*m,T=f.compareAtPrice?P(f.compareAtPrice.amount):null;if(a.push({unitCents:h,qty:m,lineCents:v,compareCents:T}),i+=v,o==="percentage"){let C=we(h,r);d+=C*m}else d+=v}o==="fixed_amount"&&(d=Math.max(0,i-Math.round(r*100)));let l=Math.max(0,i-d),u=e.products[0]?.priceRange.minVariantPrice.currencyCode??"USD",c="";return n&&l>0&&(o==="percentage"&&r>0?c=`-${Math.round(r)}%`:o==="fixed_amount"&&r>0&&(c=`-${_(Math.round(r*100),u)}`)),{rows:a,totalCents:i,saleCents:d,savingsCents:l,headerBadge:c,currency:u}}function G(e,t){if(t.discountType==="percentage"){let n=Math.floor(e*t.discountValue/100);return Math.max(0,e-n)}return Math.max(0,e-Math.round(t.discountValue*100))}var L=152;function O(e,t={}){if(!e)return"";try{let n=new URL(e);return t.width!==void 0&&n.searchParams.set("width",String(t.width)),t.height!==void 0&&n.searchParams.set("height",String(t.height)),t.crop&&n.searchParams.set("crop",t.crop),n.toString()}catch{return e}}function _e(e){if(!Number.isFinite(e)||e<=0)return"";let t=Math.floor(e/1e3),n=Math.floor(t/86400),o=Math.floor(t%86400/3600),r=Math.floor(t%3600/60),a=t%60,i=d=>String(d).padStart(2,"0");return n>0?`${n}d ${i(o)}h ${i(r)}m ${i(a)}s`:`${i(o)}h ${i(r)}m ${i(a)}s`}function H(e){let t=ft(e);if(t===null||t<=Date.now())return null;let n=t,o=document.createElement("div");o.className="lb-bundle-countdown",o.setAttribute("data-countdown","");let r=document.createElement("div");r.className="lb-bundle-countdown__label";let a=document.createElement("span");a.textContent="Ends in",r.appendChild(a),o.appendChild(r);let i=document.createElement("span");i.className="lb-bundle-countdown__timer",i.setAttribute("data-countdown-timer",""),o.appendChild(i);let d=null;function l(){let c=n-Date.now();if(c<=0){o.style.display="none",u();return}i.textContent=_e(c)}function u(){d!==null&&(clearInterval(d),d=null)}return l(),d=setInterval(l,1e3),{el:o,stop:u}}function ft(e){let t=Date.parse(e);return Number.isFinite(t)?t:null}function s(e,t,n={}){let o=document.createElement(e);t&&(o.className=t);for(let[r,a]of Object.entries(n))o.setAttribute(r,a);return o}var vt=`
|
|
203
|
+
<svg class="lb-bundle-placeholder-icon" viewBox="0 0 28 28" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false">
|
|
204
|
+
<rect x="4" y="4" width="20" height="20" rx="3"></rect>
|
|
205
|
+
<line x1="4" y1="20" x2="24" y2="20"></line>
|
|
206
|
+
<circle cx="10" cy="12" r="2"></circle>
|
|
207
|
+
</svg>`;function Be(e,t,n,o){let r=t.widgetConfig,a=(C,k)=>{let S=t.variantQuantities[k];return S!==void 0?S:t.productQuantities[C]??1},i=[],d=0;if(t.products.forEach((C,k)=>{let S=xt(t,C,k);S.qty!==0&&(S.isOos&&(d++,r.outOfStockBehavior==="hide")||i.push(S))}),i.length===0)return;let l=t.products[0]?.priceRange.minVariantPrice.currencyCode??"USD",u=s("div","lb-fixed",{"data-discount-type":t.discountConfig.discountType,"data-discount-value":String(t.discountConfig.discountValue)}),c=Ct(t,l);if(u.appendChild(c.el),r.countdown.showCountdown&&t.endsAt){let C=H(t.endsAt);C&&(u.appendChild(C.el),o?.(C.stop))}let p=s("div","lb-fixed__products"),f=[];i.forEach(C=>{let k=wt(C,l,a,()=>{T()});f.push(k),p.appendChild(k.el)}),u.appendChild(p),u.appendChild(s("div","lb-bundle-divider"));let h=_t(t);u.appendChild(h.el);let m=r.savingsBar.visible?Bt():null;m&&u.appendChild(m.el);let v=kt(t,d,()=>{let C=i.filter(k=>k.selected).map(k=>({merchandiseId:k.selected.id,quantity:k.qty,attributes:[{key:"_lime_bundle_gid",value:t.id},{key:"_lime_bundle_type",value:t.bundleType}]}));C.length!==0&&n(C)});u.appendChild(v),u.appendChild(s("p","lb-bundle-error",{"data-error":"","aria-live":"polite"})),u.appendChild(s("span","lb-visually-hidden",{"data-status":"","aria-live":"polite"})),e.appendChild(u),T();function T(){let C=i.reduce((b,B)=>{if(!B.selected)return b;let y=P(B.selected.price.amount);return b+y*B.qty},0),k=St(C,t.discountConfig,i),S=Math.max(0,C-k);h.update({totalCents:C,saleCents:k,savingsCents:S,currency:l}),m&&m.update({savingsCents:S,currency:l}),c.refresh(yt(t,C,k,l))}}function xt(e,t,n){let o=e.selectedVariantIds?.[n]??null,r=t.variants.nodes.filter(p=>p.availableForSale),a=o&&o.length>0?r.filter(p=>o.includes(p.id)):r,i=a.length===0,d=a[0]??null,l=e.productQuantities[t.id]??1,c=(d?e.variantQuantities[d.id]:void 0)??l;return{product:t,eligibleVariants:a,selected:d,qty:c,isOos:i}}function Ct(e,t){let n=e.widgetConfig,o=s("div","lb-bundle-header"),r=s("div","lb-bundle-header__content"),a=s("h3","lb-bundle-title");if(a.textContent=e.title,r.appendChild(a),e.description){let l=s("p","lb-bundle-subtitle");l.textContent=e.description,r.appendChild(l)}o.appendChild(r);let i=s("span","lb-bundle-header__badge",{"data-header-badge":""});o.appendChild(i);let d=J(e,e.productQuantities,n.pricing.showSaveBadge);return d.headerBadge?i.textContent=d.headerBadge:i.style.display="none",{el:o,refresh(l){if(!n.pricing.showSaveBadge){i.style.display="none";return}l?(i.textContent=l,i.style.display=""):i.style.display="none"}}}function yt(e,t,n,o){if(!e.widgetConfig.pricing.showSaveBadge)return"";let r=t-n;if(r<=0)return"";let a=e.discountConfig;return a.discountType==="percentage"&&a.discountValue>0?`-${Math.round(a.discountValue)}%`:a.discountType==="fixed_amount"&&a.discountValue>0?`-${_(Math.round(a.discountValue*100),o)}`:`-${_(r,o)}`}function wt(e,t,n,o){let r=s("div",e.isOos?"lb-bundle-product-row lb-bundle-product-row--oos":"lb-bundle-product-row",{"data-product-id":e.product.id.replace(/^.*\//,""),...e.isOos?{"aria-disabled":"true"}:{}}),a=s("div","lb-bundle-thumbnail",{"data-thumbnail":""});if(e.product.featuredImage){let u=document.createElement("img");u.src=O(e.product.featuredImage.url,{width:L,height:L,crop:"center"}),u.alt=e.product.featuredImage.altText??e.product.title,u.width=L,u.height=L,u.loading="lazy",a.appendChild(u)}else a.insertAdjacentHTML("beforeend",vt);let i=null;e.isOos||(i=s("span","lb-bundle-qty-badge",{"data-qty-badge":""}),i.textContent=String(e.qty),a.appendChild(i)),r.appendChild(a);let d=s("div","lb-bundle-product-info"),l=document.createElement("a");if(l.className="lb-bundle-product-name",l.href=`/products/${e.product.handle}`,l.textContent=e.product.title,d.appendChild(l),e.isOos){let u=s("span","lb-bundle-oos-label");u.textContent="Out of stock",d.appendChild(u)}else if(e.selected){let u=s("span","lb-bundle-product-prices"),c=s("span","lb-bundle-product-compare-price",{"data-product-compare-price":""}),p=s("span","lb-bundle-product-price",{"data-product-price":""});u.appendChild(c),u.appendChild(p),d.appendChild(u);let f=h=>{let m=P(h.price.amount);if(p.textContent=_(m,t),h.compareAtPrice){let v=P(h.compareAtPrice.amount);v>m?(c.textContent=_(v,t),c.removeAttribute("hidden")):c.setAttribute("hidden","")}else c.setAttribute("hidden","")};if(f(e.selected),e.eligibleVariants.length>1){let h=document.createElement("select");h.className="lb-bundle-variant-select",h.setAttribute("data-variant-select",""),h.setAttribute("aria-label",`Select variant for ${e.product.title}`),e.eligibleVariants.forEach(m=>{let v=document.createElement("option");v.value=m.id,v.textContent=m.title,m.id===e.selected?.id&&(v.selected=!0),h.appendChild(v)}),h.addEventListener("change",()=>{let m=e.eligibleVariants.find(v=>v.id===h.value);m&&(e.selected=m,e.qty=n(e.product.id,m.id),i&&(i.textContent=String(e.qty)),f(m),o())}),d.appendChild(h)}else if(e.eligibleVariants.length===1&&e.product.variants.nodes.length>1){let h=s("span","lb-bundle-variant-badge");h.textContent=e.eligibleVariants[0].title,d.appendChild(h)}}return r.appendChild(d),{el:r,state:e}}function _t(e){let t=s("div","lb-bundle-pricing"),n=s("span","lb-bundle-pricing__label");n.textContent="Bundle price",t.appendChild(n);let o=s("span","lb-bundle-pricing__prices"),r=s("span","lb-bundle-compare-price",{"data-compare-price":""});r.style.display="none",o.appendChild(r);let a=s("span","lb-bundle-sale-price",{"data-sale-price":""});return o.appendChild(a),t.appendChild(o),{el:t,update({totalCents:i,saleCents:d,savingsCents:l,currency:u}){a.textContent=_(d,u),e.widgetConfig.pricing.showCompareAtPrice&&l>0?(r.textContent=_(i,u),r.style.display=""):r.style.display="none"}}}function Bt(){let e=s("div","lb-bundle-savings-bar",{"data-savings-bar":""}),t=document.createElement("span");t.textContent="You save",e.appendChild(t);let n=s("span","",{"data-savings-amount":""});return e.appendChild(n),{el:e,update({savingsCents:o,currency:r}){if(o<=0){e.style.display="none";return}e.style.display="",n.textContent=_(o,r)}}}function kt(e,t,n){let o=document.createElement("button");return o.type="button",o.className="lb-bundle-cta",o.setAttribute("data-add-bundle",""),t>0?(o.disabled=!0,o.textContent=`${t} item${t===1?"":"s"} out of stock`):(o.textContent=e.widgetConfig.cta.ctaText||"Add to cart",o.addEventListener("click",()=>{o.disabled||n()})),o}function St(e,t,n){if(t.discountType==="percentage"){let o=0;for(let r of n){if(!r.selected)continue;let a=P(r.selected.price.amount),i=Math.floor(a*t.discountValue/100),d=Math.max(0,a-i);o+=d*r.qty}return o}return Math.max(0,e-Math.round(t.discountValue*100))}var Se=`
|
|
208
|
+
<svg class="lb-bundle-placeholder-icon" viewBox="0 0 28 28" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false">
|
|
209
|
+
<rect x="4" y="4" width="20" height="20" rx="3"></rect>
|
|
210
|
+
<line x1="4" y1="20" x2="24" y2="20"></line>
|
|
211
|
+
<circle cx="10" cy="12" r="2"></circle>
|
|
212
|
+
</svg>`,Ae=`
|
|
213
|
+
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
|
|
214
|
+
<line x1="9" y1="3" x2="9" y2="15" stroke="currentColor" stroke-width="2" stroke-linecap="round"/>
|
|
215
|
+
<line x1="3" y1="9" x2="15" y2="9" stroke="currentColor" stroke-width="2" stroke-linecap="round"/>
|
|
216
|
+
</svg>`,Z=`
|
|
217
|
+
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
|
|
218
|
+
<line x1="5" y1="5" x2="15" y2="15" stroke="currentColor" stroke-width="2" stroke-linecap="round"/>
|
|
219
|
+
<line x1="15" y1="5" x2="5" y2="15" stroke="currentColor" stroke-width="2" stroke-linecap="round"/>
|
|
220
|
+
</svg>`,At=`
|
|
221
|
+
<svg width="16" height="16" viewBox="0 0 20 20" fill="currentColor" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
|
|
222
|
+
<path d="M14.348 5.652a.5.5 0 0 0-.707 0L10 9.293 6.36 5.652a.5.5 0 1 0-.708.707L9.293 10l-3.641 3.641a.5.5 0 0 0 .708.707L10 10.707l3.641 3.641a.5.5 0 0 0 .707-.707L10.707 10l3.641-3.641a.5.5 0 0 0 0-.707z"/>
|
|
223
|
+
</svg>`;function Te(e,t,n,o){let r=t.widgetConfig,a=t.products[0]?.priceRange.minVariantPrice.currencyCode??"USD",i=t.minQuantity??1,d=t.maxQuantity??i,l=Ft(t,r.outOfStockBehavior);if(l.filter(x=>!x.isOos).length<i)return;let c=[],p=s("div","lb-mix-match",{"data-required-quantity":String(i),"data-max-quantity":String(d)}),f=Tt(t);if(p.appendChild(f),r.countdown.showCountdown&&t.endsAt){let x=H(t.endsAt);x&&(p.appendChild(x.el),o?.(x.stop))}let h=Et(i);p.appendChild(h.el);let m=s("div","lb-mix-match__slots",{"data-selection-slots":""});p.appendChild(m),p.appendChild(s("div","lb-bundle-divider"));let v=Rt(r.pricing.showCompareAtPrice);p.appendChild(v.el);let T=r.savingsBar.visible?It():null;T&&p.appendChild(T.el);let C=s("div","lb-mix-match__price-placeholder",{"data-price-placeholder":""}),k=s("span","lb-mix-match__price-placeholder-text");k.textContent=`Select ${i} items to see price`,C.appendChild(k),p.appendChild(C);let S=Mt(t,l,a,{showSearch:r.showSearch,onAdd:(x,w)=>A(x,w),onRemove:(x,w)=>R(x,w),countFor:(x,w)=>c.filter(F=>F.productId===x&&F.variantId===w).length,isOverMax:()=>c.length>=d});p.appendChild(S.el);let b=document.createElement("button");b.type="button",b.className="lb-bundle-cta",b.setAttribute("data-add-bundle",""),b.disabled=!0,b.textContent=`Select ${i} items to unlock`,b.addEventListener("click",()=>{if(b.disabled)return;let x=c.map(w=>({merchandiseId:w.variantId,quantity:1,attributes:[{key:"_lime_bundle_gid",value:t.id},{key:"_lime_bundle_type",value:t.bundleType}]}));n(x)}),p.appendChild(b),p.appendChild(s("p","lb-bundle-error",{"data-error":"","aria-live":"polite"})),p.appendChild(s("span","lb-visually-hidden",{"data-status":"","aria-live":"polite"})),e.appendChild(p);let B=l.find(x=>!x.isOos),y=B?.firstAvailableVariant??B?.variants[0];B&&y&&c.push({productId:B.product.id,productTitle:B.product.title,variantId:y.id,variantTitle:y.title,imageUrl:B.product.featuredImage?.url??null,priceCents:P(y.price.amount),compareCents:y.compareAtPrice?P(y.compareAtPrice.amount):null}),g();function A(x,w){c.length>=d||(c.push({productId:x.id,productTitle:x.title,variantId:w.id,variantTitle:w.title,imageUrl:x.featuredImage?.url??null,priceCents:P(w.price.amount),compareCents:w.compareAtPrice?P(w.compareAtPrice.amount):null}),g())}function R(x,w){let F=c.findIndex(W=>W.productId===x&&W.variantId===w);F!==-1&&(c.splice(F,1),g())}function $(x){x<0||x>=c.length||(c.splice(x,1),g())}function g(){I(),h.update(c.length),v.update(c,t,a),T&&T.update(c,t,a),C.style.display=c.length===0?"":"none",S.refreshCounts(),M()}function I(){m.innerHTML="";let x=Math.max(i,c.length);for(let w=0;w<x;w++){let F=c[w];F?m.appendChild(Lt(F,w,a,()=>$(w))):m.appendChild(Pt(w,()=>S.open()))}}function M(){let x=c.length;x<i?(b.disabled=!0,b.textContent=`Select ${i-x} more to unlock`):(b.disabled=!1,b.textContent=r.cta.ctaText||"Add to cart")}}function Tt(e){let t=e.widgetConfig,n=s("div","lb-bundle-header"),o=s("div","lb-bundle-header__content"),r=s("h3","lb-bundle-title");if(r.textContent=e.title,o.appendChild(r),n.appendChild(o),t.pricing.showSaveBadge){let{discountType:a,discountValue:i}=e.discountConfig,d=null;if(a==="percentage"&&i>0?d=`-${Math.round(i)}%`:a==="fixed_amount"&&i>0&&(d=`-${_(Math.round(i*100),e.products[0]?.priceRange.minVariantPrice.currencyCode??"USD")}`),d){let l=s("span","lb-bundle-header__badge");l.textContent=d,n.appendChild(l)}}return n}function Et(e){let t=s("div","lb-mix-match__progress"),n=s("div","lb-mix-match__progress-labels"),o=s("span","lb-mix-match__progress-count",{"data-progress-count":""});o.textContent=`0 of ${e} selected`,n.appendChild(o);let r=s("span","lb-mix-match__progress-remaining",{"data-progress-remaining":""});r.textContent=`${e} more to go`,n.appendChild(r),t.appendChild(n);let a=s("div","lb-mix-match__progress-track",{role:"progressbar","aria-valuenow":"0","aria-valuemin":"0","aria-valuemax":String(e)}),i=s("div","lb-mix-match__progress-fill",{"data-progress-fill":""});i.style.width="0%",a.appendChild(i),t.appendChild(a);function d(l){let u=Math.min(100,l/e*100);o.textContent=`${l} of ${e} selected`,l>=e?r.textContent="Complete":r.textContent=`${e-l} more to go`,i.style.width=`${u}%`,a.setAttribute("aria-valuenow",String(Math.min(l,e)))}return{el:t,update:d}}function Pt(e,t){let n=s("div","lb-bundle-product-row lb-mix-match__slot lb-mix-match__slot--empty",{"data-slot":String(e+1),tabindex:"0",role:"button","aria-label":"Add a product to the bundle"}),o=s("div","lb-mix-match__empty-thumb");o.innerHTML=Ae,n.appendChild(o);let r=s("span","lb-mix-match__empty-text");return r.textContent="Choose an item",n.appendChild(r),n.addEventListener("click",t),n.addEventListener("keydown",a=>{(a.key==="Enter"||a.key===" ")&&(a.preventDefault(),t())}),n}function Lt(e,t,n,o){let r=s("div","lb-bundle-product-row lb-mix-match__slot lb-mix-match__slot--filled",{"data-slot":String(t+1)}),a=s("div","lb-bundle-thumbnail",{"data-thumbnail":""});if(e.imageUrl){let p=document.createElement("img");p.src=O(e.imageUrl,{width:L,height:L,crop:"center"}),p.alt=e.productTitle,p.width=L,p.height=L,p.loading="lazy",a.appendChild(p)}else a.insertAdjacentHTML("beforeend",Se);r.appendChild(a);let i=s("div","lb-mix-match__filled-info"),d=s("span","lb-mix-match__filled-title");if(d.textContent=e.productTitle,i.appendChild(d),e.variantTitle&&e.variantTitle!=="Default Title"){let p=s("span","lb-mix-match__filled-variant");p.textContent=e.variantTitle,i.appendChild(p)}let l=s("span","lb-mix-match__filled-price");if(e.compareCents&&e.compareCents>e.priceCents){let p=s("span","lb-mix-match__filled-compare");p.textContent=_(e.compareCents,n),l.appendChild(p)}let u=document.createElement("span");u.textContent=_(e.priceCents,n),l.appendChild(u),i.appendChild(l),r.appendChild(i);let c=document.createElement("button");return c.type="button",c.className="lb-mix-match__slot-remove",c.setAttribute("aria-label",`Remove ${e.productTitle}`),c.innerHTML=Z,c.addEventListener("click",p=>{p.stopPropagation(),o()}),r.appendChild(c),r}function Rt(e){let t=s("div","lb-bundle-pricing",{"data-pricing-section":""});t.style.display="none";let n=s("span","lb-bundle-pricing__label");n.textContent="Bundle price",t.appendChild(n);let o=s("span","lb-bundle-pricing__prices"),r=s("span","lb-bundle-compare-price",{"data-compare-price":""});e&&o.appendChild(r);let a=s("span","lb-bundle-sale-price",{"data-sale-price":""});o.appendChild(a),t.appendChild(o);function i(d,l,u){if(d.length===0){t.style.display="none";return}t.style.display="";let c=d.reduce((f,h)=>f+h.priceCents,0),p=G(c,l.discountConfig);e&&c>p?(r.textContent=_(c,u),r.style.display=""):r.style.display="none",a.textContent=_(p,u)}return{el:t,update:i}}function It(){let e=s("div","lb-bundle-savings-bar",{"data-savings-bar":""});e.style.display="none";let t=document.createElement("span");t.textContent="You save",e.appendChild(t);let n=s("span","",{"data-savings-amount":""});e.appendChild(n);function o(r,a,i){if(r.length===0){e.style.display="none";return}let d=r.reduce((c,p)=>c+p.priceCents,0),l=G(d,a.discountConfig),u=Math.max(0,d-l);if(u<=0){e.style.display="none";return}e.style.display="",n.textContent=_(u,i)}return{el:e,update:o}}function Mt(e,t,n,o){let r=s("div","lb-mix-match__modal-overlay",{"data-modal-overlay":"","data-bundle-gid":e.id});r.style.display="none";let a=s("div","lb-mix-match__modal",{role:"dialog","aria-modal":"true","aria-labelledby":`lb-modal-title-${ke(e.id)}`,tabindex:"-1"}),i=s("div","lb-mix-match__modal-header"),d=s("h4","lb-mix-match__modal-title",{id:`lb-modal-title-${ke(e.id)}`});d.textContent="Pick an item",i.appendChild(d);let l=document.createElement("button");l.type="button",l.className="lb-mix-match__modal-close",l.setAttribute("data-modal-close",""),l.setAttribute("aria-label","Close"),l.innerHTML=Z,l.addEventListener("click",A),i.appendChild(l),a.appendChild(i);let u=null,c=null;if(o.showSearch){let g=s("div","lb-mix-match__modal-search");u=document.createElement("input"),u.type="text",u.className="lb-mix-match__modal-search-input",u.setAttribute("data-modal-search",""),u.setAttribute("role","searchbox"),u.setAttribute("aria-label","Search products"),u.setAttribute("placeholder","Search products"),u.autocomplete="off",u.addEventListener("input",()=>k()),g.appendChild(u),c=document.createElement("button"),c.type="button",c.className="lb-mix-match__modal-search-clear",c.setAttribute("data-modal-search-clear",""),c.setAttribute("aria-label","Clear search"),c.style.display="none",c.innerHTML=At,c.addEventListener("click",()=>{u&&(u.value="",k(),u.focus())}),g.appendChild(c),a.appendChild(g)}let p=s("div","lb-mix-match__modal-list",{"data-modal-list":""});a.appendChild(p);let f=s("div","lb-mix-match__modal-empty",{"data-modal-empty":""});f.style.display="none";let h=document.createElement("p");h.textContent="No products match your search.",f.appendChild(h),a.appendChild(f);let m=s("span","lb-visually-hidden",{"data-modal-live":"","aria-live":"polite"});a.appendChild(m),r.appendChild(a);let v=!1,T=[];function C(){v||(v=!0,p.innerHTML="",t.forEach(g=>{let I=g.firstAvailableVariant??g.variants[0];if(!I)return;let M=s("div",g.isOos?"lb-mix-match__modal-product lb-mix-match__modal-product--sold-out":"lb-mix-match__modal-product",{"data-product-id":g.product.id.replace(/^.*\//,"")}),x=s("div","lb-mix-match__modal-product-thumb");if(g.product.featuredImage){let E=document.createElement("img");E.src=O(g.product.featuredImage.url,{width:L,height:L,crop:"center"}),E.alt=g.product.featuredImage.altText??g.product.title,E.width=L,E.height=L,E.loading="lazy",x.appendChild(E)}else x.insertAdjacentHTML("beforeend",Se);M.appendChild(x);let w=s("div","lb-mix-match__modal-product-info"),F=s("span","lb-mix-match__modal-product-title");F.textContent=g.product.title,w.appendChild(F);let W=s("span","lb-mix-match__modal-product-price");if(W.textContent=_(P(I.price.amount),n),w.appendChild(W),g.isOos){let E=s("span","lb-mix-match__modal-sold-out-label");E.textContent="Sold out",w.appendChild(E)}if(M.appendChild(w),g.isOos)T.push({el:M,product:g.product,variant:I,updateCount:()=>{}});else{let E=document.createElement("button");E.type="button",E.className="lb-mix-match__modal-add",E.setAttribute("aria-label",`Add ${g.product.title}`),E.innerHTML=Ae;let q=s("span","lb-bundle-qty-badge");q.style.display="none",E.appendChild(q),E.addEventListener("click",()=>{o.isOverMax()||o.onAdd(g.product,I)}),M.appendChild(E);let V=document.createElement("button");V.type="button",V.className="lb-mix-match__slot-remove",V.setAttribute("aria-label",`Remove one ${g.product.title}`),V.style.display="none",V.innerHTML=Z,V.addEventListener("click",j=>{j.stopPropagation(),o.onRemove(g.product.id,I.id)}),M.appendChild(V),T.push({el:M,product:g.product,variant:I,updateCount:()=>{let j=o.countFor(g.product.id,I.id);j>0?(q.textContent=String(j),q.style.display="",V.style.display=""):(q.style.display="none",V.style.display="none")}})}p.appendChild(M)}),$())}function k(){if(!u)return;let g=u.value.trim().toLowerCase();c&&(c.style.display=g?"":"none");let I=0;T.forEach(M=>{let x=!g||M.product.title.toLowerCase().includes(g);M.el.style.display=x?"":"none",x&&I++}),f.style.display=I===0&&g?"":"none"}let S=null;function b(g){if(g.key==="Escape"){g.preventDefault(),A();return}g.key==="Tab"&&Dt(g,a)}let B=!1;function y(){B||o.isOverMax()||(B=!0,C(),S=r.getRootNode().activeElement,r.style.display="",r.classList.add("lb-mix-match__modal-overlay--open"),a.focus(),document.addEventListener("keydown",b),r.addEventListener("click",R))}function A(){B&&(B=!1,r.classList.remove("lb-mix-match__modal-overlay--open"),r.style.display="none",document.removeEventListener("keydown",b),r.removeEventListener("click",R),S instanceof HTMLElement&&S.focus())}function R(g){g.target===r&&A()}function $(){T.forEach(g=>g.updateCount())}return{el:r,open:y,close:A,refreshCounts:$}}function Ft(e,t){let n=[],o=new Set;for(let r of e.products){if(o.has(r.id))continue;o.add(r.id);let a=r.variants.nodes.filter(d=>d.availableForSale),i=a.length===0;i&&t==="hide"||n.push({product:r,variants:r.variants.nodes,firstAvailableVariant:a[0]??null,isOos:i})}return n}function Dt(e,t){let n=t.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])');if(n.length===0)return;let o=n[0],r=n[n.length-1],a=t.getRootNode().activeElement;e.shiftKey&&a===o?(e.preventDefault(),r.focus()):!e.shiftKey&&a===r&&(e.preventDefault(),o.focus())}function ke(e){return e.replace(/[^a-zA-Z0-9_-]/g,"-")}function Re(e,t,n,o){let r=t.widgetConfig,i=t.products[0]?.variants.nodes.find(b=>b.availableForSale);if(!i&&r.outOfStockBehavior==="hide")return;let d=i?P(i.price.amount):0,l=i?.price.currencyCode??"USD",u=t.discountConfig.discountType,c=t.volumeTiers.map((b,B)=>{let y;if(u==="fixed_amount"){let A=Math.round((b.amount??0)*100);y=Math.max(0,d-A)}else{let A=b.percentage??0,R=Math.floor(d*A/100);y=Math.max(0,d-R)}return{tier:b,index:B,qty:b.minQuantity,pricePerUnitCents:y,basePricePerUnitCents:d}}),p=Ht(c),f=r.defaultTier==="best_value"?p:0;typeof r.defaultTier=="number"&&(f=Le(r.defaultTier,0,c.length-1));let h=r.popularBadge.tierIndex!==void 0?Le(r.popularBadge.tierIndex,0,c.length-1):p,m=s("div","lb-volume");if(m.appendChild(Vt(t,c,f,l,u)),r.countdown.showCountdown&&t.endsAt){let b=H(t.endsAt);b&&(m.appendChild(b.el),o?.(b.stop))}let v=s("div","lb-volume__tiers",{role:"radiogroup","aria-label":"Quantity tiers","data-tier-group":""});c.forEach(b=>{let B=Ut(b,b.index===f,l,r.popularBadge.visible&&b.index===h?r.popularBadge.text:null,r.pricing.showComparePrice,r.pricing.showPerUnitPrice);B.addEventListener("click",()=>S(b.index)),B.addEventListener("keydown",y=>{if(y.key==="Enter"||y.key===" "){y.preventDefault(),S(b.index);return}if(y.key==="ArrowDown"||y.key==="ArrowRight"||y.key==="ArrowUp"||y.key==="ArrowLeft"){y.preventDefault();let A=y.key==="ArrowDown"||y.key==="ArrowRight"?1:-1,R=(b.index+A+c.length)%c.length;S(R),v.children[R]?.focus()}}),v.appendChild(B)}),m.appendChild(v),m.appendChild(s("div","lb-bundle-divider"));let T=Ee(c,f,l,r.pricing.showItemCount,r.pricing.showCompareAtPrice);m.appendChild(T);let C=r.savingsBar.visible?Pe(c,f,l):null;C&&m.appendChild(C);let k=Ot(t,()=>{if(!i)return;let b=c[f];b&&n([{merchandiseId:i.id,quantity:b.qty,attributes:[{key:"_lime_bundle_gid",value:t.id},{key:"_lime_bundle_type",value:t.bundleType}]}])});m.appendChild(k),m.appendChild(s("p","lb-bundle-error",{"data-error":"","aria-live":"polite"})),m.appendChild(s("span","lb-visually-hidden",{"data-status":"","aria-live":"polite"})),e.appendChild(m);function S(b){if(b===f||b<0||b>=c.length)return;f=b,Array.from(v.children).forEach((A,R)=>{A.setAttribute("aria-checked",String(R===b)),A.tabIndex=R===b?0:-1});let B=Ee(c,b,l,r.pricing.showItemCount,r.pricing.showCompareAtPrice);if(T.replaceWith(B),T=B,C){let A=Pe(c,b,l);C.replaceWith(A),C=A}let y=m.querySelector("[data-header-badge]");if(y){let A=Ie(c[b],l,u);A?(y.textContent=A,y.style.display=""):y.style.display="none"}}}function Vt(e,t,n,o,r){let a=e.widgetConfig,i=s("div","lb-bundle-header"),d=s("div","lb-bundle-header__content"),l=s("h3","lb-bundle-title");if(l.textContent=e.title,d.appendChild(l),i.appendChild(d),a.pricing.showSaveBadge){let u=Ie(t[n],o,r);if(u){let c=s("span","lb-bundle-header__badge",{"data-header-badge":""});c.textContent=u,i.appendChild(c)}}return i}function Ut(e,t,n,o,r,a){let i=s("div","lb-volume__tier",{role:"radio","aria-checked":String(t),tabindex:t?"0":"-1","data-tier-index":String(e.index),"data-tier-qty":String(e.qty)}),d=s("span","lb-volume__radio");d.appendChild(s("span","lb-volume__radio-dot")),i.appendChild(d);let l=s("span","lb-volume__tier-grid"),u=s("span","lb-volume__tier-label");u.textContent=`Buy ${e.qty}`,l.appendChild(u);let c=s("span","lb-volume__tier-price");if(r&&e.pricePerUnitCents<e.basePricePerUnitCents){let f=s("span","lb-volume__tier-compare");f.textContent=_(e.basePricePerUnitCents,n),c.appendChild(f)}if(a){let f=document.createElement("span");f.setAttribute("data-tier-price-each",""),f.textContent=_(e.pricePerUnitCents,n),c.appendChild(f);let h=s("span","lb-volume__tier-unit");h.textContent=" each",c.appendChild(h)}l.appendChild(c),i.appendChild(l);let p=s("span","lb-volume__tier-badge");return o?p.textContent=o:p.style.display="none",i.appendChild(p),i}function Ee(e,t,n,o,r){let a=e[t],i=a?a.pricePerUnitCents*a.qty:0,d=a?a.basePricePerUnitCents*a.qty:0,l=Math.max(0,d-i),u=s("div","lb-bundle-pricing"),c=s("span","lb-bundle-pricing__label",{"data-total-label":""});if(c.textContent="Total",o&&a){let h=document.createElement("span");h.setAttribute("data-item-count",""),h.textContent=` (${a.qty} item${a.qty===1?"":"s"})`,c.appendChild(h)}u.appendChild(c);let p=s("span","lb-bundle-pricing__prices");if(r&&l>0){let h=s("span","lb-bundle-compare-price",{"data-compare-price":""});h.textContent=_(d,n),p.appendChild(h)}let f=s("span","lb-bundle-sale-price",{"data-total-price":""});return f.textContent=_(i,n),p.appendChild(f),u.appendChild(p),u}function Pe(e,t,n){let o=e[t],r=o?o.pricePerUnitCents*o.qty:0,a=o?o.basePricePerUnitCents*o.qty:0,i=Math.max(0,a-r),d=s("div","lb-bundle-savings-bar",{"data-savings-bar":""});i<=0&&(d.style.display="none");let l=document.createElement("span");l.textContent="You save",d.appendChild(l);let u=s("span","",{"data-savings-amount":""});return u.textContent=_(i,n),d.appendChild(u),d}function Ot(e,t){let o=e.products[0]?.variants.nodes.some(a=>a.availableForSale),r=document.createElement("button");return r.type="button",r.className="lb-bundle-cta",r.setAttribute("data-add-bundle",""),o||(r.disabled=!0),r.textContent=o?e.widgetConfig.cta.ctaText||"Add to cart":"Sold out",r.addEventListener("click",()=>{r.disabled||t()}),r}function Ie(e,t,n){if(!e)return null;let{tier:o}=e;if(n==="fixed_amount"){let r=o.amount??0;return r>0?`-${_(Math.round(r*100),t)}`:null}if(n==="percentage"){let r=o.percentage??0;return r>0?`-${Math.round(r)}%`:null}return null}function Ht(e){let t=0,n=0;return e.forEach((o,r)=>{let a=o.basePricePerUnitCents-o.pricePerUnitCents;a>t&&(t=a,n=r)}),n}function Le(e,t,n){return Math.max(t,Math.min(n,e))}var ee=`/* Lime Bundles \u2014 shared base styles for all bundle widget types */
|
|
224
|
+
|
|
225
|
+
.lb-bundle-widget.lb-bundle-widget,
|
|
226
|
+
.lb-bundle-widget.lb-bundle-widget * {
|
|
227
|
+
line-height: normal;
|
|
228
|
+
}
|
|
229
|
+
|
|
230
|
+
.lb-bundle-widget {
|
|
231
|
+
/* Internal CSS-only vars (not merchant-configurable). */
|
|
232
|
+
--lb-text-muted: #666666;
|
|
233
|
+
--lb-thumbnail-bg: #F0F0F0;
|
|
234
|
+
--lb-widget-pad: 20px;
|
|
235
|
+
--lb-progress-color: var(--lb-primary-color);
|
|
236
|
+
|
|
237
|
+
font-family: inherit;
|
|
238
|
+
font-size: 16px;
|
|
239
|
+
background: var(--lb-bg);
|
|
240
|
+
border: var(--lb-border-width) solid var(--lb-border);
|
|
241
|
+
border-radius: var(--lb-radius);
|
|
242
|
+
padding: var(--lb-widget-pad) var(--lb-widget-pad) 20px;
|
|
243
|
+
box-sizing: border-box;
|
|
244
|
+
/* Cap the widget at a comfortable reading width on desktop. Below
|
|
245
|
+
440px viewports the container is already narrower than the cap,
|
|
246
|
+
so the rule is inert on mobile. */
|
|
247
|
+
max-width: 440px;
|
|
248
|
+
}
|
|
249
|
+
|
|
250
|
+
/* Countdown timer bar \u2014 sits below the gradient header */
|
|
251
|
+
.lb-bundle-countdown {
|
|
252
|
+
margin: 0 calc(-1 * var(--lb-widget-pad)) 20px;
|
|
253
|
+
padding: 12px 20px;
|
|
254
|
+
background: var(--lb-countdown-bg);
|
|
255
|
+
border-top: 1px solid rgba(0, 0, 0, 0.06);
|
|
256
|
+
display: flex;
|
|
257
|
+
align-items: center;
|
|
258
|
+
justify-content: space-between;
|
|
259
|
+
}
|
|
260
|
+
|
|
261
|
+
.lb-bundle-countdown__label {
|
|
262
|
+
display: flex;
|
|
263
|
+
align-items: center;
|
|
264
|
+
gap: 8px;
|
|
265
|
+
}
|
|
266
|
+
|
|
267
|
+
.lb-bundle-countdown__label svg {
|
|
268
|
+
width: 16px;
|
|
269
|
+
height: 16px;
|
|
270
|
+
flex-shrink: 0;
|
|
271
|
+
color: var(--lb-countdown-text);
|
|
272
|
+
}
|
|
273
|
+
|
|
274
|
+
.lb-bundle-countdown__label span {
|
|
275
|
+
font-size: 12px;
|
|
276
|
+
font-weight: 500;
|
|
277
|
+
line-height: 1;
|
|
278
|
+
color: var(--lb-countdown-text);
|
|
279
|
+
}
|
|
280
|
+
|
|
281
|
+
.lb-bundle-countdown__timer {
|
|
282
|
+
font-family: 'SF Mono', 'Roboto Mono', ui-monospace, monospace;
|
|
283
|
+
font-size: 12px;
|
|
284
|
+
font-weight: 600;
|
|
285
|
+
line-height: 1;
|
|
286
|
+
color: var(--lb-countdown-text);
|
|
287
|
+
letter-spacing: 0.02em;
|
|
288
|
+
}
|
|
289
|
+
|
|
290
|
+
/* Hide wrapper when the inner snippet rendered nothing (product OOS / unfulfillable) */
|
|
291
|
+
.lb-bundle-widget:not(:has(.lb-fixed, .lb-mix-match, .lb-volume)) {
|
|
292
|
+
display: none;
|
|
293
|
+
}
|
|
294
|
+
|
|
295
|
+
/* Adjacent widget spacing \u2014 separates multiple bundles on the same product page */
|
|
296
|
+
.lb-bundle-widget + .lb-bundle-widget {
|
|
297
|
+
margin-top: 24px;
|
|
298
|
+
padding-top: 24px;
|
|
299
|
+
border-top: 1px solid var(--lb-border);
|
|
300
|
+
}
|
|
301
|
+
|
|
302
|
+
/* Header \u2014 gradient banner with title + savings badge */
|
|
303
|
+
.lb-bundle-header {
|
|
304
|
+
margin: calc(-1 * var(--lb-widget-pad)) calc(-1 * var(--lb-widget-pad)) 20px;
|
|
305
|
+
padding: 20px 20px;
|
|
306
|
+
background: var(--lb-header-bg);
|
|
307
|
+
/* Match the widget's inner border curve so there's no background gap at the top corners. */
|
|
308
|
+
border-radius: max(0px, calc(var(--lb-radius) - var(--lb-border-width))) max(0px, calc(var(--lb-radius) - var(--lb-border-width))) 0 0;
|
|
309
|
+
display: flex;
|
|
310
|
+
align-items: center;
|
|
311
|
+
justify-content: space-between;
|
|
312
|
+
gap: 16px;
|
|
313
|
+
}
|
|
314
|
+
|
|
315
|
+
/* When countdown follows header, remove header bottom margin */
|
|
316
|
+
.lb-bundle-header:has(+ .lb-bundle-countdown) {
|
|
317
|
+
margin-bottom: 0;
|
|
318
|
+
}
|
|
319
|
+
|
|
320
|
+
.lb-bundle-header__content {
|
|
321
|
+
flex: 1;
|
|
322
|
+
min-width: 0;
|
|
323
|
+
}
|
|
324
|
+
|
|
325
|
+
.lb-bundle-title {
|
|
326
|
+
font-size: 20px;
|
|
327
|
+
font-weight: 700;
|
|
328
|
+
line-height: 28px;
|
|
329
|
+
letter-spacing: -0.02em;
|
|
330
|
+
color: var(--lb-text);
|
|
331
|
+
margin: 0;
|
|
332
|
+
}
|
|
333
|
+
|
|
334
|
+
.lb-bundle-header .lb-bundle-title {
|
|
335
|
+
color: var(--lb-header-text);
|
|
336
|
+
}
|
|
337
|
+
|
|
338
|
+
.lb-bundle-subtitle {
|
|
339
|
+
font-size: 16px;
|
|
340
|
+
font-weight: 400;
|
|
341
|
+
line-height: 20px;
|
|
342
|
+
color: var(--lb-text-muted);
|
|
343
|
+
margin: 4px 0 0;
|
|
344
|
+
}
|
|
345
|
+
|
|
346
|
+
.lb-bundle-header .lb-bundle-subtitle {
|
|
347
|
+
color: var(--lb-header-text);
|
|
348
|
+
opacity: 0.85;
|
|
349
|
+
margin-top: 8px;
|
|
350
|
+
}
|
|
351
|
+
|
|
352
|
+
.lb-bundle-header:has(.lb-bundle-subtitle) {
|
|
353
|
+
align-items: flex-start;
|
|
354
|
+
}
|
|
355
|
+
|
|
356
|
+
.lb-bundle-header__badge {
|
|
357
|
+
background: var(--lb-save-badge-bg);
|
|
358
|
+
color: var(--lb-save-badge-text);
|
|
359
|
+
border: var(--lb-save-badge-border-width) solid var(--lb-save-badge-border-color);
|
|
360
|
+
font-size: 16px;
|
|
361
|
+
font-weight: 700;
|
|
362
|
+
line-height: 1;
|
|
363
|
+
padding: 4px 12px;
|
|
364
|
+
border-radius: var(--lb-save-badge-radius);
|
|
365
|
+
white-space: nowrap;
|
|
366
|
+
flex-shrink: 0;
|
|
367
|
+
}
|
|
368
|
+
|
|
369
|
+
/* Override Dawn's \`div:empty { display: none }\` reset for decorative elements */
|
|
370
|
+
.lb-bundle-divider:empty,
|
|
371
|
+
.lb-mix-match__progress-fill:empty {
|
|
372
|
+
display: block;
|
|
373
|
+
}
|
|
374
|
+
|
|
375
|
+
/* Divider */
|
|
376
|
+
.lb-bundle-divider {
|
|
377
|
+
height: 1px;
|
|
378
|
+
background: color-mix(in srgb, var(--lb-text) 7%, transparent);
|
|
379
|
+
margin: 16px 0;
|
|
380
|
+
}
|
|
381
|
+
|
|
382
|
+
/* Product rows */
|
|
383
|
+
.lb-bundle-product-row {
|
|
384
|
+
display: flex;
|
|
385
|
+
gap: 12px;
|
|
386
|
+
padding: 12px 0;
|
|
387
|
+
}
|
|
388
|
+
|
|
389
|
+
.lb-bundle-thumbnail {
|
|
390
|
+
position: relative;
|
|
391
|
+
width: 48px;
|
|
392
|
+
height: 48px;
|
|
393
|
+
min-width: 48px;
|
|
394
|
+
background: var(--lb-thumbnail-bg);
|
|
395
|
+
border-radius: 8px;
|
|
396
|
+
overflow: hidden;
|
|
397
|
+
display: flex;
|
|
398
|
+
align-items: center;
|
|
399
|
+
justify-content: center;
|
|
400
|
+
}
|
|
401
|
+
|
|
402
|
+
.lb-bundle-thumbnail img {
|
|
403
|
+
width: 100%;
|
|
404
|
+
height: 100%;
|
|
405
|
+
object-fit: cover;
|
|
406
|
+
}
|
|
407
|
+
|
|
408
|
+
.lb-bundle-thumbnail svg {
|
|
409
|
+
width: 28px;
|
|
410
|
+
height: 28px;
|
|
411
|
+
color: #BBBBBB;
|
|
412
|
+
}
|
|
413
|
+
|
|
414
|
+
.lb-bundle-product-info {
|
|
415
|
+
flex: 1;
|
|
416
|
+
min-width: 0;
|
|
417
|
+
}
|
|
418
|
+
|
|
419
|
+
.lb-bundle-product-name {
|
|
420
|
+
font-size: 16px;
|
|
421
|
+
font-weight: 700;
|
|
422
|
+
line-height: 20px;
|
|
423
|
+
color: var(--lb-text);
|
|
424
|
+
margin: 0;
|
|
425
|
+
text-decoration: none;
|
|
426
|
+
display: block;
|
|
427
|
+
}
|
|
428
|
+
|
|
429
|
+
.lb-bundle-product-name:hover {
|
|
430
|
+
text-decoration: underline;
|
|
431
|
+
}
|
|
432
|
+
|
|
433
|
+
.lb-bundle-product-price {
|
|
434
|
+
/* --lb-product-price-display fallback is the "on" branch; Liquid sets 'none' when merchant disables. */
|
|
435
|
+
display: var(--lb-product-price-display, block);
|
|
436
|
+
font-size: 12px;
|
|
437
|
+
font-weight: 400;
|
|
438
|
+
line-height: 20px;
|
|
439
|
+
color: var(--lb-text);
|
|
440
|
+
}
|
|
441
|
+
|
|
442
|
+
.lb-bundle-product-prices {
|
|
443
|
+
display: flex;
|
|
444
|
+
align-items: baseline;
|
|
445
|
+
gap: 6px;
|
|
446
|
+
flex-wrap: wrap;
|
|
447
|
+
margin-top: 2px;
|
|
448
|
+
}
|
|
449
|
+
|
|
450
|
+
.lb-bundle-product-compare-price {
|
|
451
|
+
/* --lb-product-compare-display fallback is the "on" branch; Liquid sets 'none' when merchant disables. */
|
|
452
|
+
display: var(--lb-product-compare-display, inline);
|
|
453
|
+
font-size: 12px;
|
|
454
|
+
font-weight: 400;
|
|
455
|
+
line-height: 20px;
|
|
456
|
+
color: color-mix(in srgb, var(--lb-text) 60%, transparent);
|
|
457
|
+
text-decoration: line-through;
|
|
458
|
+
}
|
|
459
|
+
|
|
460
|
+
/* Setting \`display\` above outranks the UA [hidden] rule \u2014 restore it so rows
|
|
461
|
+
without a compare-at price don't leave a phantom flex item + gap. */
|
|
462
|
+
.lb-bundle-product-compare-price[hidden] {
|
|
463
|
+
display: none;
|
|
464
|
+
}
|
|
465
|
+
|
|
466
|
+
.lb-bundle-variant-badge {
|
|
467
|
+
display: inline-block;
|
|
468
|
+
border: var(--lb-variant-border-width) solid var(--lb-variant-border-color);
|
|
469
|
+
border-radius: var(--lb-variant-radius);
|
|
470
|
+
padding: 8px 12px;
|
|
471
|
+
font-size: 12px;
|
|
472
|
+
line-height: 16px;
|
|
473
|
+
color: var(--lb-text-muted);
|
|
474
|
+
margin-top: 8px;
|
|
475
|
+
}
|
|
476
|
+
|
|
477
|
+
.lb-bundle-quantity {
|
|
478
|
+
font-size: 12px;
|
|
479
|
+
line-height: 16px;
|
|
480
|
+
color: var(--lb-text-muted);
|
|
481
|
+
margin-left: 8px;
|
|
482
|
+
white-space: nowrap;
|
|
483
|
+
}
|
|
484
|
+
|
|
485
|
+
/* Pricing row \u2014 label left, prices right */
|
|
486
|
+
.lb-bundle-pricing {
|
|
487
|
+
display: flex;
|
|
488
|
+
align-items: baseline;
|
|
489
|
+
justify-content: space-between;
|
|
490
|
+
padding: 4px 0 8px;
|
|
491
|
+
gap: 12px;
|
|
492
|
+
}
|
|
493
|
+
|
|
494
|
+
.lb-bundle-pricing__label {
|
|
495
|
+
font-size: 16px;
|
|
496
|
+
font-weight: 400;
|
|
497
|
+
line-height: 20px;
|
|
498
|
+
color: var(--lb-text);
|
|
499
|
+
white-space: nowrap;
|
|
500
|
+
}
|
|
501
|
+
|
|
502
|
+
.lb-bundle-pricing__prices {
|
|
503
|
+
display: flex;
|
|
504
|
+
align-items: baseline;
|
|
505
|
+
gap: 8px;
|
|
506
|
+
}
|
|
507
|
+
|
|
508
|
+
.lb-bundle-sale-price {
|
|
509
|
+
font-size: 20px;
|
|
510
|
+
font-weight: 700;
|
|
511
|
+
line-height: 1;
|
|
512
|
+
letter-spacing: -0.02em;
|
|
513
|
+
color: var(--lb-text);
|
|
514
|
+
}
|
|
515
|
+
|
|
516
|
+
.lb-bundle-compare-price {
|
|
517
|
+
font-size: 16px;
|
|
518
|
+
font-weight: 400;
|
|
519
|
+
line-height: 20px;
|
|
520
|
+
color: color-mix(in srgb, var(--lb-text) 60%, transparent);
|
|
521
|
+
text-decoration: line-through;
|
|
522
|
+
}
|
|
523
|
+
|
|
524
|
+
/* Savings bar \u2014 green banner below pricing */
|
|
525
|
+
.lb-bundle-savings-bar {
|
|
526
|
+
display: flex;
|
|
527
|
+
align-items: center;
|
|
528
|
+
justify-content: space-between;
|
|
529
|
+
background: var(--lb-savings-bar-bg);
|
|
530
|
+
color: var(--lb-savings-bar-text);
|
|
531
|
+
border: var(--lb-savings-bar-border-width) solid var(--lb-savings-bar-border-color);
|
|
532
|
+
font-size: 16px;
|
|
533
|
+
font-weight: 600;
|
|
534
|
+
line-height: 20px;
|
|
535
|
+
padding: 12px 16px;
|
|
536
|
+
border-radius: var(--lb-savings-bar-radius);
|
|
537
|
+
margin-bottom: 12px;
|
|
538
|
+
}
|
|
539
|
+
|
|
540
|
+
/* Quantity badge \u2014 overlay on thumbnail top-right */
|
|
541
|
+
.lb-bundle-qty-badge.lb-bundle-qty-badge {
|
|
542
|
+
position: absolute;
|
|
543
|
+
top: -8px;
|
|
544
|
+
right: -8px;
|
|
545
|
+
/* --lb-qty-badge-display fallback is the "on" branch; Liquid sets 'none' when merchant disables. */
|
|
546
|
+
display: var(--lb-qty-badge-display, flex);
|
|
547
|
+
align-items: center;
|
|
548
|
+
justify-content: center;
|
|
549
|
+
width: 24px;
|
|
550
|
+
height: 24px;
|
|
551
|
+
border-radius: 50%;
|
|
552
|
+
background: var(--lb-qty-badge-bg);
|
|
553
|
+
border: var(--lb-image-border-width) solid var(--lb-image-border-color);
|
|
554
|
+
color: var(--lb-qty-badge-color);
|
|
555
|
+
font-size: 12px;
|
|
556
|
+
font-weight: 700;
|
|
557
|
+
line-height: 0;
|
|
558
|
+
text-align: center;
|
|
559
|
+
z-index: 1;
|
|
560
|
+
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
|
|
561
|
+
}
|
|
562
|
+
|
|
563
|
+
/* Override Dawn's \`div:empty\` for savings bar when hidden */
|
|
564
|
+
.lb-bundle-savings-bar:empty {
|
|
565
|
+
display: none;
|
|
566
|
+
}
|
|
567
|
+
|
|
568
|
+
/* CTA button */
|
|
569
|
+
.lb-bundle-cta {
|
|
570
|
+
display: block;
|
|
571
|
+
width: 100%;
|
|
572
|
+
padding: 16px;
|
|
573
|
+
border: var(--lb-cta-border-width) solid var(--lb-cta-border-color);
|
|
574
|
+
border-radius: var(--lb-cta-radius);
|
|
575
|
+
font-size: 16px;
|
|
576
|
+
font-weight: 600;
|
|
577
|
+
line-height: 20px;
|
|
578
|
+
cursor: pointer;
|
|
579
|
+
text-align: center;
|
|
580
|
+
transition: opacity 0.15s ease;
|
|
581
|
+
font-family: inherit;
|
|
582
|
+
}
|
|
583
|
+
|
|
584
|
+
.lb-bundle-cta:not(:disabled) {
|
|
585
|
+
background: var(--lb-primary-color);
|
|
586
|
+
color: var(--lb-btn-text);
|
|
587
|
+
}
|
|
588
|
+
|
|
589
|
+
.lb-bundle-cta:not(:disabled):hover {
|
|
590
|
+
opacity: 0.9;
|
|
591
|
+
}
|
|
592
|
+
|
|
593
|
+
.lb-bundle-cta:disabled {
|
|
594
|
+
background: color-mix(in srgb, var(--lb-primary-color) 35%, var(--lb-bg));
|
|
595
|
+
color: color-mix(in srgb, var(--lb-btn-text) 85%, transparent);
|
|
596
|
+
cursor: not-allowed;
|
|
597
|
+
}
|
|
598
|
+
|
|
599
|
+
.lb-bundle-cta[data-loading="true"] {
|
|
600
|
+
opacity: 0.7;
|
|
601
|
+
cursor: wait;
|
|
602
|
+
pointer-events: none;
|
|
603
|
+
}
|
|
604
|
+
|
|
605
|
+
/* Error message */
|
|
606
|
+
.lb-bundle-error {
|
|
607
|
+
font-size: 16px;
|
|
608
|
+
color: #D72C0D;
|
|
609
|
+
margin-top: 8px;
|
|
610
|
+
display: none;
|
|
611
|
+
}
|
|
612
|
+
|
|
613
|
+
.lb-bundle-error[data-visible="true"] {
|
|
614
|
+
display: block;
|
|
615
|
+
}
|
|
616
|
+
|
|
617
|
+
/* Visually hidden \u2014 accessible to screen readers only */
|
|
618
|
+
.lb-visually-hidden {
|
|
619
|
+
position: absolute !important;
|
|
620
|
+
width: 1px !important;
|
|
621
|
+
height: 1px !important;
|
|
622
|
+
padding: 0 !important;
|
|
623
|
+
margin: -1px !important;
|
|
624
|
+
overflow: hidden !important;
|
|
625
|
+
clip-path: inset(50%) !important;
|
|
626
|
+
white-space: nowrap !important;
|
|
627
|
+
border: 0 !important;
|
|
628
|
+
}
|
|
629
|
+
|
|
630
|
+
/* Placeholder SVG icon for missing images */
|
|
631
|
+
.lb-bundle-placeholder-icon {
|
|
632
|
+
width: 28px;
|
|
633
|
+
height: 28px;
|
|
634
|
+
stroke: #BBBBBB;
|
|
635
|
+
stroke-width: 1.5;
|
|
636
|
+
fill: none;
|
|
637
|
+
}
|
|
638
|
+
|
|
639
|
+
/* Out-of-stock product row */
|
|
640
|
+
.lb-bundle-product-row--oos {
|
|
641
|
+
opacity: 0.5;
|
|
642
|
+
}
|
|
643
|
+
|
|
644
|
+
.lb-bundle-oos-label {
|
|
645
|
+
font-size: 12px;
|
|
646
|
+
font-weight: 500;
|
|
647
|
+
color: #D72C0D;
|
|
648
|
+
white-space: nowrap;
|
|
649
|
+
margin-left: auto;
|
|
650
|
+
}
|
|
651
|
+
|
|
652
|
+
/* A/B test: hide save badge until JS swaps the label (prevents flash of default) */
|
|
653
|
+
.lb-ab-pending {
|
|
654
|
+
visibility: hidden;
|
|
655
|
+
}
|
|
656
|
+
`,Me=`/* Lime Bundles \u2014 Fixed bundle styles */
|
|
657
|
+
|
|
658
|
+
.lb-fixed__products {
|
|
659
|
+
display: flex;
|
|
660
|
+
flex-direction: column;
|
|
661
|
+
gap: 0;
|
|
662
|
+
margin: 0;
|
|
663
|
+
}
|
|
664
|
+
|
|
665
|
+
/* Fixed bundles: product rows */
|
|
666
|
+
.lb-fixed .lb-bundle-product-row {
|
|
667
|
+
gap: 16px;
|
|
668
|
+
align-items: center;
|
|
669
|
+
}
|
|
670
|
+
|
|
671
|
+
/* Fixed bundles: larger thumbnails */
|
|
672
|
+
.lb-fixed .lb-bundle-thumbnail {
|
|
673
|
+
width: 60px;
|
|
674
|
+
height: 60px;
|
|
675
|
+
min-width: 60px;
|
|
676
|
+
border-radius: var(--lb-image-border-radius);
|
|
677
|
+
border: var(--lb-image-border-width) solid var(--lb-image-border-color);
|
|
678
|
+
box-sizing: border-box;
|
|
679
|
+
overflow: visible;
|
|
680
|
+
}
|
|
681
|
+
|
|
682
|
+
.lb-fixed .lb-bundle-thumbnail img {
|
|
683
|
+
border-radius: max(0px, calc(var(--lb-image-border-radius) - var(--lb-image-border-width)));
|
|
684
|
+
border: none;
|
|
685
|
+
}
|
|
686
|
+
|
|
687
|
+
/* Variant picker select \u2014 styled to match the variant badge aesthetic */
|
|
688
|
+
.lb-bundle-variant-select {
|
|
689
|
+
margin-top: 8px;
|
|
690
|
+
display: inline-block;
|
|
691
|
+
border: var(--lb-variant-border-width) solid var(--lb-variant-border-color);
|
|
692
|
+
border-radius: var(--lb-variant-radius);
|
|
693
|
+
padding: 8px 32px 8px 12px;
|
|
694
|
+
font-size: 12px;
|
|
695
|
+
line-height: 16px;
|
|
696
|
+
color: var(--lb-text);
|
|
697
|
+
background: var(--lb-bg);
|
|
698
|
+
font-family: inherit;
|
|
699
|
+
cursor: pointer;
|
|
700
|
+
appearance: none;
|
|
701
|
+
-webkit-appearance: none;
|
|
702
|
+
background-image: var(--lb-variant-chevron);
|
|
703
|
+
background-repeat: no-repeat;
|
|
704
|
+
background-position: right 8px center;
|
|
705
|
+
background-size: 12px;
|
|
706
|
+
max-width: 100%;
|
|
707
|
+
}
|
|
708
|
+
|
|
709
|
+
.lb-bundle-variant-select:focus-visible {
|
|
710
|
+
outline: 2px solid var(--lb-primary-color);
|
|
711
|
+
outline-offset: 2px;
|
|
712
|
+
}
|
|
713
|
+
`,Fe=`/* Lime Bundles \u2014 Mix & Match styles */
|
|
714
|
+
|
|
715
|
+
/* === Progress Bar === */
|
|
716
|
+
.lb-mix-match__progress {
|
|
717
|
+
margin-bottom: 16px;
|
|
718
|
+
}
|
|
719
|
+
|
|
720
|
+
.lb-mix-match__progress-labels {
|
|
721
|
+
display: flex;
|
|
722
|
+
justify-content: space-between;
|
|
723
|
+
margin-bottom: 8px;
|
|
724
|
+
}
|
|
725
|
+
|
|
726
|
+
.lb-mix-match__progress-count {
|
|
727
|
+
font-size: 12px;
|
|
728
|
+
font-weight: 500;
|
|
729
|
+
line-height: 16px;
|
|
730
|
+
color: color-mix(in srgb, var(--lb-text) 60%, transparent);
|
|
731
|
+
}
|
|
732
|
+
|
|
733
|
+
.lb-mix-match__progress-remaining {
|
|
734
|
+
font-size: 12px;
|
|
735
|
+
font-weight: 500;
|
|
736
|
+
line-height: 16px;
|
|
737
|
+
color: var(--lb-text);
|
|
738
|
+
}
|
|
739
|
+
|
|
740
|
+
.lb-mix-match__progress-track {
|
|
741
|
+
width: 100%;
|
|
742
|
+
height: 4px;
|
|
743
|
+
background: color-mix(in srgb, var(--lb-text) 10%, transparent);
|
|
744
|
+
border-radius: 4px;
|
|
745
|
+
overflow: hidden;
|
|
746
|
+
}
|
|
747
|
+
|
|
748
|
+
.lb-mix-match__progress-fill {
|
|
749
|
+
height: 100%;
|
|
750
|
+
background: var(--lb-text);
|
|
751
|
+
border-radius: 4px;
|
|
752
|
+
transition: width 0.3s ease;
|
|
753
|
+
}
|
|
754
|
+
|
|
755
|
+
/* === Slots === */
|
|
756
|
+
.lb-mix-match__slot {
|
|
757
|
+
cursor: pointer;
|
|
758
|
+
}
|
|
759
|
+
|
|
760
|
+
.lb-mix-match .lb-bundle-product-row {
|
|
761
|
+
align-items: center;
|
|
762
|
+
}
|
|
763
|
+
|
|
764
|
+
.lb-mix-match__slot--empty:focus-visible {
|
|
765
|
+
outline: 2px solid var(--lb-primary-color);
|
|
766
|
+
outline-offset: 2px;
|
|
767
|
+
border-radius: 8px;
|
|
768
|
+
}
|
|
769
|
+
|
|
770
|
+
.lb-mix-match__slot--empty .lb-mix-match__empty-thumb {
|
|
771
|
+
width: 60px;
|
|
772
|
+
height: 60px;
|
|
773
|
+
min-width: 60px;
|
|
774
|
+
border: var(--lb-image-border-width) dashed color-mix(in srgb, var(--lb-text) 20%, transparent);
|
|
775
|
+
border-radius: var(--lb-image-border-radius);
|
|
776
|
+
box-sizing: border-box;
|
|
777
|
+
display: flex;
|
|
778
|
+
align-items: center;
|
|
779
|
+
justify-content: center;
|
|
780
|
+
color: color-mix(in srgb, var(--lb-text) 35%, transparent);
|
|
781
|
+
}
|
|
782
|
+
|
|
783
|
+
.lb-mix-match__empty-text {
|
|
784
|
+
font-size: 16px;
|
|
785
|
+
line-height: 20px;
|
|
786
|
+
color: color-mix(in srgb, var(--lb-text) 45%, transparent);
|
|
787
|
+
}
|
|
788
|
+
|
|
789
|
+
/* Filled slot */
|
|
790
|
+
.lb-mix-match__slot--filled {
|
|
791
|
+
cursor: default;
|
|
792
|
+
}
|
|
793
|
+
|
|
794
|
+
.lb-mix-match .lb-bundle-thumbnail {
|
|
795
|
+
width: 60px;
|
|
796
|
+
height: 60px;
|
|
797
|
+
min-width: 60px;
|
|
798
|
+
border-radius: var(--lb-image-border-radius);
|
|
799
|
+
border: var(--lb-image-border-width) solid var(--lb-image-border-color);
|
|
800
|
+
box-sizing: border-box;
|
|
801
|
+
overflow: visible;
|
|
802
|
+
}
|
|
803
|
+
|
|
804
|
+
.lb-mix-match .lb-bundle-thumbnail img {
|
|
805
|
+
border-radius: max(0px, calc(var(--lb-image-border-radius) - var(--lb-image-border-width)));
|
|
806
|
+
border: none;
|
|
807
|
+
}
|
|
808
|
+
|
|
809
|
+
.lb-mix-match__slot--filled .lb-mix-match__filled-info {
|
|
810
|
+
flex: 1;
|
|
811
|
+
min-width: 0;
|
|
812
|
+
display: flex;
|
|
813
|
+
flex-direction: column;
|
|
814
|
+
}
|
|
815
|
+
|
|
816
|
+
.lb-mix-match__slot--filled .lb-mix-match__filled-title {
|
|
817
|
+
font-size: 16px;
|
|
818
|
+
font-weight: 700;
|
|
819
|
+
line-height: 20px;
|
|
820
|
+
color: var(--lb-text);
|
|
821
|
+
text-decoration: none;
|
|
822
|
+
overflow-wrap: break-word;
|
|
823
|
+
}
|
|
824
|
+
|
|
825
|
+
.lb-mix-match__slot--filled a.lb-mix-match__filled-title:hover {
|
|
826
|
+
text-decoration: underline;
|
|
827
|
+
}
|
|
828
|
+
|
|
829
|
+
.lb-mix-match__slot--filled .lb-mix-match__filled-variant {
|
|
830
|
+
font-size: 12px;
|
|
831
|
+
line-height: 20px;
|
|
832
|
+
margin-top: 2px;
|
|
833
|
+
color: color-mix(in srgb, var(--lb-text) 60%, transparent);
|
|
834
|
+
}
|
|
835
|
+
|
|
836
|
+
.lb-mix-match__filled-price {
|
|
837
|
+
/* --lb-product-price-display fallback is the "on" branch; Liquid sets 'none' when merchant disables. */
|
|
838
|
+
display: var(--lb-product-price-display, block);
|
|
839
|
+
font-size: 12px;
|
|
840
|
+
line-height: 20px;
|
|
841
|
+
margin-top: 4px;
|
|
842
|
+
color: var(--lb-text);
|
|
843
|
+
font-weight: 500;
|
|
844
|
+
}
|
|
845
|
+
|
|
846
|
+
.lb-mix-match__filled-compare {
|
|
847
|
+
/* --lb-product-compare-display fallback is the "on" branch; Liquid sets 'none' when merchant disables. */
|
|
848
|
+
display: var(--lb-product-compare-display, inline);
|
|
849
|
+
font-size: 12px;
|
|
850
|
+
font-weight: 400;
|
|
851
|
+
color: color-mix(in srgb, var(--lb-text) 60%, transparent);
|
|
852
|
+
text-decoration: line-through;
|
|
853
|
+
margin-right: 4px;
|
|
854
|
+
}
|
|
855
|
+
|
|
856
|
+
.lb-mix-match__slot-remove {
|
|
857
|
+
min-width: 44px;
|
|
858
|
+
min-height: 44px;
|
|
859
|
+
display: flex;
|
|
860
|
+
align-items: center;
|
|
861
|
+
justify-content: center;
|
|
862
|
+
background: none;
|
|
863
|
+
border: none;
|
|
864
|
+
cursor: pointer;
|
|
865
|
+
color: var(--lb-text);
|
|
866
|
+
padding: 0;
|
|
867
|
+
margin-left: auto;
|
|
868
|
+
border-radius: 8px;
|
|
869
|
+
}
|
|
870
|
+
|
|
871
|
+
.lb-mix-match__slot-remove:hover {
|
|
872
|
+
color: var(--lb-text);
|
|
873
|
+
}
|
|
874
|
+
|
|
875
|
+
.lb-mix-match__slot-remove:focus-visible {
|
|
876
|
+
outline: 2px solid var(--lb-primary-color);
|
|
877
|
+
outline-offset: 2px;
|
|
878
|
+
}
|
|
879
|
+
|
|
880
|
+
/* Price placeholder */
|
|
881
|
+
.lb-mix-match__price-placeholder {
|
|
882
|
+
padding: 4px 0 16px;
|
|
883
|
+
text-align: center;
|
|
884
|
+
}
|
|
885
|
+
|
|
886
|
+
.lb-mix-match__price-placeholder-text {
|
|
887
|
+
font-size: 16px;
|
|
888
|
+
color: var(--lb-text);
|
|
889
|
+
}
|
|
890
|
+
|
|
891
|
+
/* === Modal Overlay === */
|
|
892
|
+
.lb-mix-match__modal-overlay {
|
|
893
|
+
position: fixed;
|
|
894
|
+
top: 0;
|
|
895
|
+
left: 0;
|
|
896
|
+
right: 0;
|
|
897
|
+
bottom: 0;
|
|
898
|
+
background: rgba(0, 0, 0, 0.5);
|
|
899
|
+
z-index: 9999;
|
|
900
|
+
display: flex;
|
|
901
|
+
align-items: center;
|
|
902
|
+
justify-content: center;
|
|
903
|
+
opacity: 0;
|
|
904
|
+
transition: opacity 0.2s ease-out;
|
|
905
|
+
}
|
|
906
|
+
|
|
907
|
+
.lb-mix-match__modal-overlay--open {
|
|
908
|
+
opacity: 1;
|
|
909
|
+
}
|
|
910
|
+
|
|
911
|
+
/* === Modal Panel === */
|
|
912
|
+
.lb-mix-match__modal {
|
|
913
|
+
background: var(--lb-picker-bg);
|
|
914
|
+
color: var(--lb-picker-text);
|
|
915
|
+
border-radius: var(--lb-picker-radius);
|
|
916
|
+
border: var(--lb-picker-border-width) solid var(--lb-picker-border-color);
|
|
917
|
+
box-sizing: border-box;
|
|
918
|
+
width: 100%;
|
|
919
|
+
max-width: 480px;
|
|
920
|
+
max-height: 70vh;
|
|
921
|
+
display: flex;
|
|
922
|
+
flex-direction: column;
|
|
923
|
+
overflow: hidden;
|
|
924
|
+
box-shadow: 0 8px 32px rgba(0, 0, 0, 0.16);
|
|
925
|
+
transform: translateY(24px);
|
|
926
|
+
transition: transform 0.25s ease-out;
|
|
927
|
+
will-change: transform;
|
|
928
|
+
}
|
|
929
|
+
|
|
930
|
+
.lb-mix-match__modal-overlay--open .lb-mix-match__modal {
|
|
931
|
+
transform: translateY(0);
|
|
932
|
+
}
|
|
933
|
+
|
|
934
|
+
/* === Modal Header === */
|
|
935
|
+
.lb-mix-match__modal-header {
|
|
936
|
+
display: flex;
|
|
937
|
+
align-items: center;
|
|
938
|
+
justify-content: space-between;
|
|
939
|
+
padding: 20px 20px 12px;
|
|
940
|
+
flex-shrink: 0;
|
|
941
|
+
}
|
|
942
|
+
|
|
943
|
+
.lb-mix-match__modal-title {
|
|
944
|
+
font-size: 20px;
|
|
945
|
+
font-weight: 600;
|
|
946
|
+
line-height: 24px;
|
|
947
|
+
margin: 0;
|
|
948
|
+
color: inherit;
|
|
949
|
+
}
|
|
950
|
+
|
|
951
|
+
.lb-mix-match__modal-close {
|
|
952
|
+
min-width: 44px;
|
|
953
|
+
min-height: 44px;
|
|
954
|
+
display: flex;
|
|
955
|
+
align-items: center;
|
|
956
|
+
justify-content: center;
|
|
957
|
+
background: none;
|
|
958
|
+
border: none;
|
|
959
|
+
cursor: pointer;
|
|
960
|
+
color: var(--lb-picker-text);
|
|
961
|
+
border-radius: 8px;
|
|
962
|
+
padding: 0;
|
|
963
|
+
margin: -12px -12px -12px 0;
|
|
964
|
+
}
|
|
965
|
+
|
|
966
|
+
.lb-mix-match__modal-close:focus-visible {
|
|
967
|
+
outline: 2px solid var(--lb-primary-color);
|
|
968
|
+
outline-offset: 2px;
|
|
969
|
+
}
|
|
970
|
+
|
|
971
|
+
/* === Modal Search === */
|
|
972
|
+
.lb-mix-match__modal-search {
|
|
973
|
+
padding: 0 20px 12px;
|
|
974
|
+
position: relative;
|
|
975
|
+
flex-shrink: 0;
|
|
976
|
+
}
|
|
977
|
+
|
|
978
|
+
.lb-mix-match__modal-search-input {
|
|
979
|
+
width: 100%;
|
|
980
|
+
padding: 12px 40px 12px 16px;
|
|
981
|
+
border: var(--lb-picker-search-border-width) solid var(--lb-picker-search-border-color);
|
|
982
|
+
border-radius: var(--lb-picker-search-radius);
|
|
983
|
+
font-size: 16px;
|
|
984
|
+
line-height: 20px;
|
|
985
|
+
color: var(--lb-picker-text);
|
|
986
|
+
background: var(--lb-picker-bg);
|
|
987
|
+
box-sizing: border-box;
|
|
988
|
+
-webkit-appearance: none;
|
|
989
|
+
appearance: none;
|
|
990
|
+
}
|
|
991
|
+
|
|
992
|
+
.lb-mix-match__modal-search-input::placeholder {
|
|
993
|
+
color: color-mix(in srgb, var(--lb-picker-text) 50%, transparent);
|
|
994
|
+
}
|
|
995
|
+
|
|
996
|
+
.lb-mix-match__modal-search-input:focus {
|
|
997
|
+
outline: none;
|
|
998
|
+
box-shadow: 0 0 0 1px var(--lb-primary-color);
|
|
999
|
+
}
|
|
1000
|
+
|
|
1001
|
+
.lb-mix-match__modal-search-clear {
|
|
1002
|
+
position: absolute;
|
|
1003
|
+
right: 32px;
|
|
1004
|
+
/* Anchor to the input area only \u2014 parent has padding-bottom: 12px which would
|
|
1005
|
+
otherwise push a top:50% center down by 6px. */
|
|
1006
|
+
top: 0;
|
|
1007
|
+
bottom: 12px;
|
|
1008
|
+
min-width: 32px;
|
|
1009
|
+
min-height: 32px;
|
|
1010
|
+
display: flex;
|
|
1011
|
+
align-items: center;
|
|
1012
|
+
justify-content: center;
|
|
1013
|
+
background: none;
|
|
1014
|
+
border: none;
|
|
1015
|
+
cursor: pointer;
|
|
1016
|
+
color: var(--lb-picker-text);
|
|
1017
|
+
padding: 0;
|
|
1018
|
+
}
|
|
1019
|
+
|
|
1020
|
+
/* === Modal Product List === */
|
|
1021
|
+
.lb-mix-match__modal-list {
|
|
1022
|
+
overflow-y: auto;
|
|
1023
|
+
flex: 1;
|
|
1024
|
+
padding: 0 20px;
|
|
1025
|
+
-webkit-overflow-scrolling: touch;
|
|
1026
|
+
}
|
|
1027
|
+
|
|
1028
|
+
.lb-mix-match__modal-product {
|
|
1029
|
+
display: flex;
|
|
1030
|
+
align-items: center;
|
|
1031
|
+
gap: 12px;
|
|
1032
|
+
padding: 12px 0;
|
|
1033
|
+
border-bottom: 1px solid color-mix(in srgb, var(--lb-picker-text) 7%, transparent);
|
|
1034
|
+
}
|
|
1035
|
+
|
|
1036
|
+
.lb-mix-match__modal-product:last-child {
|
|
1037
|
+
border-bottom: none;
|
|
1038
|
+
}
|
|
1039
|
+
|
|
1040
|
+
.lb-mix-match__modal-product-thumb {
|
|
1041
|
+
position: relative;
|
|
1042
|
+
width: 48px;
|
|
1043
|
+
height: 48px;
|
|
1044
|
+
min-width: 48px;
|
|
1045
|
+
border-radius: var(--lb-picker-product-radius);
|
|
1046
|
+
border: var(--lb-picker-product-border-width) solid var(--lb-picker-product-border-color);
|
|
1047
|
+
box-sizing: border-box;
|
|
1048
|
+
overflow: visible;
|
|
1049
|
+
background: #F0F0F0;
|
|
1050
|
+
}
|
|
1051
|
+
|
|
1052
|
+
/* Qty badge inside the picker modal inherits picker-product border (width + color) plus
|
|
1053
|
+
inverted picker bg/text for clear contrast against the modal \u2014 always stays round
|
|
1054
|
+
(the badge shape is independent of the thumbnail shape). */
|
|
1055
|
+
.lb-mix-match__modal-product-thumb .lb-bundle-qty-badge.lb-bundle-qty-badge {
|
|
1056
|
+
/* --lb-picker-qty-badge-display fallback is the "on" branch; Liquid sets 'none' when merchant disables. */
|
|
1057
|
+
display: var(--lb-picker-qty-badge-display, flex);
|
|
1058
|
+
background: var(--lb-picker-qty-badge-bg);
|
|
1059
|
+
color: var(--lb-picker-qty-badge-color);
|
|
1060
|
+
border: var(--lb-picker-product-border-width) solid var(--lb-picker-product-border-color);
|
|
1061
|
+
}
|
|
1062
|
+
|
|
1063
|
+
.lb-mix-match__modal-product-thumb img {
|
|
1064
|
+
width: 100%;
|
|
1065
|
+
height: 100%;
|
|
1066
|
+
object-fit: cover;
|
|
1067
|
+
border-radius: max(0px, calc(var(--lb-picker-product-radius) - var(--lb-picker-product-border-width)));
|
|
1068
|
+
}
|
|
1069
|
+
|
|
1070
|
+
.lb-mix-match__modal-product-info {
|
|
1071
|
+
flex: 1;
|
|
1072
|
+
min-width: 0;
|
|
1073
|
+
}
|
|
1074
|
+
|
|
1075
|
+
.lb-mix-match__modal-product-title {
|
|
1076
|
+
font-size: 16px;
|
|
1077
|
+
font-weight: 700;
|
|
1078
|
+
line-height: 20px;
|
|
1079
|
+
color: inherit;
|
|
1080
|
+
margin: 0;
|
|
1081
|
+
}
|
|
1082
|
+
|
|
1083
|
+
.lb-mix-match__modal-product-price {
|
|
1084
|
+
font-size: 12px;
|
|
1085
|
+
line-height: 20px;
|
|
1086
|
+
color: inherit;
|
|
1087
|
+
margin: 4px 0 0;
|
|
1088
|
+
}
|
|
1089
|
+
|
|
1090
|
+
.lb-mix-match__variant-select {
|
|
1091
|
+
font-size: 12px;
|
|
1092
|
+
margin: 4px 0 0;
|
|
1093
|
+
padding: 4px 24px 4px 8px;
|
|
1094
|
+
border: var(--lb-picker-variant-border-width) solid var(--lb-picker-variant-border-color);
|
|
1095
|
+
border-radius: var(--lb-picker-variant-radius);
|
|
1096
|
+
background-color: var(--lb-picker-bg);
|
|
1097
|
+
background-image: var(--lb-picker-variant-chevron);
|
|
1098
|
+
background-repeat: no-repeat;
|
|
1099
|
+
background-position: right 6px center;
|
|
1100
|
+
background-size: 12px;
|
|
1101
|
+
color: var(--lb-picker-text);
|
|
1102
|
+
font-family: inherit;
|
|
1103
|
+
min-height: 32px;
|
|
1104
|
+
cursor: pointer;
|
|
1105
|
+
max-width: 120px;
|
|
1106
|
+
appearance: none;
|
|
1107
|
+
-webkit-appearance: none;
|
|
1108
|
+
}
|
|
1109
|
+
|
|
1110
|
+
.lb-mix-match__variant-select:focus-visible {
|
|
1111
|
+
outline: 2px solid var(--lb-primary-color);
|
|
1112
|
+
outline-offset: 2px;
|
|
1113
|
+
}
|
|
1114
|
+
|
|
1115
|
+
.lb-mix-match__modal-add {
|
|
1116
|
+
padding: 8px 20px;
|
|
1117
|
+
background: var(--lb-picker-add-bg);
|
|
1118
|
+
color: var(--lb-picker-add-label);
|
|
1119
|
+
border: var(--lb-picker-add-border-width) solid var(--lb-picker-add-border-color);
|
|
1120
|
+
border-radius: var(--lb-picker-add-radius);
|
|
1121
|
+
box-sizing: border-box;
|
|
1122
|
+
font-size: 12px;
|
|
1123
|
+
font-weight: 600;
|
|
1124
|
+
cursor: pointer;
|
|
1125
|
+
white-space: nowrap;
|
|
1126
|
+
flex-shrink: 0;
|
|
1127
|
+
}
|
|
1128
|
+
|
|
1129
|
+
.lb-mix-match__modal-add:hover {
|
|
1130
|
+
opacity: 0.9;
|
|
1131
|
+
}
|
|
1132
|
+
|
|
1133
|
+
.lb-mix-match__modal-add:focus-visible {
|
|
1134
|
+
outline: 2px solid var(--lb-primary-color);
|
|
1135
|
+
outline-offset: 2px;
|
|
1136
|
+
}
|
|
1137
|
+
|
|
1138
|
+
.lb-mix-match__modal-add:disabled {
|
|
1139
|
+
background: color-mix(in srgb, var(--lb-picker-add-bg) 35%, var(--lb-picker-bg));
|
|
1140
|
+
color: color-mix(in srgb, var(--lb-picker-add-label) 85%, transparent);
|
|
1141
|
+
cursor: not-allowed;
|
|
1142
|
+
}
|
|
1143
|
+
|
|
1144
|
+
/* Sold out product row */
|
|
1145
|
+
.lb-mix-match__modal-product--sold-out {
|
|
1146
|
+
opacity: 0.5;
|
|
1147
|
+
}
|
|
1148
|
+
|
|
1149
|
+
.lb-mix-match__modal-product--sold-out .lb-mix-match__modal-sold-out-label {
|
|
1150
|
+
font-size: 12px;
|
|
1151
|
+
color: inherit;
|
|
1152
|
+
font-weight: 500;
|
|
1153
|
+
white-space: nowrap;
|
|
1154
|
+
}
|
|
1155
|
+
|
|
1156
|
+
/* === Modal Empty State === */
|
|
1157
|
+
.lb-mix-match__modal-empty {
|
|
1158
|
+
padding: 32px 20px;
|
|
1159
|
+
text-align: center;
|
|
1160
|
+
}
|
|
1161
|
+
|
|
1162
|
+
.lb-mix-match__modal-empty p {
|
|
1163
|
+
margin: 0;
|
|
1164
|
+
font-size: 16px;
|
|
1165
|
+
color: var(--lb-picker-text);
|
|
1166
|
+
}
|
|
1167
|
+
|
|
1168
|
+
/* Hidden utility for search filtering */
|
|
1169
|
+
.lb-hidden {
|
|
1170
|
+
display: none !important;
|
|
1171
|
+
}
|
|
1172
|
+
|
|
1173
|
+
/* === Mobile Full-Screen Modal === */
|
|
1174
|
+
@media (max-width: 767px) {
|
|
1175
|
+
.lb-mix-match__modal-overlay {
|
|
1176
|
+
align-items: flex-end;
|
|
1177
|
+
}
|
|
1178
|
+
|
|
1179
|
+
.lb-mix-match__modal {
|
|
1180
|
+
max-width: 100%;
|
|
1181
|
+
max-height: 90vh;
|
|
1182
|
+
border-radius: 16px 16px 0 0;
|
|
1183
|
+
transform: translateY(100%);
|
|
1184
|
+
}
|
|
1185
|
+
|
|
1186
|
+
.lb-mix-match__modal-overlay--open .lb-mix-match__modal {
|
|
1187
|
+
transform: translateY(0);
|
|
1188
|
+
}
|
|
1189
|
+
}
|
|
1190
|
+
|
|
1191
|
+
/* === Reduced Motion === */
|
|
1192
|
+
@media (prefers-reduced-motion: reduce) {
|
|
1193
|
+
.lb-mix-match__modal-overlay,
|
|
1194
|
+
.lb-mix-match__modal,
|
|
1195
|
+
.lb-mix-match__progress-fill {
|
|
1196
|
+
transition: none;
|
|
1197
|
+
}
|
|
1198
|
+
}
|
|
1199
|
+
`,De=`/* Lime Bundles \u2014 Volume / Quantity Breaks styles */
|
|
1200
|
+
|
|
1201
|
+
.lb-volume__tiers {
|
|
1202
|
+
display: flex;
|
|
1203
|
+
flex-direction: column;
|
|
1204
|
+
gap: 12px;
|
|
1205
|
+
}
|
|
1206
|
+
|
|
1207
|
+
.lb-volume__tier {
|
|
1208
|
+
display: flex;
|
|
1209
|
+
align-items: center;
|
|
1210
|
+
gap: 12px;
|
|
1211
|
+
border: var(--lb-tier-border-width) solid var(--lb-tier-border-color);
|
|
1212
|
+
border-radius: var(--lb-tier-radius);
|
|
1213
|
+
padding: 12px 16px;
|
|
1214
|
+
cursor: pointer;
|
|
1215
|
+
position: relative;
|
|
1216
|
+
transition: border-color 0.15s ease;
|
|
1217
|
+
}
|
|
1218
|
+
|
|
1219
|
+
.lb-volume__tier:hover {
|
|
1220
|
+
border-color: color-mix(in srgb, var(--lb-tier-border-color) 50%, black);
|
|
1221
|
+
}
|
|
1222
|
+
|
|
1223
|
+
.lb-volume__tier:focus-visible {
|
|
1224
|
+
outline: 2px solid var(--lb-primary-color);
|
|
1225
|
+
outline-offset: 2px;
|
|
1226
|
+
}
|
|
1227
|
+
|
|
1228
|
+
.lb-volume__tier[aria-checked="true"] {
|
|
1229
|
+
border-color: var(--lb-tier-selected-border-color);
|
|
1230
|
+
outline: var(--lb-tier-selected-border-width) solid var(--lb-tier-selected-border-color);
|
|
1231
|
+
outline-offset: calc(-1 * var(--lb-tier-selected-border-width));
|
|
1232
|
+
}
|
|
1233
|
+
|
|
1234
|
+
.lb-volume__radio {
|
|
1235
|
+
width: 20px;
|
|
1236
|
+
height: 20px;
|
|
1237
|
+
min-width: 20px;
|
|
1238
|
+
border: 2px solid var(--lb-text);
|
|
1239
|
+
border-radius: 50%;
|
|
1240
|
+
display: flex;
|
|
1241
|
+
align-items: center;
|
|
1242
|
+
justify-content: center;
|
|
1243
|
+
transition: border-color 0.15s ease;
|
|
1244
|
+
}
|
|
1245
|
+
|
|
1246
|
+
.lb-volume__tier[aria-checked="true"] .lb-volume__radio {
|
|
1247
|
+
border-color: var(--lb-text);
|
|
1248
|
+
}
|
|
1249
|
+
|
|
1250
|
+
.lb-volume__radio-dot {
|
|
1251
|
+
width: 12px;
|
|
1252
|
+
height: 12px;
|
|
1253
|
+
border-radius: 50%;
|
|
1254
|
+
background: transparent;
|
|
1255
|
+
transition: background 0.15s ease;
|
|
1256
|
+
}
|
|
1257
|
+
|
|
1258
|
+
.lb-volume__tier[aria-checked="true"] .lb-volume__radio-dot {
|
|
1259
|
+
background: var(--lb-text);
|
|
1260
|
+
}
|
|
1261
|
+
|
|
1262
|
+
/* Tier content: 2x2 grid layout */
|
|
1263
|
+
.lb-volume__tier-grid {
|
|
1264
|
+
flex: 1;
|
|
1265
|
+
display: grid;
|
|
1266
|
+
row-gap: 4px;
|
|
1267
|
+
align-items: center;
|
|
1268
|
+
}
|
|
1269
|
+
|
|
1270
|
+
.lb-volume__tier-label {
|
|
1271
|
+
font-size: 16px;
|
|
1272
|
+
font-weight: 700;
|
|
1273
|
+
color: var(--lb-text);
|
|
1274
|
+
}
|
|
1275
|
+
|
|
1276
|
+
.lb-volume__tier-badge {
|
|
1277
|
+
flex-shrink: 0;
|
|
1278
|
+
font-size: 12px;
|
|
1279
|
+
line-height: 16px;
|
|
1280
|
+
color: var(--lb-popular-badge-text);
|
|
1281
|
+
background: var(--lb-popular-badge-bg);
|
|
1282
|
+
border: var(--lb-popular-badge-border-width) solid var(--lb-popular-badge-border-color);
|
|
1283
|
+
border-radius: var(--lb-popular-badge-radius);
|
|
1284
|
+
padding: 4px 8px;
|
|
1285
|
+
}
|
|
1286
|
+
|
|
1287
|
+
.lb-volume__tier-price {
|
|
1288
|
+
grid-column: 1 / -1;
|
|
1289
|
+
font-size: 12px;
|
|
1290
|
+
font-weight: 500;
|
|
1291
|
+
color: var(--lb-text);
|
|
1292
|
+
}
|
|
1293
|
+
|
|
1294
|
+
.lb-volume__tier-unit {
|
|
1295
|
+
font-size: 12px;
|
|
1296
|
+
color: var(--lb-text);
|
|
1297
|
+
}
|
|
1298
|
+
|
|
1299
|
+
/* Compare-at (strikethrough) price */
|
|
1300
|
+
.lb-volume__tier-compare {
|
|
1301
|
+
font-size: 12px;
|
|
1302
|
+
line-height: 16px;
|
|
1303
|
+
color: color-mix(in srgb, var(--lb-text) 60%, transparent);
|
|
1304
|
+
text-decoration: line-through;
|
|
1305
|
+
margin-right: 4px;
|
|
1306
|
+
}
|
|
1307
|
+
|
|
1308
|
+
|
|
1309
|
+
`,Ve=`/* Lime Bundles \u2014 web-component loading skeleton (not mirrored to theme assets) */
|
|
1310
|
+
|
|
1311
|
+
.lb-bundle-widget--loading {
|
|
218
1312
|
display: block;
|
|
219
|
-
--lb-
|
|
220
|
-
--lb-
|
|
221
|
-
--lb-
|
|
222
|
-
--lb-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
.lb-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
.lb-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
.lb-
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
.lb-
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
.lb-
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
|
|
1313
|
+
padding: var(--lb-widget-pad, 20px);
|
|
1314
|
+
border: 1px solid var(--lb-border, #E5E5E5);
|
|
1315
|
+
border-radius: var(--lb-radius, 12px);
|
|
1316
|
+
background: var(--lb-bg, #FFFFFF);
|
|
1317
|
+
/* Contain layout/paint so the skeleton doesn't influence ancestor
|
|
1318
|
+
layout once the real content swaps in. */
|
|
1319
|
+
contain: layout paint;
|
|
1320
|
+
}
|
|
1321
|
+
|
|
1322
|
+
.lb-bundle-widget--loading .lb-skeleton {
|
|
1323
|
+
background: linear-gradient(
|
|
1324
|
+
90deg,
|
|
1325
|
+
rgba(0, 0, 0, 0.06) 0%,
|
|
1326
|
+
rgba(0, 0, 0, 0.10) 50%,
|
|
1327
|
+
rgba(0, 0, 0, 0.06) 100%
|
|
1328
|
+
);
|
|
1329
|
+
background-size: 200% 100%;
|
|
1330
|
+
border-radius: 6px;
|
|
1331
|
+
animation: lb-skeleton-pulse 1.4s ease-in-out infinite;
|
|
1332
|
+
}
|
|
1333
|
+
|
|
1334
|
+
.lb-bundle-widget--loading .lb-skeleton--title {
|
|
1335
|
+
height: 28px;
|
|
1336
|
+
width: 60%;
|
|
1337
|
+
margin-bottom: 16px;
|
|
1338
|
+
}
|
|
1339
|
+
|
|
1340
|
+
.lb-bundle-widget--loading .lb-skeleton--products {
|
|
1341
|
+
display: grid;
|
|
1342
|
+
gap: 12px;
|
|
1343
|
+
margin-bottom: 16px;
|
|
1344
|
+
}
|
|
1345
|
+
|
|
1346
|
+
.lb-bundle-widget--loading .lb-skeleton--row {
|
|
1347
|
+
display: grid;
|
|
1348
|
+
grid-template-columns: 56px 1fr 60px;
|
|
1349
|
+
gap: 12px;
|
|
1350
|
+
align-items: center;
|
|
1351
|
+
}
|
|
1352
|
+
|
|
1353
|
+
.lb-bundle-widget--loading .lb-skeleton--thumb {
|
|
1354
|
+
height: 56px;
|
|
1355
|
+
width: 56px;
|
|
1356
|
+
border-radius: 8px;
|
|
1357
|
+
}
|
|
1358
|
+
|
|
1359
|
+
.lb-bundle-widget--loading .lb-skeleton--line {
|
|
1360
|
+
height: 14px;
|
|
1361
|
+
border-radius: 4px;
|
|
1362
|
+
}
|
|
1363
|
+
|
|
1364
|
+
.lb-bundle-widget--loading .lb-skeleton--line + .lb-skeleton--line {
|
|
1365
|
+
margin-top: 8px;
|
|
1366
|
+
width: 70%;
|
|
1367
|
+
}
|
|
1368
|
+
|
|
1369
|
+
.lb-bundle-widget--loading .lb-skeleton--price {
|
|
1370
|
+
height: 20px;
|
|
1371
|
+
width: 60px;
|
|
1372
|
+
}
|
|
1373
|
+
|
|
1374
|
+
.lb-bundle-widget--loading .lb-skeleton--footer {
|
|
1375
|
+
margin-top: 16px;
|
|
1376
|
+
padding-top: 16px;
|
|
1377
|
+
border-top: 1px solid var(--lb-border, #E5E5E5);
|
|
1378
|
+
display: grid;
|
|
1379
|
+
grid-template-columns: 1fr auto;
|
|
1380
|
+
gap: 12px;
|
|
1381
|
+
align-items: center;
|
|
1382
|
+
}
|
|
1383
|
+
|
|
1384
|
+
.lb-bundle-widget--loading .lb-skeleton--total {
|
|
1385
|
+
height: 24px;
|
|
1386
|
+
width: 40%;
|
|
1387
|
+
}
|
|
1388
|
+
|
|
1389
|
+
.lb-bundle-widget--loading .lb-skeleton--cta {
|
|
1390
|
+
height: 44px;
|
|
1391
|
+
width: 140px;
|
|
1392
|
+
border-radius: var(--lb-cta-radius, 8px);
|
|
1393
|
+
}
|
|
1394
|
+
|
|
1395
|
+
@keyframes lb-skeleton-pulse {
|
|
1396
|
+
0% { background-position: 0% 50%; }
|
|
1397
|
+
100% { background-position: -200% 50%; }
|
|
1398
|
+
}
|
|
1399
|
+
|
|
1400
|
+
@media (prefers-reduced-motion: reduce) {
|
|
1401
|
+
.lb-bundle-widget--loading .lb-skeleton {
|
|
1402
|
+
animation: none;
|
|
1403
|
+
}
|
|
1404
|
+
}
|
|
1405
|
+
`;var $t=e=>`lb_cart_id:${e}`;function Wt(e){if(e)return e.trim()||null;if(typeof document<"u"){let t=document.querySelector('meta[name="shopify:product-handle"]');if(t?.content)return t.content.trim()||null}if(typeof window<"u"){let t=window.location.pathname.match(/\/products\/([^/?#]+)/);if(t?.[1])return decodeURIComponent(t[1])}return null}var z=class extends HTMLElement{static observedAttributes=["shop-domain","storefront-token","bundle-gid","product-handle","app-url","analytics","locale"];shadow;bundles=[];abortController=null;impressionCleanups=[];renderCleanups=[];shopCustomCss=null;constructor(){super(),this.shadow=this.attachShadow({mode:"open"})}connectedCallback(){this.fetchBundle()}disconnectedCallback(){this.abortController?.abort(),this.teardownImpressions(),this.teardownRenderers()}teardownImpressions(){for(let t of this.impressionCleanups)t();this.impressionCleanups=[]}teardownRenderers(){for(let t of this.renderCleanups)t();this.renderCleanups=[]}attributeChangedCallback(t,n,o){n===o||!this.isConnected||(t==="bundle-gid"||t==="product-handle"||t==="shop-domain"||t==="storefront-token")&&this.shopDomain&&this.storefrontToken&&this.fetchBundle()}get shopDomain(){return this.getAttribute("shop-domain")??""}get storefrontToken(){return this.getAttribute("storefront-token")??""}get bundleGid(){return this.getAttribute("bundle-gid")??""}get productHandleAttr(){return this.getAttribute("product-handle")??""}get appUrl(){return this.getAttribute("app-url")??""}get analyticsEnabled(){return this.getAttribute("analytics")!=="false"}async fetchBundle(){if(!this.shopDomain||!this.storefrontToken){this.renderError("Missing required attributes: shop-domain, storefront-token");return}this.abortController?.abort();let t=new AbortController;this.abortController=t,this.renderLoading();let n=Y({shopDomain:this.shopDomain,accessToken:this.storefrontToken});try{let o,r=!1;if(this.bundleGid)r=!0,o=this.fetchSingleBundle(n,t.signal);else{let d=Wt(this.productHandleAttr);if(!d){this.teardownImpressions(),this.renderError("No bundle-gid or product-handle provided, and the current URL doesn't match /products/<handle>.");return}o=this.fetchProductBundles(n,t.signal,d)}let a=n.query(de,void 0,{signal:t.signal}).catch(()=>null);if(await o,t.signal.aborted)return;if(r&&this.bundles.length===0){this.teardownImpressions(),this.renderError("Bundle not found");return}let i=await a;if(i?.shop?.metafield?.value){ye(this.shopDomain,i.shop.metafield.value);let d=X(i.shop.metafield.value);d.ok&&(this.shopCustomCss=d.css)}await this.applyABVariants(),this.renderBundles()}catch(o){if(t.signal.aborted)return;this.bundles=[],this.teardownImpressions(),this.renderError(o instanceof Error?o.message:"Failed to load bundle")}}async applyABVariants(){if(!this.appUrl||this.bundles.length===0)return;let t=await Promise.all(this.bundles.map(async n=>{if(!n.abTestId||!n.abVariantB)return n;try{if((await Ce(this.appUrl,this.shopDomain,n.abTestId,n.id))?.variant==="B")return he(n)}catch(o){console.warn(`[lime-bundle] A/B assignment failed for bundle ${n.id}; falling back to Variant A.`,o)}return n}));this.bundles=t}async fetchSingleBundle(t,n){let o=await t.query(le,{id:this.bundleGid},{signal:n});if(!o.metaobject){this.bundles=[];return}let r=K(o.metaobject.id,o.metaobject.fields);this.bundles=r?[r]:[]}async fetchProductBundles(t,n,o){let r=await t.query(se,{handle:o},{signal:n});if(!r.product){this.bundles=[];return}let a=r.product.metafield?.references?.nodes??[],i=[];for(let d of a){let l=K(d.id,d.fields);l&&i.push(l)}this.bundles=i}handleAddToCart=async(t,n)=>{let o=new CustomEvent("lime-bundle:add-to-cart",{detail:{lines:n},bubbles:!0,composed:!0,cancelable:!0}),r=this.dispatchEvent(o);this.reportAddToCartEvent(t,n),r&&await this.defaultAddToCart(n)};async defaultAddToCart(t){if(typeof window>"u")return;let n=Y({shopDomain:this.shopDomain,accessToken:this.storefrontToken}),o=window.localStorage,r=$t(this.shopDomain),a=o?.getItem(r)??null;try{let i=null;if(a){let l=(await n.query(ue,{cartId:a,lines:t})).cartLinesAdd;l?.userErrors?.length?o?.removeItem(r):l?.cart&&(i=l.cart.checkoutUrl)}if(!i){let l=(await n.query(ce,{input:{lines:t}})).cartCreate;l?.cart&&(o?.setItem(r,l.cart.id),i=l.cart.checkoutUrl)}i?window.location.assign(i):this.dispatchEvent(new CustomEvent("lime-bundle:error",{detail:{message:"Cart creation failed",code:"CART_ERROR"},bubbles:!0,composed:!0}))}catch(i){this.dispatchEvent(new CustomEvent("lime-bundle:error",{detail:{message:i instanceof Error?i.message:"Cart mutation failed",code:"CART_ERROR"},bubbles:!0,composed:!0}))}}reportAddToCartEvent(t,n){if(!this.analyticsEnabled||!this.appUrl)return;let o=n.reduce((a,i)=>a+i.quantity,0),r=n.reduce((a,i)=>{let l=t.products.find(c=>c.variants.nodes.some(p=>p.id===i.merchandiseId))?.variants.nodes.find(c=>c.id===i.merchandiseId),u=l?parseFloat(l.price.amount):0;return a+u*i.quantity},0);ge({shopDomain:this.shopDomain,appUrl:this.appUrl},{bundleGid:t.id,bundleType:t.bundleType,productId:t.products[0]?.id??"",quantity:o,totalPrice:Math.round(r*100)/100})}renderBundles(){this.teardownImpressions(),this.teardownRenderers(),this.shadow.innerHTML="";let t=document.createElement("style");if(t.textContent=[ee,Me,Fe,De].join(`
|
|
1406
|
+
`),this.shadow.appendChild(t),this.shopCustomCss){let o=document.createElement("style");o.setAttribute("data-lime-bundles","shop-custom-css"),o.textContent=this.shopCustomCss,this.shadow.appendChild(o)}for(let o of this.bundles){let r=document.createElement("div");r.className="lb-bundle-widget",r.setAttribute("role","region"),r.setAttribute("aria-label",o.title),r.setAttribute("data-bundle-type",o.bundleType),r.setAttribute("data-bundle-gid",o.id),pe(r,o.widgetConfig);let a=d=>this.handleAddToCart(o,d),i=d=>this.renderCleanups.push(d);switch(o.bundleType){case"fixed":Be(r,o,a,i);break;case"mix_match":Te(r,o,a,i);break;case"volume":Re(r,o,a,i);break}this.shadow.appendChild(r),this.setupImpressionFor(o,r)}let n=this.bundles[0];this.dispatchEvent(new CustomEvent("lime-bundle:loaded",{detail:{bundleCount:this.bundles.length,bundleTypes:this.bundles.map(o=>o.bundleType),bundleType:n?.bundleType,title:n?.title},bubbles:!0,composed:!0}))}setupImpressionFor(t,n){if(!this.analyticsEnabled||!this.appUrl)return;let o=fe(n,()=>{me({shopDomain:this.shopDomain,appUrl:this.appUrl},{bundleGid:t.id,bundleType:t.bundleType})});this.impressionCleanups.push(o)}renderLoading(){this.shadow.innerHTML=`
|
|
1407
|
+
<style>${ee}</style>
|
|
1408
|
+
<style>${Ve}</style>
|
|
1409
|
+
<div class="lb-bundle-widget lb-bundle-widget--loading" aria-busy="true" aria-label="Loading bundle">
|
|
282
1410
|
<div class="lb-skeleton lb-skeleton--title"></div>
|
|
283
|
-
<div class="lb-skeleton
|
|
1411
|
+
<div class="lb-skeleton--products">
|
|
1412
|
+
<div class="lb-skeleton--row">
|
|
1413
|
+
<div class="lb-skeleton lb-skeleton--thumb"></div>
|
|
1414
|
+
<div>
|
|
1415
|
+
<div class="lb-skeleton lb-skeleton--line"></div>
|
|
1416
|
+
<div class="lb-skeleton lb-skeleton--line"></div>
|
|
1417
|
+
</div>
|
|
1418
|
+
<div class="lb-skeleton lb-skeleton--price"></div>
|
|
1419
|
+
</div>
|
|
1420
|
+
<div class="lb-skeleton--row">
|
|
1421
|
+
<div class="lb-skeleton lb-skeleton--thumb"></div>
|
|
1422
|
+
<div>
|
|
1423
|
+
<div class="lb-skeleton lb-skeleton--line"></div>
|
|
1424
|
+
<div class="lb-skeleton lb-skeleton--line"></div>
|
|
1425
|
+
</div>
|
|
1426
|
+
<div class="lb-skeleton lb-skeleton--price"></div>
|
|
1427
|
+
</div>
|
|
1428
|
+
<div class="lb-skeleton--row">
|
|
1429
|
+
<div class="lb-skeleton lb-skeleton--thumb"></div>
|
|
1430
|
+
<div>
|
|
1431
|
+
<div class="lb-skeleton lb-skeleton--line"></div>
|
|
1432
|
+
<div class="lb-skeleton lb-skeleton--line"></div>
|
|
1433
|
+
</div>
|
|
1434
|
+
<div class="lb-skeleton lb-skeleton--price"></div>
|
|
1435
|
+
</div>
|
|
1436
|
+
</div>
|
|
1437
|
+
<div class="lb-skeleton--footer">
|
|
1438
|
+
<div class="lb-skeleton lb-skeleton--total"></div>
|
|
1439
|
+
<div class="lb-skeleton lb-skeleton--cta"></div>
|
|
1440
|
+
</div>
|
|
284
1441
|
</div>
|
|
285
|
-
`}renderError(
|
|
1442
|
+
`}renderError(t){this.shadow.innerHTML="",this.dispatchEvent(new CustomEvent("lime-bundle:error",{detail:{message:t,code:"LOAD_ERROR"},bubbles:!0,composed:!0}))}};typeof customElements<"u"&&!customElements.get("lime-bundle")&&customElements.define("lime-bundle",z);return qe(qt);})();
|
|
286
1443
|
//# sourceMappingURL=lime-bundle.global.js.map
|