1(()=>{"use strict";const e={d:(t,s)=>{if(Array.isArray(s))for(var i=0;i<s.length;){var n=s[i++],o=s[i++];e.o(t,n)?0===o&&i++:0===o?Object.defineProperty(t,n,{enumerable:!0,value:s[i++]}):Object.defineProperty(t,n,{enumerable:!0,get:o})}else for(var n in s)e.o(s,n)&&!e.o(t,n)&&Object.defineProperty(t,n,{enumerable:!0,get:s[n]})},o:(e,t)=>Object.prototype.hasOwnProperty.call(e,t),r:e=>{Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})}};let t={};e.r(t),e.d(t,{AccordionLink:()=>AccordionLink,CollectionFilterSbWrapper:()=>CollectionFilterSbWrapper,DynamicMetaAccordionBlocks:()=>DynamicMetaAccordionBlocks,GlobalDynamicProductGroupNavigation:()=>GlobalDynamicProductGroupNavigation,GlobalDynamicProductGroupNavigationFilterUi:()=>GlobalDynamicProductGroupNavigationFilterUi,GlobalKindleModelSelector:()=>GlobalKindleModelSelector,GlobalSwatchSelect:()=>GlobalSwatchSelect,MagneticFitPlacement:()=>MagneticFitPlacement,PdpSelectorUi:()=>PdpSelectorUi,PhoneCaseTypeSelectorModal:()=>PhoneCaseTypeSelectorModal,ProductBlocks:()=>ProductBlocks,ProductColorSiblingSelector:()=>ProductColorSiblingSelector,ProductCustomizerWrapper:()=>ProductCustomizerWrapper,ProductData:()=>ProductData,ProductDesignSelector:()=>ProductDesignSelector,ProductDrinkwareTypeSelector:()=>ProductDrinkwareTypeSelector,ProductFaqSection:()=>ProductFaqSection,ProductFormWrapperV2:()=>ProductFormWrapperV2,ProductGallery:()=>ProductGallery,ProductGalleryDeviceColorSwitcher:()=>ProductGalleryDeviceColorSwitcher,ProductIcons:()=>ProductIcons,ProductKindleSelectors:()=>ProductKindleSelectors,ProductMagneticFit:()=>ProductMagneticFit,ProductOOSForm:()=>ProductOOSForm,ProductPowerbankModalSelector:()=>ProductPowerbankModalSelector,ProductPromoBanner:()=>ProductPromoBanner,ProductSalesboxContent:()=>ProductSalesboxContent,ProductSiblingTypeSelectors:()=>ProductSiblingTypeSelectors,ProductStockHelper:()=>ProductStockHelper,ProductUSPList:()=>ProductUSPList,ProductUpsells:()=>ProductUpsells,ProductUpsellsItem:()=>ProductUpsellsItem,ProductVariantRichContent:()=>ProductVariantRichContent,ShipTable:()=>ShipTable,productAccordionItem:()=>productAccordionItem,simpleFaqAccordion:()=>simpleFaqAccordion});class ProductData extends HTMLElement{constructor(){super()}connectedCallback(){DomReadyPromise().then(async()=>{let e=this.querySelector(':scope > script[type="application/json"]');if(e)if(this.settings=JSON.parse(e.innerHTML),e.remove(),e=null,this.settings){this.product$=new ObserverLite({key:"DataLayer.Product$"});try{await this.init()}catch(e){console.log(e),this.product$.next(!1)}}else this.remove();else this.remove()}).catch(e=>{console.log(e)})}
1async init(){const{product:e,collections:t,collections_counts:s,first_available_variant:i,selected_variant:n,inventory_quantity:o=[],inventory_policy:r=[],pre_order_metafield:a=[],filter_metafields:l={}}=this.settings,c=!!e&&{};if(!c)return void this.product$.next(c);c.usesFirstVar=!1;let d=t||[];const u=s||[];d=d.map((e,t)=>(e.count=u[t],e));const p=new ObserverLite({key:"DataLayer.initSelectedPhoneCaseType$"}),h=await p.once();c.variants=e.variants.map((t,s)=>(t.inventory_quantity=o[s],t.inventory_policy=r[s],t.pre_order=a[s],t.optionNames=e.options,t));let g=i||e.variants[0],m=e.variants.filter(e=>e.option1==h);m=!!m.length&&m[0],n&&(c.use_selected_variant=!0,g=n),c.data=e,c.data.selected_variant=c.use_selected_variant?g:m||g,c.data.selected_variant.optionNames=e.options,c.singleModelProduct=1==e.options.length,c.siblings=[];const{model:y,design:b,siblingDataKey:f}=this.deriveModelData(e);let _,v;c.model=y,c.design=b;const w=!!f&&new ObserverLite({key:`Data.${f}`}),S=w?await w.once():[];if(f&&S)if("AirPods Case"==c.data.type)v=window.wbskGlobal.airPodsTranslations.translations.type,c.siblings=S.map(e=>{const t=window.wbskGlobal.airPodsTranslations.syntax.product,s=window.wbskGlobal.airPodsTranslations.translations;return s.model=handleize(e.title),s.design=b,{model:e,handle:t.replace(/\$(\w+)/g,(e,t)=>s[t])}});else{const t=window.wbskGlobal.caseTranslationHelper;_="Phone Case"==c.data.type?"phone":"default",v=t.getTranslation("case",_),c.siblings=S.map(e=>{let s=t.modelProductUrlStructure.replace("(design)",b).replace("(model)",handleize(e.title)).replace("(case)",v);return{model:e.title,handle:s}});const s=t.modelCollectionUrlStructure.replace("(model)",handleize(c.model)).replace("(cases)",t.casePlural);e.collection=`/collections/${s}`}c.siblings=c.siblings?.reduce((e,t)=>({...e,[t.model]:t}),{}),c.collections=d;let k=d?.filter(({rules:t})=>t?.some(({column:s,condition:i})=>("type"==s&&1==t?.length||"type"==s&&c.model?.includes(i)||"type"==s&&e.type?.includes(i)||"tag"==s&&1==t?.length||"tag"==s&&e.type?.includes(i)||"tag"==s&&i?.includes("model:"))&&!t?.some(({column:e})=>"title"==e)||"title"==s&&i?.includes(c.model)))?.sort((e,t)=>{if(e?.count!==t?.count)return t?.count-e?.count;const s=e?.body_html?e.body_html.length:0;return(t?.body_html?t.body_html.length:0)-s})||!1;c.allModelCollection=k?.find(({handle:e})=>"all"==e)||k[0]||!1,c.filter_metafields=l,c.design_uid=c.data?.tags?.find(e=>e.includes("design_uid:"))?.split("design_uid:")?.pop()||!1,this.product$.next(c),this.settings.useV3UserData&&(new ProductVisitHistory).set({product_type:c.data.type,design_uid:c.design_uid||null})}deriveModelData(e){let t=null,s=null,i=null;const n=e.tags||[],o=n.find(e=>e.includes("model"));if(o){t=o.split(":").pop();const i=handleize(t),n=e.handle.split(i);n[0]&&(s=n[0].substring(0,n[0].length-1))}return(n.includes("PhoneCase2")||n.includes("phoneCasePrelaunch"))&&(i="phoneCaseModelTypes"),n.includes("Airpods2")&&(i="earBudModelTypes"),n.includes("iPadCase")&&(i="ipadCaseModelTypes"),{model:t,design:s,siblingDataKey:i}}}customElements.define("product-data",ProductData);class ProductUpsells extends HTMLElement{constructor(){super()}connectedCallback(){DomReadyPromise().then(async()=>{let e=this.querySelector(':scope > script[type="application/json"]');if(!e)return void this.remove();this.settings=JSON.parse(e.innerHTML),e.remove(),e=null;const t=new ObserverLite({key:"DataLayer.ProductUpsellItems$"});if(this.upsellItems=await t.once(),this.upsellItems?.length){this.dynamicRender=new DynamicViewportRender({element:this,rootMargin:"600px 0px"}),await this.dynamicRender.inView();try{await this.init()}catch(e){console.log(e)}}else this.remove()}).catch(e=>{console.log(e)})}
1async init(){const e=new ObserverLite({key:"GlobalOnAtcModal$"});await e.once(),this.globalCart=await new GlobalCart,this.parseUpsellSettings(),this.wrapper=this.querySelector(".js-wbsk-product-upsell-wrapper"),this.htmlWrapper=this.querySelector(".js-wbsk-product-upsell-html-wrapper"),await this.updateProductUpsell(),this.updateUpsellSlider(),this._lastCartHash=this.globalCart.cart.hash64,this.globalCart.subscribe(e=>{const t=this.globalCart.cart.hash64;t!==this._lastCartHash&&(this._lastCartHash=t,this.updateProductUpsell().then(()=>this.updateUpsellSlider()))})}parseUpsellSettings(){const{product_design:e}=this.settings;this.upsellItems.forEach(t=>{if(t.settings.types.includes("=")){t.settings.applyDefaultVariant=!0;const e=t.settings.types.split(",");t.settings.types=e.map(e=>{const t=e.split("=");return{type:t[0].trim(),defaultVariantIndex:t.length>1?parseInt(t[1]):0}})}t.settings.updateForDesign?(t.settings.searchQueryString=`(tag:"design:${e}" AND (product_type:"${t.productData.type}"))`,t.settings.searchQueryType="design_type"):(t.settings.searchQueryString=`(handle:${t.settings.product})`,t.settings.searchQueryType="handle")})}async updateProductUpsell(){if(this._rendering)this._pendingRender=!0;else{this._rendering=!0,this.htmlWrapper.classList.add("wbsk-ui__loading");try{await this._doUpdateProductUpsell()}finally{if(this._rendering=!1,this.htmlWrapper.classList.remove("wbsk-ui__loading"),this._pendingRender)return this._pendingRender=!1,this.updateProductUpsell()}}}async _doUpdateProductUpsell(){const{product_title:e}=this.settings;let t=document.querySelector(".js-product-phone-model-selector"),s=!(!t||!t.VirtualSelector)&&t.VirtualSelector.selected.name;s=s||!!t&&t.value;const i=!!this.upsellItems.length&&JSON.parse(JSON.stringify(this.upsellItems));if(!i)return;const n=i.map(({settings:e})=>e.searchQueryString).join(" OR "),o=`/search?q=${encodeURIComponent(n)}&type=product&view=product.upsells.ajax`,r=await fetch(o).then(e=>e.text());this.htmlWrapper.innerHTML=r,customElements.upgrade(this.htmlWrapper),s&&this.htmlWrapper.querySelectorAll('global-screenprotector-type-selector script[type="application/json"]').forEach(e=>{try{const t=JSON.parse(e.textContent);t.model=s,e.textContent=JSON.stringify(t)}catch(e){}});const a=this.htmlWrapper.querySelectorAll("product-upsells-item");a.forEach(t=>{let s=!1;const n=t.querySelector(":scope > template");try{s=JSON.parse(n.innerHTML),n.remove()}catch(e){return void console.log(e)}const{productData:o,product_type:r,handle:l}=s;o.variants=o.variants||[];const c=i.findIndex(({settings:e,productData:t})=>"handle"==e.searchQueryType&&l==t.handle||"design_type"==e.searchQueryType&&r==t.type);if(c>-1){const s=i[c];s.productData=o,s.product_type=r,s.element=t;const n=t.querySelector('[name="properties[_atc_tracking_data][parent_product]"]');n&&(n.value=e);const a=t.querySelector(".js-product-upsell-item__tagline"),l=s.settings?.tagline||a.innerHTML||null;l.replace(/\s/g,"").length?a.innerHTML=l:a.remove()}t.dataset.index=c>-1?c:a.length}),Array.from(a).sort((e,t)=>parseInt(e.dataset.index)-parseInt(t.dataset.index)).forEach(e=>e.parentNode.appendChild(e));let l=this.htmlWrapper.querySelectorAll(".js-product-upsell-form");if(l.length){for(let e=0;e<i.length;e++){const t=i[e].element;if(!t)continue;const n=await t.setup({upsellConfig:i[e],selectedModel:s,globalCart:this.globalCart,parentSettings:this.settings,onTypeChange:t=>{const s=this.upsellItems[e];s&&(s.settings.product=t,s.settings.searchQueryString=`handle:${t}`,s.productData.handle=t,this.updateProductUpsell().then(()=>this.updateUpsellSlider()))}});if(n?.rerender){const t=this.upsellItems[e];return t.settings.product=n.handle,t.settings.searchQueryString=`handle:${n.handle}`,t.productData.handle=n.handle,this._doUpdateProductUpsell()}}l=this.htmlWrapper.querySelectorAll(".js-product-upsell-form"),l.length?(this.wrapper.style.display="block",window.wbskGlobal.productUpsellCarousel=EmblaCarousel(this.wrapper.querySelector(".js-product-upsell-carousel"),{loop:!0}),EmblaNav({dotsNode:this.wrapper.querySelector(".js-product-upsell-carousel-pagination")},window.wbskGlobal.productUpsellCarousel)):(window.wbskGlobal.productUpsellCarousel=!1,this.wrapper.style.display="none")}else window.wbskGlobal.productUpsellCarousel=!1,this.wrapper.style.display="none"}updateUpsellSlider(){window.wbskGlobal&&window.wbskGlobal.productUpsellCarousel&&setTimeout(()=>{window.wbskGlobal.productUpsellCarousel.reInit()},100)}}customElements.define("product-upsells",ProductUpsells);class ProductUpsellsItem extends HTMLElement{constructor(){super()}async setup({upsellConfig:e,selectedModel:t,globalCart:s,parentSettings:i,onTypeChange:n}){const{settings:o,productData:r,product_type:a}=e,{product_type:l,saving_label:c}=i,d=s.cart_item_ids,u=this.querySelector("product-form");if(!u)return this.remove(),{visible:!1};if("screenprotector"!=a&&!r.variants?.some(e=>e.available))return this.remove(),{visible:!1};if("screenprotector"==a){const e=s.cart?.items?.some(e=>"screenprotector"==e.product_type&&(!t||e.variant_title?.toLowerCase().includes(t.toLowerCase())));if(e)return this.remove(),{visible:!1}}if("screenprotector"===a){if(r.variants=r.variants.filter(e=>-1==d.indexOf(e.id)),!r.variants.length)return this.remove(),{visible:!1}}else{const e=s.cart?.items?.some(e=>e.product_id===r.id);if(e)return this.remove(),{visible:!1};if(o.updateForModel&&t){if(!r.variants.some(e=>e?.available&&e?.options?.some(e=>e==t)))return this.remove(),{visible:!1}}}const p=u.querySelector(".js-product-upsell-prod-atc"),h=u.querySelector("global-product-price");let g=!1;if(o.applyDefaultVariant){let e=o.types.filter(({type:e})=>e==l);e=!!e.length&&e[0].defaultVariantIndex,g=!!e&&r.variants[e]}if(o.updateForModel){const e=r.variants.filter(e=>!t||e?.options?.some(e=>e==t));g=e.find(e=>e.available)||e[0]}if(g=g||r.variants[0],this.variantTitle=this.querySelector(".js-product-upsell-item__variant_title"),this.variantTitle&&(this.variantTitle.textContent=g.title),u.init({data:r,selectedOptions:JSON.parse(JSON.stringify(g.options)),onUp
1date:async e=>{try{h.updatePriceSettings(e.price,e.compare_at_price),e.available?p.removeAttribute("disabled"):p.setAttribute("disabled",!0);const t=u.querySelector(".js-prod-upsell-sale-tag");if(t&&e.compare_at_price>e.price){const s=(e.compare_at_price-e.price)/e.compare_at_price*100;t.removeAttribute("hidden");const i=c.replace("[[amount]]",Math.round(s));t.innerText=i}else t&&t.setAttribute("hidden","");const s=u.querySelector(".js-product-upsell-prod-media"),i=r.media?.filter(({media_type:e})=>"video"==e).find(({alt:t})=>{if(!t?.length)return!1;const s=t?.split("/")||[],i=s[0].split(" ")||[];return!("COVER"!=s[1]||!i.includes(e.sku))})||e.featured_image?.src||!1;if(!i)return;const n=i?.sources?GetLazyPlayVideo({poster:i.preview_image.src,sources:i.sources,wrapperClass:"js-product-upsell-prod-media"}):`<img loading="lazy" class="js-product-upsell-prod-media d-block block-square" alt="${e.title}" src="${prefixImage(i,256)}">`;s.replaceWith(parseHTML(n))}catch(e){console.log(e)}}}),u.settings.showXsell=!0,"screenprotector"==a){const e=await this.setupScreenProtector({settings:o,productData:r,selectedModel:t,onTypeChange:n});if(e)return e}else this.setupOptionSelector({settings:o,productForm:u,defaultVariant:g});return u.update(!1,!0),{visible:!0}}async setupScreenProtector({settings:e,productData:t,selectedModel:s,onTypeChange:i}){const n=this.querySelector("global-screenprotector-type-selector"),o=!!n&&(await n.products$.once())?.products;if(!o?.length)return t.variants.some(e=>e.available)?void 0:(this.remove(),{visible:!1});const r=o.filter(({variants:e})=>e.some(({availableForSale:e,title:t})=>e&&(!s||t.toLowerCase().includes(s.toLowerCase()))));if(!r.length)return this.remove(),{visible:!1};if(!r.some(t=>t.handle==e.product))return{rerender:!0,handle:r[0].handle};r.length<=1?n.remove():n.subscribe(e=>{i(e.data.handle)})}setupOptionSelector({settings:e,productForm:t,defaultVariant:s}){const i=this.querySelector(".js-product-upsell-item__option-selector");i&&i.isMountedObserver$.once().then(()=>{i.updateOptions(s.options),i.subscribe(()=>{t.updateAllOptions(i.selectedOptionsArray),t.update()})})}}customElements.define("product-upsells-item",ProductUpsellsItem);class ProductOOSForm extends HTMLElement{constructor(){super()}connectedCallback(){DomReadyPromise().then(async()=>{let e=this.querySelector(":scope > template");if(e){try{this.settings=JSON.parse(e.innerHTML)}catch(e){console.log(e)}e.remove(),e=null}this.settings?(this.form=this.querySelector("form"),this.succesText=this.querySelector(".js-prod-oos-success-text"),this.ship_table=this.querySelector("ship-table"),this.bind()):this.remove()}).catch(e=>{console.log(e)})}bind(){this.isBound||(this.isBound=!0,this.form.addEventListener("submit",e=>(e.preventDefault(),this.classList.add("wbsk-ui__loading-small"),this.send().then(e=>{this.classList.remove("wbsk-ui__loading-small"),this.succesText.style.display="block",setTimeout(()=>{this.succesText.style.display="none"},5e3)}),!1)))}update({id:e,sku:t,show:s}){this.settings.variantId=e,this.settings.variantSku=t,this.style.display=s?"block":"none",this.ship_table.update(t)}send(){const e=this.form.querySelector('[name="email"]').value;return new Promise(async(t,s)=>{this.api=await new StorefrontApi;const i={method:"POST",headers:{accept:"application/json",revision:"2024-02-15","content-type":"application/json"},body:JSON.stringify({data:{type:"back-in-stock-subscription",attributes:{channels:["EMAIL"],profile:{data:{type:"profile",attributes:{email:e}}}},relationships:{variant:{data:{type:"catalog-variant",id:`$shopify:::$default:::${this.settings.variantId}`}}}}})};fetch(`https://a.klaviyo.com/client/back-in-stock-subscriptions/?company_id=${this.api.klavio_public_api_token}`,i).then(e=>{t()}).catch(e=>{console.log(e)})})}}customElements.define("oos-form",ProductOOSForm);class ShipTable extends HTMLElement{constructor(){super()}connectedCallback(){DomReadyPromise().then(async()=>{const e=this.attributes?.sku?.value||!1;e&&this.update(e)}).catch(e=>{console.log(e)})}update(e){DomReadyPromise().then(async()=>{if(!this.data){const e=new ObserverLite({key:"Data.ShipTables$"});this.data=await e.once(),this.data.blocks=this.data.blocks.map(e=>(e.sku=Array.isArray(e.sku)?e.sku:!!e.sku?.length&&e.sku.split(","),e.dates__data=Array.isArray(e.dates__data)?e.dates__data:e.dates__data?.length?e.dates__data.split(","):[],e)).filter(e=>e)}if(this.style.display="none",!this.data?.show)return;const t=this.data.blocks.find(t=>t.sku.some(t=>new RegExp("^"+t.replace(/\*/g,".*")+"$").test(e)));t&&(this.style.display="flex",this.innerHTML=t?`\n ${t.above_table?.length?`<p>${t.above_table}</p>`:""}\n <ul class="oos_table">\n ${t.dates__data.map(e=>`\n <li class="oos_table__item flex row-wrap align-center justify-space gap--d3">
1\n <span>${e}</span>\n <span class="t-ucase">${t.dates__translation}</span>\n </li>\n `).join("")}\n <li class="oos_table__item flex row-wrap align-center justify-space gap--d3">\n <span>${t.next_batch__translation}</span>\n <span>${t.next_batch__value}</span>\n </li>\n </ul>\n `:"")}).catch(e=>{console.log(e)})}}customElements.define("ship-table",ShipTable);class ProductStockHelper extends HTMLElement{constructor(){super()}connectedCallback(){}async update(e,t=[]){if(!this.data){this.dot=this.querySelector(".prod-stock__dot"),this.text=this.querySelector(".prod-stock__text");const e=await new ObserverLite({key:"Global.stockLevelHelperData$"}).once();this.data={settings:e.settings,breakpoints:e.blocks.filter(e=>"block"===e.type).map(e=>e.settings).sort((e,t)=>e.number-t.number),tagOverrides:e.blocks.filter(e=>"tag_override"===e.type).map(e=>({...e.settings,patterns:(e.settings.tags||"").split(",").map(e=>e.trim().toLowerCase()).filter(Boolean)}))}}const s=t.map(e=>String(e).toLowerCase()),i=this.data.tagOverrides.find(e=>e.patterns.some(e=>s.some(t=>this._tagMatches(t,e))))||this.data.breakpoints.find(t=>e.inventory_quantity<=t.number)||this.data.settings;this.dot.style.backgroundColor=i.color,this.text.innerText=i.title}_tagMatches(e,t){const s=t.startsWith("*"),i=t.endsWith("*"),n=t.slice(s?1:0,i?t.length-1:t.length);return s&&i?e.includes(n):s?e.endsWith(n):i?e.startsWith(n):e===n}}customElements.define("product-stock-helper",ProductStockHelper);class ProductBlocks extends HTMLElement{constructor(){super(),this.ObserverLite=new ObserverLite,this.onReadyObserver$=new ObserverLite,this.onDataObserver$=new ObserverLite}connectedCallback(){DomReadyPromise().then(async()=>{let e=this.querySelector(':scope > script[type="application/json"]');e&&(this.settings=JSON.parse(e.innerHTML));const t=new ObserverLite({key:"DataLayer.GlobalUXContext"}),s=await t.once();this.ux=s?.settings?.context||"female",this.onReadyObserver$.next(),this.api=await new StorefrontApi(null,{apiVersion:"2026-04"}),this.product$=new ObserverLite({key:"DataLayer.Product$"}),this.product=await this.product$.once(),this.selectedVariantOptions=this.product.data.selected_variant.options,this.selectedVariantSku=this.product.data.selected_variant.sku,this.product$.subscribe(async({variant:e})=>{this.selectedVariantOptions=e.options,this.selectedVariantSku=e.sku,await this.onDataObserver$.once(),this.render()}),this.getBlocksMetaLoop()}).catch(e=>{console.log(e)})}async getBlocksQuery({endCursor:e}=!1){const t=`\n query @inContext(country: ${this.api.localization.country.iso_code}) {\n metaobjects(\n first: 50,\n type: "pdp_below_fold_blocks"\n ${e?`, after: "${e}"`:""}\n ) {\n pageInfo {\n hasNextPage\n endCursor\n }\n edges {\n node {\n fields {\n key\n value\n reference {\n __typename\n ... on MediaImage {\n image {\n url\n altText\n }\n }\n }\n }\n }\n }\n }\n }\n \n `,{data:s,errors:i}=await this.api.authFetch({body:t,method:"POST"}),n=s?.metaobjects?.edges?.map(e=>e.node.fields.reduce((e,{key:t,value:s,reference:i})=>(e[t]=i?.image?.url?{url:i.image.url,alt:i.image.altText||""}:s&&/^\[.*\]$/.test(s.trim())||/^{.*}$/.test(s.trim())?(()=>{try{return JSON.parse(s)}catch{return s}})():s,e),{}))||[];return{pageInfo:s?.metaobjects.pageInfo,blocks:n}}async getBlocksMetaLoop({endCursor:e}={}){const t=await this.getBlocksQuery({endCursor:e});this.blocks=[...this.blocks||[],...t.blocks],t.pageInfo?.hasNextPage?this.getBlocksMetaLoop({endCursor:t.pageInfo.endCursor}):(this.parseBlocksAndRender(),this.onDataObserver$.next())}async parseBlocksAndRender(){let e=this.blocks;e=e.filter(e=>{let t=!1;return(!e.context_visibility||"All"==e.context_visibility||e.context_visibility.toLowerCase()===this.ux.toLowerCase())&&(e.product_types?.length&&(t=e.product_types.some(e=>{if(e.includes("*")){const t=e.replace("*","");return this.product.data.type.includes(t)}return this.product.data.type===e})),1==t&&e.product_types_excluding_product_tags?.length&&(t=!e.product_types_excluding_product_tags.some(e=>this.product.data.tags.includes(e))),!t&&e.product_tags?.length&&(t=e.product_tags.some(e=>this.product.data.tags.includes(e))),t)}),this.blocks=e,this.render()}async render(){this.showBlocks=this.blocks.filter(e=>
1{if(e.variant_skus?.length){const t=e.variant_skus.filter(Boolean),esc=e=>e.replace(/[.*+?^${}()|[\]\\]/g,"\\$&"),s=t.filter(e=>!e.startsWith("!")),i=t.filter(e=>e.startsWith("!")).map(e=>e.slice(1)),buildRegex=e=>{if("*"===e)return".*";const t=esc(e.replace(/\*/g,""));return e.startsWith("*")&&e.endsWith("*")?`.*${t}.*`:e.startsWith("*")?`.*${t}$`:e.endsWith("*")?`^${t}.*`:`^${t}$`};return(!s.length||s.some(e=>new RegExp(buildRegex(e)).test(String(this.selectedVariantSku).trim())))&&(!i.length||!i.some(e=>new RegExp(buildRegex(e)).test(String(this.selectedVariantSku).trim())))}if(!e.variant_option_index||"false"==e.variant_option_index||!e.values?.length)return!0;const t=e.values.map(e=>e.replace("~",",")),s=parseInt(e.variant_option_index);return t.includes(this.selectedVariantOptions[s])})||[],this.showBlocks=this.showBlocks.sort((e,t)=>(e.uid||"").localeCompare(t.uid||"",void 0,{numeric:!0,sensitivity:"base"}))||[],this.innerHTML=this.getTemplate()}getTemplate(){const e={};this.showBlocks.forEach(t=>{e[t.category]=e[t.category]?e[t.category]:[],e[t.category].push(t)});return Object.keys(e).map(t=>`<div class="tac"> <h2 class="h-style h-border h-s f-w500 t-ucase tac row"><span class="bg-white block-rel">${t}</span></h2> ${this.getCategoryBlocksTemplates(e[t])}\n </div>`).join("")}getCategoryBlocksTemplates(e){return e.map((e,t)=>{const s="male"==this.ux&&e.heading_male?e.heading_male:e.heading,i="male"==this.ux&&e.paragraph_male?e.paragraph_male:e.paragraph,n="male"==this.ux&&e.html_block_male?e.html_block_male:e.html_block,o="male"==this.ux&&e.image_male?e.image_male:e.image,r="male"==this.ux&&e.image_mobile_male?e.image_mobile_male:e.image_mobile,a="male"==this.ux&&e.video_male?e.video_male:e.video;return`\n <div class="row--l">\n <div class="flex column-nowrap flex-grid-y">\n\n ${s||i?`\n <div class="flex column-nowrap flex-grid-y--s">\n ${s?`<h3 class="h-style h-l f-w400 t-ucase">${s}</h3>`:""}\n ${i?`<div class="rte-content"><p class="t-m">${i}</p></div>`:""}\n </div>\n `:""}\n\n ${e.html_block?`\n ${e.html_block.includes("iframe")?`\n <div class="video-wrapper rounded-md">\n ${e.html_block}\n </div>\n `:`\n ${e.html_block}\n `}\n `:""}\n\n ${a||n?"":`\n <img\n alt="${o?.alt||`product bf #${t}`}"\n width="1024"\n height="1024"\n src="${o?.url}"\n ${r?'class="@mobile__hide rounded-md"':'class="rounded-md"'}\n loading="lazy"\n >\n ${r?`\n <img\n alt="${r?.alt||`product bf #${t}`}"\n width="1024"\n height="1024"\n src="${r?.url}"\n class="@mobile__show rounded-md"\n loading="lazy"\n >\n `:""}\n `}\n\n ${a&&!n?`\n <video\n loop autoplay muted playsinline\n poster="${o?.url}"\n preload="none"\n loading="lazy" \n class="block-12/12 rounded-md" \n src="${this.settings.videoDir}${a}">\n Your browser does not support the video tag.\n </video>\n `:""}\n </div>\n </div>\n `}).join("")}}function isPreorderQuantity(e){if("number"!=typeof e)return!1;const{min:t,max:s}=function getPreorderRange(){const{min:e=2e3,max:t=3e3}=window.wbskGlobal?.preorderRange||{};return{min:e,max:t}}();return e>t&&e<=s}customElements.define("product-blocks",ProductBlocks);function getImageUrl(e,t){return e+(e.includes("?")?"&":"?")+"width="+t}class ProductGalleryDeviceColorSwitcher extends HTMLElement{constructor(){super(),this.slideIndex=0}connectedCallback(){this.is_init||(this.is_init=!0,DomReadyPromise().then(async()=>{await deviceColorImages.ready(),this.render(),this.colorSub=deviceColorImages.subscribe(()=>this.render())}).catch(e=>console.log(e)))}disconnectedCallback(){this.colorSub&&(deviceColorImages.unsubscribe(this.colorSub),this.colorSub=null),this.is_init=!1}setSlideIndex(e){e!==this.slideIndex&&(this.slideIndex=e,this.applyVisibility())}applyVisibility(){const e=deviceColorImages.showSwitcher&&0===this.slideIndex;this.toggleAttribute("hidden",!e),e||this.querySelector("global-swatch-select")?.setOpen(!1)}
1render(){if(!deviceColorImages.showSwitcher)return this.innerHTML="",void this.applyVisibility();this.innerHTML=`\n <global-swatch-select>\n <script type="application/json">\n ${JSON.stringify({label:deviceColorImages.switcherLabel,direction:"up",selected:deviceColorImages.selected,options:deviceColorImages.optionsForCurrent()}).replace(/</g,"\\u003c")}\n <\/script>\n </global-swatch-select>\n `;this.querySelector("global-swatch-select").subscribe(({type:e,value:t})=>{"change"==e&&deviceColorImages.setColor(t)}),this.applyVisibility()}}customElements.define("product-gallery-device-color-switcher",ProductGalleryDeviceColorSwitcher);class ProductGallery extends GlobalCustomComponent{constructor(){super(),this.ready$=new ObserverLite,this.ObserverLite=new ObserverLite,this.onSlideChange=this.onSlideChange.bind(this),this.handleMouseMove=this.handleMouseMove.bind(this),this.settings={isCarousel:!1,hasThumbs:!0,onThumbClickCallback:!1}}connectedCallback(){this.init()}init(){DomReadyPromise().then(async()=>{const e=new URLSearchParams(window.location.search),t=this;let s=this.querySelector(':scope > script[type="application/json"]');if(s){const e=JSON.parse(s.innerHTML);this.settings={...this.settings,...e},s.remove(),s=null}this.settings={...this.settings,element:this,isCarousel:!0,loadingClass:"wbsk-ui__loading",loadingClassElement:this,carouselContainer:this.querySelector(".js-prod-image-gallery-carousel-container"),thumbCarouselContainer:this.querySelector(".js-prod-image-gallery-thumbs-carousel-container"),custom:!!e.get("customizer")},this.product$=new ObserverLite({key:"DataLayer.Product$"});const i=await this.product$.once();this.settings.product=i.data,this.thumbsWrapper=this.settings.thumbCarouselContainer,this.featImg=!this.settings.isCarousel&&this.settings.element.querySelector(".wbsk-gallery-feat-img"),this.settings.product_tags=this.settings.product.tags?.filter(e=>!e.includes(":"))||[],this.settings.product.available||this.settings.product_tags.push("out-of-stock"),this.zoomed_slide=!1,this.zoomReset=!1,this.touchStartDistance=0,this.scale=2;const n=new ObserverLite({key:"DataLayer.GlobalUXContext"}),o=await n.once(),r=o?.settings?.context||"female",a=this.settings.dev_use_bundle_model_split;a&&(this.GlobalPhoneModelSelector=await new ObserverLite({key:"GlobalPhoneModelSelector$"}).once(),this.settings.current_brand=getCurrentModelBrand(this.GlobalPhoneModelSelector?.selected?.global?.value||await this.GlobalPhoneModelSelector.selected.global.observer.once())),deviceColorImages.ready(),this.settings.items=this.getGalleryImageData(),this.settings.items=this.settings.items.map(e=>(e.items=e.items||[],e.items=e.items.map(e=>(e.ux_meta_data&&(e.ux_meta_data=e.ux_meta_data.split(",").reduce((e,t)=>{let[s,i]=t.split("=").map(e=>e.trim());const n=t.includes("!");return n&&(i=i.split("!").at(-1)),e[s]={value:i,negative:n},e},{})),e)),{...e,get itemsForCurrentUx(){return deviceColorImages.getItems(this.sku,this.items,{uxType:r,brand:a?t.settings.current_brand:"Apple"})}})),this.settings.isCarousel&&this.settings.items&&this.settings.items.length>0&&this.initCarousel(),a&&this.GlobalPhoneModelSelector.subscribe(async()=>{this.settings.current_brand=getCurrentModelBrand(this.GlobalPhoneModelSelector?.selected?.global?.value||await this.GlobalPhoneModelSelector.selected.global.observer.once()),this.update_handler(this.settings.product.selected_variant.sku,window.innerWidth)}),deviceColorImages.subscribe(()=>{this.update_handler(this.settings.product.selected_variant.sku,window.innerWidth)}),this.update_handler(this.settings.product.selected_variant.sku,window.innerWidth);new ObserverLite({key:"ProductGallery$"}).next(this)}).catch(e=>{console.log(e)})}getGalleryImageData(){const{product:e}=this.settings,t=e.title,s=e.variants.map(({featured_media:e})=>e?.id).filter(Boolean);let i=[...new Set(e.variants.map(e=>e.sku))].filter(Boolean);i.length||(i=["*"]);let n=i.reduce((e,t)=>({...e,[t]:{items:[],sku:t}}),{});e.media.forEach((e,i)=>{var o={};e.alt=e.alt||"";var r=e.alt.split("|"),a=r[0]||"";r.length>1&&(o.ux_type=r[1].split("#")[0]);var l=e.alt.split("#");if(l.length>1&&(o.ux_meta_data=l[1]),o.alt=t+" "+(i+1),"video"===e.media_type){var c=(e.preview_image||e).src;o.src={256:getImageUrl(c,256),128:getImageUrl(c,128)};var d=(e.sources||[]).slice().sort(function(e,t){return("m3u8"==e.format)-("m3u8"==t.format)||(t.height||0)-(e.height||0)}).map(function(e){return'<source src="'+e.url+'" type="'+e.mime_type+'">'}).join(""),u=getImageUrl(c,736);o.video_v2='<video loop autoplay muted playsinline preload="metadata" poster="'+u+'" class="block-12/12 block-objc block-fh">'+d+"</video>"}else{var p=!1;a.includes("\\")&&(p=this.settings.file_upload_videos?.find(({id:t})=>t==e.id)?.src||!1),o.src={2048:getImageUrl(e.src,2048),1024:getImageUrl(e.src,1024),767:getImageUrl(e.src,767),512:getImageUrl(e.src,512),256:getImageUrl(e.src,256),128:getImageUrl(e.src,128)},o.width=e.width,o.height=e.height,o.aspect_ratio=e.aspect_ratio,o.video=p}s.includes(e.id)&&(o.defaultVariantImage=!0);var h=(a.split("\\")[0]||"").split("/"),[g,m]=h;o.sortIndex="COVER"==m?0:null!=m?parseInt(m):i+1,g&&g.length&&"*"!=g&&g!=t?(g=g.split(" ")).forEac
1h(e=>{n[e]&&n[e].items.push(o)}):Object.keys(n).forEach(e=>{n[e].items.push(o)})});let o=Object.values(n);return o=o.map(e=>(e.items=e.items.sort((e,t)=>e.sortIndex-t.sortIndex),e)),o}initCarousel(){this.carousel=EmblaCarousel(this.settings.carouselContainer,{loop:!0}),EmblaNav({dotsNode:document.querySelector(".js-prod-image-gallery__carousel-pagination")},this.carousel),this.carousel.on("init",this.onSlideChange).on("slidesChanged",this.onSlideChange).on("select",()=>{this.onSlideChange(),this.resetZoom()}).on("reInit",()=>{const e=window.innerWidth;requestAnimationFrame(()=>{this.bindSlides(e)})}),this.thumbCarousel=EmblaCarousel(this.settings.thumbCarouselContainer,{axis:"y",containScroll:"keepSnaps",dragFree:!0}),EmblaNav({nextBtn:document.querySelector(".js-prod-image-gallery-thumbs-carousel-next"),prevBtn:document.querySelector(".js-prod-image-gallery-thumbs-carousel-prev")},this.thumbCarousel);let e=!1;window.addEventListener("resize",()=>{if(e)return;e=!0;const t=window.innerWidth;requestAnimationFrame(()=>{e=!1,this.bindSlides(t),this.togglePSWP(t)})});const t=window.innerWidth;requestAnimationFrame(()=>{this.togglePSWP(t),this.bindSlides(t)})}update_handler(e,t){this.settings.loadingClass&&this.settings.loadingClassElement&&this.settings.loadingClassElement.classList.add(this.settings.loadingClass),this.update_thumbs(e,t).then(()=>{this.settings.loadingClass&&this.settings.loadingClassElement&&this.settings.loadingClassElement.classList.remove(this.settings.loadingClass)})}updateFeaturedImgage(){const e=this.thumbsWrapper.querySelector(".active").href;this.featImg.prop("src",e)}onSlideChange(){const e=this.carousel.internalEngine().index.get(),t=this.thumbCarousel.slideNodes()[e];this.deviceColorSwitcher=this.deviceColorSwitcher||this.querySelector("product-gallery-device-color-switcher"),this.deviceColorSwitcher?.setSlideIndex?.(e),this.thumbCarousel.scrollTo(e),t?.parentNode?.querySelectorAll("button")?.forEach(e=>{e.classList.toggle("active",e==t)});this.carousel.slideNodes().forEach((t,s)=>{const i=t.querySelectorAll("video"),n=s===e;i.forEach(e=>{requestAnimationFrame(()=>{n?e.play():e.pause()})})})}bindThumbs(){this.thumbs=Array.from(this.thumbsWrapper.querySelectorAll("button"));const e=Array.from(["click","mouseover"]);this.thumbs.forEach(t=>e.forEach(e=>t.addEventListener(e,e=>{e.preventDefault(),this.thumbnail_handler(t)})))}thumbnail_handler(e){this.thumbs.forEach(t=>{t.classList.toggle("active",e==t)}),this.settings.isCarousel&&this.settings.items&&this.settings.items.length>0&&this.carousel.scrollTo(this.thumbs.indexOf(e),0),this.settings.isCarousel||this.updateFeaturedImgage()}getThumbs(e){const t=[];return e.itemsForCurrentUx.forEach((s,i)=>{const n=s.src[128];let o="";0==i&&(o="active");const r=`\n <button class="d-block js-prod-gal-carousel-thumb embla__slide embla__slide--auto btn-reset ${o}">\n <img loading="lazy" alt="${s.alt}" src="${n}" ${s.srcOriginal?`data-fallback-src="${s.srcOriginal}"`:""} width="${s.width}" height="${s.height}" alt="${e.sku}">\n </button>\n `;t.push(r)}),t}groupForSku(e){const t=this.settings.items||[],s=e||"*";return t.find(e=>e.sku===s)||t.find(e=>"*"===e.sku)||!1}get currentItems(){return!!this.current_sku&&this.groupForSku(this.current_sku)}update_thumbs(e,t){return e=e||"*",this.current_sku=e,new Promise((e,s)=>{if(!this.thumbCarousel)return void e();if(!this.currentItems)return void e();const i=this.getThumbs(this.currentItems);this.thumbCarousel.containerNode().innerHTML=i.join(""),this.thumbCarousel.reInit(),this.bindThumbs(),this.carousel?this.update_slides(t).then(()=>{this.onSlideChange(),e()}):e()})}getSlides(e,t){const s=[],i=this.settings.product_tags,n=(this.settings.product.variants||[]).filter(({sku:t})=>t==e.sku),o=this.settings.product.selected_variant?.id,r=n.find(({id:e})=>e==o)||n[0],a=r?.inventory_quantity??null,l=isPreorderQuantity(a);return e.itemsForCurrentUx.forEach((n,o)=>{const r=Object.keys(n.src).map(e=>`${n.src[e]} ${e}w`).join(","),c=`\n\n ${this.settings.v2pt&&0==o?`\n <global-proxy-tags>\n\n <template>\n\n {\n\n \n "sku":"${e.sku}",\n "tags": ${JSON.stringify(i)},\n "context": "product"\n }\n\n </template>\n\n </global-proxy-tags>\n <global-proxy-tags align_right>\n\n <template>\n\n {\n\n "sold_out":${JSON.stringify(!this.settings.product.available)},\n "inventory_quantity":${JSON.stringify(a)},\n "sku":"${e.sku}",\n "tags": ${JSON.stringify(i)},\n "context": "product"\n }\n\n </template>\n\n </global-proxy-tags>\n `:`\n ${i.length&&0==o?`\n <div class="col-thumb-badge-wrapper col-thumb-wrapper--product roun
1ded-md">\n ${i.map(e=>` <span class="col-thumb-badge col-thumb-badge--product col-thumb-badge--${handleize(e)}"></span>`).join("")}\n </div>\n `:""}\n `}\n `;let d=`\n ${n.video_v2?`\n ${n.video_v2}\n `:n.video?`\n <video \n loop autoplay muted playsinline poster="${n.src[512]}" \n class="block-12/12 block-objc block-fh" src="${n.video}" loading="lazy">\n Your browser does not support the video tag.\n </video>\n `:`\n <img \n src="${n.src[512]}"\n srcset="${r}"\n sizes="(max-width: 767px) 100vw, (max-width: 1280px) 55vw, (max-width: 1430px) 66vw, 960px"\n ${n.srcOriginal?`data-fallback-src="${n.srcOriginal}"`:""}\n data-zoom-src="${n.src[2048]}"\n class="block-12/12 d-block prod-image-gallery__img"\n loading="${0==o?"eager":"lazy"}"\n ${0==o?'fetchpriority="high"':""}\n data-aspect="${n.aspect_ratio}"\n alt="${n.alt}" \n width="${n.width}"\n height="${n.height}"> \n `} \n `;const u=!(t>1024||n.video||n.video_v2);d=u?`\n <a\n href="${n.src[2048]}"\n data-pswp-width="${n.width}"\n data-pswp-height="${n.height}"\n target="_blank"\n >\n ${d}\n </a>\n `:d,d=c+d;const p=n.colorVariant||"",h=[n.video_v2?"video:"+n.src[256]:n.video?"file:"+n.video:"img:"+n.src[2048],p,u?"a":"plain",l?"pre":""].join("|"),g=`\n <li class="embla__slide" data-sku="${e.sku}" data-index="${o}" data-color="${p}" data-media-key="${h}">\n ${d}\n </li>\n `;s.push({index:o,sku:e.sku,color:p,mediaKey:h,hasVideo:!(!n.video&&!n.video_v2),html:g})}),s}slideNeedsUpdate(e,t){const{mediaKey:s,sku:i,color:n}=e.dataset;return s?s!==t.mediaKey:i!==t.sku||(n||"")!==t.color||!!e.querySelector("video")!==t.hasVideo}update_slides(e){return new Promise(async(t,s)=>{if(!this.current_sku)return void t();const i=this.carousel.internalEngine().index.get(),n=this.carousel.containerNode(),o=this.getSlides(this.currentItems,e);let r=!1;for(o.forEach(e=>{const t=n.children[e.index];if(t&&!this.slideNeedsUpdate(t,e))return;const s=parseHTML(e.html).firstElementChild;r=!0,t?n.replaceChild(s,t):n.appendChild(s)});n.children.length>o.length;)n.lastElementChild.remove(),r=!0;r&&(this.carousel.reInit({watchDrag:o.length>1}),this.carousel.scrollTo(i>o.length-1?0:i,!0)),t(),this.next({type:"update.main_slide_html"})})}handleMouseMove(e){e.stopPropagation();const t=e.currentTarget.getBoundingClientRect(),s=-50-1*(100*((e.clientX-t.left)/t.width-.5)),i=-50-1*(100*((e.clientY-t.top)/t.height-.5));(this.zoomed_slide.querySelector(".prod-image-gallery__img")||this.zoomed_slide.querySelector("video")).animate([{transform:`translate(${s}%, ${i}%) scale(2)`}],{duration:400,easing:"ease-out",fill:"forwards"})}resetZoom(){if(!this.zoomed_slide)return;const e=this.zoomed_slide.querySelector(".prod-image-gallery__img")||this.zoomed_slide.querySelector("video");e.animate([{transform:"translate(-50%, -50%) scale(2)"}],{duration:200,fill:"forwards"}),e.animate([{transform:"translate(0%, 0%) scale(1)"}],{duration:0,fill:"forwards"}).finished.then(()=>{this.zoomed_slide.removeAttribute("zoomed",""),this.zoomed_slide.removeEventListener("mousemove",this.handleMouseMove),this.zoomed_slide=!1})}initZoom(e,t){this.scale=2,this.touchStartDistance=0,this.zoomed_slide=e,this.zoomed_slide.setAttribute("zoomed","");const s=this.zoomed_slide.querySelector(".prod-image-gallery__img")||this.zoomed_slide.querySelector("video");s instanceof HTMLImageElement&&s.hasAttribute("data-zoom-src")&&(s.removeAttribute("srcset"),s.src=s.dataset.zoomSrc),s.animate([{transform:"translate(-50%, -50%) scale(2)"}],{duration:0,fill:"forwards"}),this.zoomed_slide.addEventListener("mousemove",this.handleMouseMove)}bindSlides(e){let t=this.carousel.slideNodes();t=t.filter(e=>!e.hasAttribute("zoom_bound")&&!e.querySelector("video")),t.forEach(t=>
1{t.setAttribute("zoom_bound",""),t.addEventListener("click",s=>{if(e<=1024)return;s.stopPropagation(),s.preventDefault();!t.hasAttribute("zoomed")?this.initZoom(t,e):this.resetZoom()})})}togglePSWP(e){const t=document.querySelector(".js-cstmzr-data-preview");if(e>1024&&this.pwspIsInit)return this.ObserverLite.unsubscribe(this.productGallerySubs$),this.productGallerySubs$=null,this.lightbox?.destroy(),this.lightbox=null,void(this.pwspIsInit=!1);this.pwspIsInit||(this.pwspIsInit=!0,this.productGallerySubs$=this.subscribe(async({type:s})=>{if(!(e>1024)&&"update.main_slide_html"==s){let e=!1;if(t&&(e=deviceColorImages.getMainImage(this.current_sku),e)){const s=deviceColorImageSrc(e.url)[2048];t.setAttribute("data-pswp-width",e.width),t.setAttribute("data-pswp-height",e.height),t.setAttribute("data-pswp-src",s);const i=new Image;i.onload=()=>{i.naturalWidth&&(t.setAttribute("data-pswp-width",i.naturalWidth),t.setAttribute("data-pswp-height",i.naturalHeight))},i.src=s}this.lightbox&&this.lightbox.destroy();const s=new DynamicImporter(this.settings.assets);await s.load();this.lightbox=new PhotoSwipeLightbox({tapAction:"close",gallery:document.querySelector(".js-prod-image-gallery-carousel-container"),children:[t,...document.querySelectorAll(".js-prod-image-gallery-carousel-container a")].filter(e=>e),pswpModule:PhotoSwipe}),this.lightbox.init(),this.lightbox.on("change",()=>{const e=this.carousel.slideNodes().findIndex((e,t)=>this.lightbox.pswp.currSlide.data.element.classList.contains("js-cstmzr-data-preview")||e.querySelector("a")==this.lightbox.pswp.currSlide.data.element);this.carousel.scrollTo(e,0)})}}),this.update_slides(e))}}function esc(e){return String(e).replace(/[&<>"']/g,e=>({"&":"&","<":"<",">":">",'"':""","'":"'"}[e]))}customElements.define("product-gallery",ProductGallery);class GlobalSwatchSelect extends GlobalCustomComponent{constructor(){super(),this.handleOutside=this.handleOutside.bind(this),this.handleKeydown=e=>{"Escape"===e.key&&this.setOpen(!1)}}connectedCallback(){DomReadyPromise().then(()=>{if(this.is_init)return;this.is_init=!0,this.settings={label:"",direction:"down",options:[],selected:null};const e=this.querySelector(':scope > script[type="application/json"]');e&&(this.settings={...this.settings,...JSON.parse(e.textContent)},e.remove()),this.selected=null!=this.settings.selected?this.settings.selected:this.settings.options[0]?.value??null,this.open=!1,GlobalSwatchSelect.injectStyles(),this.setAttribute("direction",this.settings.direction),this.addEventListener("keydown",this.handleKeydown),this.render()}).catch(e=>console.log(e))}disconnectedCallback(){document.removeEventListener("click",this.handleOutside),this.removeEventListener("keydown",this.handleKeydown)}get selectedOption(){return this.settings.options.find(e=>e.value==this.selected)||!1}render(){const e=this.selectedOption,t=this.settings.toggle_class?esc(this.settings.toggle_class):"global-swatch-select__toggle--pill";this.innerHTML=`\n <button type="button" class="global-swatch-select__toggle ${t}" aria-haspopup="listbox" aria-expanded="false">\n ${this.swatchHtml(e&&e.color)}\n <span class="global-swatch-select__label">${esc(this.settings.label)}</span>\n </button>\n <div class="global-swatch-select__panel" role="listbox">\n ${this.settings.options.map(e=>`\n <button type="button" role="option" class="global-swatch-select__option" data-value="${esc(e.value)}" aria-selected="${e.value==this.selected}">\n ${this.swatchHtml(e.color)}\n <span class="global-swatch-select__label">${esc(e.label)}</span>
1\n <svg class="global-swatch-select__check" viewBox="0 0 12 12" fill="none" aria-hidden="true">\n <path d="M1.75 6.25 4.6 9.1 10.25 3.1" stroke="currentColor" stroke-width="1" stroke-linecap="round" stroke-linejoin="round"/>\n </svg>\n </button>\n `).join("")}\n </div>\n `,this.toggleEl=this.querySelector(".global-swatch-select__toggle"),this.toggleEl.addEventListener("click",e=>{e.stopPropagation(),this.setOpen(!this.open)}),this.querySelectorAll(".global-swatch-select__option").forEach(e=>{e.addEventListener("click",t=>{t.stopPropagation(),this.select(e.dataset.value)})})}swatchHtml(e){return`<span class="global-swatch-select__swatch"${e?` style="background:${esc(e)}"`:""}></span>`}setOpen(e){this.open=e,this.toggleAttribute("open",e),this.toggleEl?.setAttribute("aria-expanded",String(e)),e?document.addEventListener("click",this.handleOutside):document.removeEventListener("click",this.handleOutside)}handleOutside(e){this.contains(e.target)||this.setOpen(!1)}select(e){if(e!=this.selected){this.selected=e,this.settings.selected=e;const t=this.selectedOption,s=this.toggleEl.querySelector(".global-swatch-select__swatch");s&&(s.style.background=t?.color||""),this.querySelectorAll(".global-swatch-select__option").forEach(t=>{t.setAttribute("aria-selected",String(t.dataset.value==e))}),this.next({type:"change",value:e})}this.setOpen(!1)}static injectStyles(){if(document.getElementById("global-swatch-select-styles"))return;const e=document.createElement("style");e.id="global-swatch-select-styles",e.textContent='\n global-swatch-select{\n position:relative; display:inline-block;\n --swatch-select-size:32px;\n --swatch-select-dot:20px;\n --swatch-select-inset:calc((var(--swatch-select-size) - var(--swatch-select-dot)) / 2);\n }\n .global-swatch-select__toggle--pill,\n .global-swatch-select__option{\n display:flex; align-items:center; gap:var(--gutter-unit-xs);\n font:inherit; color:inherit; cursor:pointer; background:#fff; border:0;\n }\n .global-swatch-select__toggle--pill{\n box-sizing:border-box; height:var(--swatch-select-size);\n padding:0 var(--gutter-unit-s) 0 var(--swatch-select-inset);\n border:1px solid rgba(0,0,0,.12);\n border-radius:calc(var(--swatch-select-size) / 2);\n }\n .global-swatch-select__swatch{\n box-sizing:border-box;\n width:var(--swatch-select-dot); height:var(--swatch-select-dot);\n border-radius:var(--radius-pill); flex:0 0 auto; background:#eee;\n border:1px solid var(--grey);\n }\n .global-swatch-select__panel{\n position:absolute; left:0; min-width:100%; top:calc(100% + var(--gutter-unit-xs));\n display:none; flex-direction:column;\n background:#fff; border:1px solid rgba(0,0,0,.12); border-radius:8px;\n padding:var(--gutter-unit-xxs); z-index:60;\n }\n global-swatch-select[direction="up"] .global-swatch-select__panel{ top:auto; bottom:calc(100% + var(--gutter-unit-xs)); }\n global-swatch-select[open] .global-swatch-select__panel{ display:flex; }\n .global-swatch-select__option{\n box-sizing:border-box; min-height:var(--swatch-select-size); border-radius:var(--radius-sm);\n padding:var(--gutter-unit-xxs) var(--gutter-unit-xs) var(--gutter-unit-xxs) var(--swatch-select-inset);\n width:100%; text-align:left; white-space:nowrap;\n }\n .global-swatch-select__option:hover{ background:rgba(0,0,0,.05); }\n .global-swatch-select__check{\n width:calc(var(--gutter-unit) + var(--gutter-unit-d4)); height:calc(var(--gutter-unit) + var(--gutter-unit-d4));\n margin-left:auto; padding-left:var(--gutter-unit-xs); flex:0 0 auto; opacity:0;\n }\n .global-swatch-select__option[aria-selected="true"]{ font-weight:600; }\n .global-swatch-select__option[aria-selected="true"] .global-swatch-select__swatch{\n border-color:var(--green);\n }\n .global-swatch-select__option[aria-selected="true"] .global-swatch-select__check{ opacity:1; }\n ',document.head.appendChild(e)}}customElements.get("global-swatch-select")||customElements.define("global-swatch-select",GlobalSwatchSelect);class ProductIcons extends HTMLElement{constructor(){super(),this.onReadyObserver$=new ObserverLite,this.metaobjectsPageSize=250}connectedCallback(){DomReadyPromise().then(async()=>{this.onReadyObserver$.next(),this.hasAttribute("standalone")||(this.dynamicRender=new DynamicViewportRender({element:this}),await this.dynamicRender.inView(),this.product$=new ObserverLite({key:"DataLayer.Product$"}),this.product=await this.product$.once(),this.selectedVariantOptions=this.product.data.selected_variant.options,this.selectedVariantSku=this.product.data.selected_variant.sku,this.product$.subscribe(({variant:e})=>{this.selectedVariantOptions=e.options,this.selectedVariantSku=e.sku,this.update()}),this.update())}).catch(e=>{console.log(e)})}async renderFor({type:e,tags:t,options:s,sku:i}){return this.product={data:{type:e,tags:t||[]}},this.selectedVariantOptions=s||[],this.selectedVariantSku=i||"",await this.update(),this.showBlocks}
1async getBlocksMeta(){this.api=await new StorefrontApi;const e=[];let t=null;do{const s=`\n query @inContext(country: ${this.api.localization.country.iso_code}) {\n metaobjects(\n first: ${this.metaobjectsPageSize},\n ${t?`after: "${t}",`:""}\n type: "pdp_rhs_icons"\n ) {\n edges {\n node {\n fields {\n key\n value\n reference {\n __typename\n ... on MediaImage {\n image {\n url\n }\n }\n }\n }\n }\n }\n pageInfo {\n hasNextPage\n endCursor\n }\n }\n }\n\n `,{data:i,errors:n}=await this.api.authFetch({body:s,method:"POST"}),o=i?.metaobjects;if(!o)break;e.push(...o.edges||[]),t=o.pageInfo?.hasNextPage?o.pageInfo.endCursor:null}while(t);return e.map(e=>e.node.fields.reduce((e,{key:t,value:s,reference:i})=>(e[t]=i?.image?.url?i.image.url:s&&/^\[.*\]$/.test(s.trim())||/^{.*}$/.test(s.trim())?(()=>{try{return JSON.parse(s)}catch{return s}})():s,e),{}))}async update(){if(!this.blocks){let e=await this.getBlocksMeta();e=e.filter(e=>{let t=!1;return e.product_types?.length&&(t=e.product_types.some(e=>{if(e.includes("*")){const t=e.replace("*","");return this.product.data.type.includes(t)}return this.product.data.type===e})),1==t&&e.product_types_excluding_product_tags?.length&&(t=!e.product_types_excluding_product_tags.some(e=>this.product.data.tags.includes(e))),!t&&e.product_tags?.length&&(t=e.product_tags.some(e=>this.product.data.tags.includes(e))),t}),this.blocks=e}this.showBlocks=this.blocks.filter(e=>{if(e.variant_skus?.length){const t=e.variant_skus.filter(Boolean),esc=e=>e.replace(/[.*+?^${}()|[\]\\]/g,"\\$&"),s=t.filter(e=>!e.startsWith("!")),i=t.filter(e=>e.startsWith("!")).map(e=>e.slice(1)),buildRegex=e=>{if("*"===e)return".*";const t=esc(e.replace(/\*/g,""));return e.startsWith("*")&&e.endsWith("*")?`.*${t}.*`:e.startsWith("*")?`.*${t}$`:e.endsWith("*")?`^${t}.*`:`^${t}$`};return(!s.length||s.every(e=>new RegExp(buildRegex(e)).test(String(this.selectedVariantSku).trim())))&&(!i.length||!i.some(e=>new RegExp(buildRegex(e)).test(String(this.selectedVariantSku).trim())))}if(!e.variant_option_index||"false"==e.variant_option_index||!e.values?.length)return e;const t=e.values.map(e=>e.replace("~",",")),s=parseInt(e.variant_option_index);return t.includes(this.selectedVariantOptions[s])})||[],this.showBlocks=this.showBlocks.sort((e,t)=>(e.uid||"").localeCompare(t.uid||"",void 0,{numeric:!0,sensitivity:"base"}))||[],this.innerHTML=this.getTemplate()}getTemplate(){return this.showBlocks.map(e=>`\n <div class="wbsk-prod-icons__item block-4/12 cell-l--xs cell-r--xs row"> <img alt="${e.heading}" width="64" height="64" loading="lazy" class="d-block row block-c" src="${e.image}">\n <h4 class="h-style t-xs f-w400">${e.heading}</h4>\n </div>`).join("")}}customElements.define("product-icons",ProductIcons);class PhoneCaseTypeSelectorModal extends HTMLElement{constructor(){super(),this.ObserverLite=new ObserverLite,this.modalReady$=new ObserverLite}subscribe(e){return this.ObserverLite.subscribe(e)}next(e){this.ObserverLite.next(e)}connectedCallback(){DomReadyPromise().then(()=>{this.init()}).catch(e=>{console.log(e)})}disconnectedCallback(){this.ObserverLite.unsubscribeAll(),this.scrollObservers?.forEach(e=>e.disconnect()),this.releaseBodyScroll()}releaseBodyScroll(){this.bodyLocked&&(this.bodyLocked=!1,unlockBodyScroll())}toggle(){this.modalIsOpen=!this.modalIsOpen,this.style.display=this.modalIsOpen?"block":"none",this.modalIsOpen?(this.productOptionSelector?.caseTypeCarouselApi?.reInit(),this.iconsStale&&this.updateIcons(),this.bodyLocked||(this.bodyLocked=!0,lockBodyScroll()),this.TrapFocusLite.setFocus(),this.updateScrollState()):(this.releaseBodyScroll(),this.TrapFocusLite.resetFocus())}
1async init(){if(this.modalIsOpen=!1,this.TrapFocusLite=new TrapFocusLite(this),this.TrapFocusLite.subscribe(({key:e})=>{"Escape"===e&&this.toggle()}),this.phoneModel=this.attributes.model.value,this.caseTypeContent=await new ObserverLite({key:"DataLayer.caseTypeContent"}).once(),this.LEGACY__GlobalProductOptionSelectorUpdate$=new ObserverLite({key:"LEGACY__GlobalProductOptionSelectorUpdate$"}),this.confirmControls=this.querySelectorAll(".js-phone-case-type-selector-modal-confirm"),this.closeControls=this.querySelectorAll(".js-phone-case-type-selector-modal-toggle"),this.confirmControls.forEach(e=>e.addEventListener("click",e=>{this.toggle(),this.LEGACY__GlobalProductOptionSelectorUpdate$.next(this.productOptionSelector.options),this.next(this.productOptionSelector.options)})),this.closeControls.forEach(e=>e.addEventListener("click",e=>{this.toggle()})),this.productOptionSelector=this.querySelector("global-product-option-selector:not(.js-phone-case-type-modal-finish-selectors)"),await this.productOptionSelector.isMountedObserver$.once(),this.finishOptionSelector=this.querySelector(".js-phone-case-type-modal-finish-selectors"),this.finishOptionSelector&&(await this.finishOptionSelector.preInitObserver$.once(),this.finishOptionSelector.settings={...this.productOptionSelector.settings,...this.finishOptionSelector.settings,showOnly:!1,caseTypeUi:"finish",inlineOptionLabels:!0,collection:!1,selectedOptions:this.productOptionSelector.selectedOptionsArray},this.finishOptionSelector.hub=this.productOptionSelector.hub||!1,this.finishOptionSelector.init()),this.scrollArea=this.querySelector(".prod-case-type-selector-modal__body"),this.scrollArea){const update=()=>this.updateScrollState();this.scrollObservers=[new ResizeObserver(update),new MutationObserver(update)],this.scrollObservers[0].observe(this.scrollArea),Array.from(this.scrollArea.children).forEach(e=>this.scrollObservers[0].observe(e)),this.scrollObservers[1].observe(this.scrollArea,{childList:!0,subtree:!0}),this.updateScrollState()}this.modalReady$.next(this),this.productOptionSelector.subscribe(()=>{this.finishOptionSelector?.updateOptions(this.productOptionSelector.selectedOptionsArray,!0),this.updateContent()}),this.finishOptionSelector?.subscribe(()=>{this.productOptionSelector.updateOptions(this.finishOptionSelector.selectedOptionsArray,!0),this.updateContent()}),this.updateContent()}updateScrollState(){if(!this.scrollArea)return;const e=this.scrollArea.scrollHeight<=this.scrollArea.offsetHeight?"no_scroll":"scrolling";requestAnimationFrame(()=>{this.setAttribute("progress",e)})}updateContent(){let{selected:e,available:t}=this.productOptionSelector.getOptionByKey("Case Type");if(this.header=this.header||this.querySelector(".js-phone-case-type-modal__header"),this.content=this.content||this.querySelector(".js-phone-case-type-modal__content"),this.priceLabels=this.priceLabels||this.querySelectorAll(".js-phone-case-type-selector-modal-price"),this.priceLabels.length){const e=this.productOptionSelector.options.map(({selected:e})=>e),t=this.productOptionSelector.variants.find(({options:t})=>t.every((t,s)=>t==e[s]));
1this.priceLabels.forEach(e=>e.innerHTML=t?`- ${this.productOptionSelector.cart.ShopifyUtils.formatMoney(t.price)}`:"")}let s=this.caseTypeContent.filter(({option_title:t})=>t==e)[0];if(!s)return;const i=!!t&&!t[e];this.header.innerHTML=`\n <span>${s.title}</span>\n ${this.productOptionSelector.getCaseTypeBadgeHtml(s,i,"prod-case-type-selector-modal__header-badge")}\n `,this.content.innerHTML=s.paragraph||"",this.meters=this.meters||this.querySelector(".js-phone-case-type-modal__meters"),this.meters&&(this.meters.innerHTML=this.productOptionSelector.getCaseTypeMetersHtml(s)),this.updateIcons()}updateIcons(){if(this.icons=this.icons||this.querySelector(".js-phone-case-type-modal__icons"),!this.icons)return;if(!this.modalIsOpen)return void(this.iconsStale=!0);if(!this.icons.renderFor)return this.iconsWaitingForDefine||(this.iconsWaitingForDefine=!0,customElements.whenDefined("product-icons").then(()=>this.updateIcons())),void(this.iconsStale=!0);this.iconsStale=!1;const e=this.productOptionSelector.options.map(({selected:e})=>e),t=this.productOptionSelector.variants.find(({options:t})=>t.every((t,s)=>t==e[s])),s=this.productOptionSelector.settings;this.icons.renderFor({type:s.product_type,tags:s.product_tags||[],options:e,sku:t?.sku||""}).then(e=>{this.icons.style.display=e?.length?"":"none"}).catch(e=>{console.log(e)})}}customElements.define("phone-case-type-selector-modal",PhoneCaseTypeSelectorModal);class ProductDesignSelector extends HTMLElement{constructor(){super()}connectedCallback(){DomReadyPromise().then(async()=>{let e=this.querySelector(":scope > template");if(e){try{this.settings=JSON.parse(e.innerHTML),e.remove(),e=null}catch(t){this.settings=!1,e=null}if(!this.settings)return void this.remove()}this.api=await new StorefrontApi;const t=new ObserverLite({key:"DataLayer.Product$"});this.product=await t.once(),this.update()}).catch(e=>{console.log(e)})}async getParams(e=[]){const t=this.product?.filter_metafields;if(!this.product||!this.product.allModelCollection||!t)return{error:!0};const s=t.collection||!1;let i=!!s&&s[0],n="collection";if(!i||["Spring / Summer","For Him"].includes(i)){const e=t.design||!1;i=!!e&&e[0],n=!!i&&"design"}if(!i){const e=t.color||!1;i=!!e&&e[0],n=!!i&&"color"}if(!i)return{error:!0};const o=i,r=this.product.data.tags.find(e=>e.includes("model:")&&!e.includes("recomatic-model:"))||!1,a=this.product.data.type,l=this.product.data.title,c=`/collections/${this.product.allModelCollection.handle}`,d=this.settings.custom;let u=this.product.data?.tags?.find(e=>e.startsWith("design_uid:"))?.split(":")[1]||!1;if(!u)return{error:!0};if("macbook"==a){const t=this.product.data.tags.some(e=>"premium-macbook"==e)||!1;e.push(t?"premium-macbook":"standard-macbook")}return{queryTag:o,key:n,productModelTag:r,productType:a,productTitle:l,productUid:u,collectionHandle:c,custom:d,extraTags:e}}async getProducts(e=!1,t=!1,s=250,i=[]){let{queryTag:n,key:o,productModelTag:r,productType:a,productTitle:l,productUid:c,custom:d,collectionHandle:u,extraTags:p,error:h}=await this.getParams(i);if(!t&&!n||!u)return!1;let g=[r?`{ tag: ${JSON.stringify(r)} }`:`{ productType: ${JSON.stringify(a)} }`,...p.map(e=>`{ tag: ${JSON.stringify(e)} }`)];t||g.push(`\n {\n productMetafield:{\n namespace:"my_fields", \n key:"${o}",\n value:"${n}"\n }\n } \n\n `),e&&(g=[...g,...e.map(e=>`\n {\n productMetafield:{ \n namespace:"custom", \n key:"product_gender_context", \n value:"${e}"\n }\n } \n `)]);let m=`\n {\n search(\n query: ""\n first: ${s}\n types: PRODUCT\n prefix: NONE \n ${g.length?`\n productFilters:[\n ${g.join(",")}\n ]\n `:""}\n \n ) \n {\n edges {\n node {\n ... on Product {\n title\n handle\n onlineStoreUrl\n tags\n }\n }\n }\n }\n }\n `;const{data:y,errors:b}=await this.api.authFetch({body:m});let f=!b&&y?.search?.edges?.map(({node:e})=>e);if(f?.length){const e=new Set;return f=f.sort((e,t)=>
1e.title===l?-1:t.title===l?1:0).map(t=>{const s=t.tags.find(e=>e.includes("model:"));if(r&&s&&r!=s)return!1;const i=t.tags.find(e=>e.includes("design:"))?.split(":")[1]||!1;let n=t.tags.find(e=>e.startsWith("design_uid:"))?.split(":")[1]||!1;if(!n||!i)return!1;const o=i.split("-")[0].trim();return!e.has(o)&&(e.add(o),t.design=o,t.image=`https://cdn.burga.photos/_variants/128/SHOPIFY/DESIGN_THUMBS/THUMBNAIL_${n}.webp`,t.imageOriginal=`https://cdn.burga.photos/SHOPIFY/DESIGN_THUMBS/THUMBNAIL_${n}.jpg`,t.onlineStoreUrl=t.onlineStoreUrl||`/products/${t.handle}`,d&&(t.onlineStoreUrl=`${t.onlineStoreUrl}?customizer=true`),t)}).filter(e=>e),f}return!1}async update(){const e=new ObserverLite({key:"DataLayer.GlobalUXContext"}),t=await e.once();let s=[];if(t?.settings?.prod_types_with_male_context?.includes(this.product.data.type)){const e=t.currentContextSettings?["male","unisex"]:["female","unisex"];s.push((async()=>({context_products:await this.getProducts(e)}))());let i="male"==t.settings.context?this.settings?.theme_settings?.matching_design_block_extra_items__male:this.settings?.theme_settings?.matching_design_block_extra_items__female;i=i.split(",")?.map(e=>e.trim())||[],this.product.data.tags.some(e=>i.includes(e))||!1||s.push((async()=>({context_products_broad_q:await this.getProducts(e,!0,6,["non-zodiac"])}))())}else s.push((async()=>({products:await this.getProducts()}))());const i=await Promise.all(s);let{context_products:n=[],context_products_broad_q:o=[],products:r=[]}=Object.assign({},...i);n&&n.length>=6&&(o=[]);const a=[...n||[],...o||[],...r||[]],l=new Set;this.products=a.filter(e=>!l.has(e.title)&&(l.add(e.title),!0)),this.products&&this.products.length?this.render():this.remove()}async render(){this.classList.add("row");const{collectionHandle:e,productTitle:t}=await this.getParams();this.innerHTML=`\n \n <label class="f-w500 block-12/12 h-xxs flex row-wrap justify-space align-center flex-grid--xs">\n <span>${this.settings.translations.more_designs}</span>\n <a class="btn-inline-info btn-inline-info--no-icon" href="${e}"><u>${this.settings.translations.view_all}</u></a> \n </label>\n \n <div class="embla block-12/12">\n <div class="embla__container flex-item-grid flex-item-grid--s flex-item-grid--4 flex-item-grid--peek-50">\n ${this.products.map(({title:e,design:s,image:i,imageOriginal:n,onlineStoreUrl:o})=>`\n <a class="prod-design-thumb embla__slide embla__slide--auto flex-grid-y--s flex column-nowrap flex-item-grid__child"\n data-active="${t==e}"\n href="${o}">\n <img class="block-12/12 d-block rounded-md block-oh" width="128" height="128" src="${i}" data-fallback-src="${n}" alt="${s}" loading="lazy">\n <span class="d-block tac lh-r t-s">${s}</span>\n </a> \n `).join("")}\n </div>\n </div>\n <div class="embla__scrollbar"></div>\n `,this.setAttribute("rendered",!0),this.carousel=new EmblaCarousel(this.querySelector(".embla"),{loop:!1,skipSnaps:!0}),EmblaCarouselScrollbar({target:this.querySelector(".embla__scrollbar")},this.carousel)}}customElements.define("product-design-selector",ProductDesignSelector);class simpleFaqAccordion extends HTMLElement{constructor(){super()}connectedCallback(){DomReadyPromise().then(async()=>{let e=this.querySelector(':scope > script[type="application/json"]');e&&(this.settings=JSON.parse(e.textContent),e.remove(),e=null),!this.rendered&&this.settings.content&&this.render()}).catch(e=>{console.log(e)})}toggle(e){e.dataset.open?(e.classList.remove("prod-accord__title--active"),e.nextElementSibling.style.display="none",e.removeAttribute("data-open"),e.setAttribute("aria-expanded","false")):(e.dataset.open=!0,e.classList.add("prod-accord__title--active"),e.nextElementSibling.style.display="block",e.setAttribute("aria-expanded","true"))}bind(){this.querySelectorAll(".prod-accord__title").forEach(e=>e.addEventListener("click",()=>{this.toggle(e)}))}render(){this.rendered=!0,this.innerHTML=this.settings.content.map(({q:e,a:t})=>`<div class="bdr-b bdr-grey cb--s row--s">\n <button type="button" aria-expanded="false" class="prod-accord__title f-w500 btn-reset tal block-12/12">${e}</button>\n <div style="display:none" class="prod-accord__content ct--s">${t}</div>\n </div>`).join(""),this.bind()}}customElements.define("simple-faq-accordion",simpleFaqAccordion);class ProductSiblingTypeSelectors extends GlobalCustomComponent{constructor(){super()}connectedCallback(){DomReadyPromise().then(async()=>{this.globalObserver=new ObserverLite({key:"DataLayer.ProductSiblingTypeSelectors$"});let e=this.querySelector(':scope > script[type="application/json"]');if(e&&(this.settings=JSON.parse(e.textContent)),!this.settings||!e)return;this.settings.query_string_object&&(this.settings.query_string=this.buildEscapedGQLQuery(this.settings.query_string_object));const t=new ObserverLite({key:"DataLayer.OptionNameTranslations$"});this.OptionNameTranslations=await t.once(),this.product$=new ObserverLite({key:"DataLayer.Product$"}),this.product=this.settings.product||await this.product$.once(),this.product=this.product?.data?this.product.data:this.product;const s=await new StorefrontApi,i=this.product.title.includes(" â ")?" â ":" - ",n=this.product.title.split(i);this.product.titleDesign=n.length>1&&n[0].trim();let o=`\n query @inContext(country: ${s.localization.country.iso_code}
1) {\n products(first:250, query:"${this.settings.query_string}") {\n edges {\n node {\n tags\n productType\n title\n handle\n featuredImage{\n url\n }\n variants(first:100){\n edges {\n node {\n id\n price{\n amount\n }\n compareAtPrice{\n amount\n }\n selectedOptions{\n name\n value\n }\n image{\n url\n }\n }\n }\n }\n \n }\n }\n }\n }\n `;s.authFetch({body:o}).then(async({data:e,errors:t})=>{if(t)return console.log(t),void this.remove();let s=e?.products||!1;s=!!s&&s.edges.map(({node:e})=>{if(this.product.titleDesign&&!this.settings.same_type_search){const t=e.title.includes(" â ")?" â ":" - ",s=e.title.split(t);if(e.titleDesign=s.length>1&&s[0].trim(),e.titleDesign&&e.titleDesign!=this.product.titleDesign)return!1}e.active=this.product.handle==e.handle,e.variants=e.variants?e.variants.edges.map(({node:e})=>e):[];const t=(()=>{const e=this.settings?.filters?.find(({key:e,value:t})=>"tags"===e&&(Array.isArray(t)&&t.some(e=>e.startsWith("design:"))||"string"==typeof t&&t.startsWith("design:")));if(!e)return!1;if(Array.isArray(e.value)){const t=e.value.find(e=>e.startsWith("design:"));return t?.split(":")[1]||!1}return"string"==typeof e.value&&e.value.startsWith("design:")&&e.value.split(":")[1]||!1})();return e.label="macbook"==e.productType?(()=>e.tags.includes("premium-macbook")?this.OptionNameTranslations.settings.macbookTypePremiumLabel:this.OptionNameTranslations.settings.macbookTypeStandardLabel)():t?e.title.replace(t,""):e.title,e}).filter(e=>e&&this.applyFilters(e)).sort((e,t)=>t.active-e.active),this.products=s,this.render(),this.product$.subscribe(()=>{this.render()})})}).catch(e=>{console.log(e)})}buildEscapedGQLQuery(e){return function walk(e){if(Array.isArray(e))return e.map(walk).join(" ");if("object"==typeof e){const t=[];for(const[s,i]of Object.entries(e))if("AND"===s||"OR"===s){const e=i.map(walk).join(` ${s} `);t.push(`(${e})`)}else t.push(`${s}:"${i}"`);return t.join(" AND ")}return""}(e).replace(/"/g,'\\"')}applyFilters(e){return!this.settings.filters?.length||this.settings.filters.every(({key:t,value:s})=>!!e[t]&&(Array.isArray(e[t])&&e[t].includes(s)||e[t]==s))}get current_variant(){return this.product$?.onceDone?.data?.selected_variant||!1}render(){this.products?.length<=1?this.remove():this.settings.selector_ui?this.renderSelectorUi():this.renderThumbUi()}renderSelectorUi(){const e=this.settings.productType,t=this.products.find(({active:e})=>e)||!1,s=getFrontEndOptionNameTranslation((e?`${e}:`:"")+"Type",this.OptionNameTranslations.blocks),i=s&&"screen_protecter_type"!=s&&genSbSelectLabel?genSbSelectLabel.replace("[[option]]",s):genSbSelectLabelFallback,n=`\n <global-sidebar-option-selector>\n <template>\n ${JSON.stringify({sidebar_label:i||!1,option:{selected:t?.title||this.products[0].title,key:`sibling_selector_${e}`,values:this.products.map(e=>({value:e.title,label:e.label,data:{handle:e.handle}}))}})}\n </template>\n </global-sidebar-option-selector>\n `;this.innerHTML=n;const o=this.querySelector("global-sidebar-option-selector");o.subscribe(()=>{const e=o.option.values.find(({value:e})=>e==o.option.selected)||o.option.values[0];this.globalObserver.next({handle:e?.data?.handle,value:e?.value})})}async renderThumbUi(){const e=this.settings.productType;let t={name:getFrontEndOptionNameTranslation((e?`${e}:`:"")+"Type",this.OptionNameTranslations.blocks),carousel:this.settings.carousel||!1,carouselScrollBar:this.settings.carouselScrollBar||!1,values:this.products.map(e=>{const t=e.variants.map(e=>(e.matchCount=e.selectedOptions.map(({name:e})=>e).reduce((t,s,i)=>{const n=this.current_variant.optionNames.findIndex(e=>e===s);return t+(this.current_variant.options[n]===e.selectedOptions[i].value?1:0)},0),e)).sort((e,t)=>
1t.matchCount-e.matchCount)[0]||e.variants[0],s=t?.image?.url||e.featuredImage.url,i=100*parseFloat(t?.price?.amount||0),n=100*parseFloat(t?.compareAtPrice?.amount||0),o=this.settings?.ui_tags?.filter(({product_tag:t})=>e.tags.some(e=>e==t))?.map(({ui_tag:e})=>e)||[];return{value:`${e.handle}`,data:{matched_variant:t},tags:o,label:e.label,image:s,price:i,compareAtPrice:n}})};const s=`\n <global-option-selector \n class="d-block row" \n option='${JSON.stringify(t)}' \n selected="${this.product.handle}">\n <script type="application/json">\n ${JSON.stringify(this.settings)}\n <\/script>\n </global-option-selector>\n `;this.innerHTML=s;const i=this.querySelector("global-option-selector");i?.subscribe(()=>{const e=i.option.selected,t=i.option.values.find(({value:t})=>t==e)?.data?.matched_variant||!1;t?.id&&(t.id=t.id.split("/").reverse()[0]),this.globalObserver.next({handle:`/products/${e}`,matched_variant:t})})}}customElements.define("product-sibling-type-selectors",ProductSiblingTypeSelectors);class ProductKindleSelectors extends HTMLElement{constructor(){super(),this.ObserverLite=new ObserverLite}subscribe(e){return this.ObserverLite.subscribe(e)}next(e){this.ObserverLite.next(e)}connectedCallback(){DomReadyPromise().then(async()=>{const e=new ObserverLite({key:"DataLayer.GlobalUXContext"});this.GlobalUXContext=await e.once(),this.init()}).catch(e=>{console.log(e)})}
1async init(){this.ModelSelector=this.querySelector("global-kindle-model-selector"),this.ModelSelector.subscribe(()=>{window.location.href=this.GlobalUXContext.addParamToUrl(this.ModelSelector.settings.selected)})}}customElements.define("product-kindle-selectors",ProductKindleSelectors);class GlobalKindleModelSelector extends GlobalCustomComponent{constructor(){super(),this.onReadyObserver=new ObserverLite}connectedCallback(){DomReadyPromise().then(async()=>{let e=this.querySelector(':scope > script[type="application/json"]');if(e&&(this.settings=JSON.parse(e.textContent)),"collection"==this.settings.context){const e=await new CollectionHub("collection_main");this.settings.design_tag=e.collectionData?.data?.first_product?.tags?.find(e=>e.includes("design:"))||!1,this.settings.selected=e.settings.model||!1}else{const e=new ObserverLite({key:"DataLayer.Product$"}),t=await e.once();this.settings.design_tag=t?.data?.tags?.find(e=>e.includes("design:"))||!1,this.settings.selected=t.data.handle}const{products:t,error:s}=await this.getProducts();!s&&t?.length?(this.products=t,this.renderSelector()):this.remove()}).catch(e=>{console.log(e)})}async getProducts(){return new Promise(async(e,t)=>{const s=await new StorefrontApi;let i=`(product_type:\\"Kindle Case\\" tag:\\"${this.settings.design_tag}\\")`,n=`\n query @inContext(country: ${s.localization.country.iso_code}) {\n products(first:50, query:"${i}") {\n edges {\n node {\n handle\n tags \n }\n }\n }\n }`;s.authFetch({body:n}).then(async t=>{const{error:s,data:i}=t;let n=i?.products||!1;if(!n?.edges?.length||s)return;const gen=e=>parseInt(e.match(/(\d+)(?:st|nd|rd|th)\s*Gen/i)?.[1]||0);n=n.edges.map(({node:e})=>(e.model=e.tags.find(e=>e.includes("model:"))?.split(":")?.[1]||!1,e)).filter(e=>e&&e.model&&e.tags.includes(this.settings.design_tag)).sort((e,t)=>gen(t.model)-gen(e.model)||e.handle.localeCompare(t.handle)).filter((e,t,s)=>s.findIndex(({model:t})=>t==e.model)==t),e({products:n})}).catch(t=>{e({error:t})})})}renderSelector(){const e=[{set:{options:this.products.map(e=>({name:e.model,label:e.model,value:"collection"==this.settings.context?e.model:e.handle}))}}];this.settings.selected=this.settings.selected||e[0].set.options[0].value,this.innerHTML=`\n\n <global-dropdown-ui class="global-dropdown-ui--collection-filter">\n <script type="application/json">\n ${JSON.stringify({hide_checkbox:"product"==this.settings.context,init_selected:this.settings.selected,selected:[this.settings.selected],empty:!1,key:"kindle_case_type",dropdown_heading:this.settings.translations.select_model,options:e})}\n \n <\/script>\n </global-dropdown-ui>\n `;const t=this.querySelector("global-dropdown-ui");t.subscribe(({type:e})=>{if("update_selected"!=e)return;const s=t.settings.selected[0];s&&s!=this.settings.selected&&(this.settings.selected=s,this.next())}),this.onReadyObserver.next()}}customElements.define("global-kindle-model-selector",GlobalKindleModelSelector);class ProductFormWrapperV2 extends GlobalCustomComponent{constructor(){super()}connectedCallback(){DomReadyPromise().then(async()=>{let e=this.querySelector(':scope > script[type="application/json"]');if(e){let t=JSON.parse(e.textContent);t&&(this.settings=t,e.remove(),e=null,this.init())}}).catch(e=>{console.log(e),this.remove()})}init(){if(this.settings.bundles_size)return this.toggles=[...this.querySelectorAll("[data-toggles]")],this.content=[...this.querySelectorAll("[data-content]")],this.toggles.forEach(e=>e.addEventListener("click",t=>{t.preventDefault();const s=e.dataset?.toggles?.split(",")||[];this.content.forEach(e=>{s.includes(e.dataset.content)?e.removeAttribute("hidden"):e.setAttribute("hidden","")}),this.toggles.forEach(t=>{t.dataset.active=t==e?"true":"false"})})),void this.trackMaxBundleSaving();const e=this.querySelector('[data-content="product_single_bundle"]');e&&this.settings.bundles_size&&e.removeAttribute("hidden")}trackMaxBundleSaving(){const e=this.querySelector(".js-pfw__bundle-saving"),{bundle_keys:t,bundle_saving_text:s}=this.settings;if(!e||!s||!Array.isArray(t))return;const i=["productFormSubmit","productVariantUpdate","productSlotsUpdate","productArrayUpdated","slotConfigChange"],n=new Map,update=t=>{const i=t.destroy$?.onceDone?.remove;n.set(t,i?0:t.totals.percent||t.settings.saving||0),(()=>{const t=Math.max(0,...n.values());t&&(e.textContent=s.replace("[[amount]]",t))})()};
1t.forEach(e=>{new ObserverLite({key:`DataLayer.BundlesDataProducer.${e}$`}).once().then(e=>{e?.totals&&(e.subscribe(({type:t,data:s}={})=>{("productArrayUpdated"!=t||s?.updated_product?.selected)&&i.includes(t)&&update(e)}),e.destroy$?.subscribe(()=>update(e)),update(e))})})}}customElements.define("product-form-wrapper-v2",ProductFormWrapperV2);class PdpSelectorUi extends HTMLElement{connectedCallback(){DomReadyPromise().then(async()=>{this.init()}).catch(e=>{console.log(e)})}async init(){const e=new ObserverLite({key:"DataLayer.GlobalUXContext"}),t=await e.once(),s=new ObserverLite({key:"DataLayer.Product$"}),i=await s.once(),n=i.data.tags||[],o=!n.includes("eyewear"),r=n.includes("WaterBottle2"),a=n.includes("Luggage Cover"),l=!!new URLSearchParams(window.location.search).get("customizer"),c=document.querySelectorAll(".js-prod-price-v2"),d=document.querySelector(".js-prod-atc"),u=document.querySelector(".js-prod-pre-order-wrapper"),p=document.querySelector(".js-prod-title-variant"),h=document.querySelector(".js-prod-accord-customize-link"),g=document.querySelectorAll(".js-pre-order"),m=document.querySelectorAll(".js-pre-order-date"),y=document.querySelectorAll(".js-prod-stock"),b=document.querySelector(".js-prod-oos-form"),f=document.querySelector(".js-pre-order-table");let _=(i?.data?.selected_variant||i.data.variants[0]).options;window.wbskGlobal.caseTypeSelector&&(_=window.wbskGlobal.caseTypeSelector.settings.selected_variant?window.wbskGlobal.caseTypeSelector.settings.selected_variant.options:_),i.singleModelProduct&&window.wbskGlobal.newProductConfigCaseTypeOveride&&(_=[window.wbskGlobal.newProductConfigCaseTypeOveride]);const v=window.wbskGlobal.productForm=document.querySelector(".js-wbsk-product-form");let w=!0;v.init({key:"product_main",data:i.data,selectedOptions:JSON.parse(JSON.stringify(_)),showXsell:o,onUpdate:async e=>{i.data.selected_variant=e;new ObserverLite({key:"onMainProductFormUpdate$"}).next(e),f.update(e.sku);const t=isPreorderQuantity(e.inventory_quantity);y.forEach(s=>{s.style.display=t||e.pre_order?"none":"block"}),e.pre_order?(g.forEach(e=>{e.style.display="block"}),m.forEach(t=>{t.innerText=e.pre_order})):g.forEach(e=>{e.style.display="none"});const o=GetQueryParams(window.location);i.data.options.map((e,t)=>({key:e,selected:i.data.selected_variant.options[t]})).forEach(({key:e,selected:t})=>{o[handleize(e)]=t}),o.variant=e.id;const r=`${window.location.protocol}//${window.location.host}${window.location.pathname}?${ToQueryParams(o)}`;if(window.history.replaceState({path:r},"",r),h){const e=JSON.parse(JSON.stringify(o));e.customizer=!0,e.showCustomizer=!0,h.setAttribute("href",`${window.location.protocol}//${window.location.host}${window.location.pathname}?${ToQueryParams(e)}`)}p&&p.text(e.options[0]),!w&&i.data.options.includes("Case Type")&&setCaseTypeFilterCookie(Object.fromEntries(i.data.options.map((t,s)=>[optionFilterKey(t),e.options[s]]))),w=!1,await new GlobalCart,c.forEach(async t=>{await t.onInitObserver.once(),t.updatePriceSettings(e.price,e.compare_at_price);const s=t.closest("fit-text");s&&s.fit()}),e.available?d.removeAttribute("disabled"):d.setAttribute("disabled",!0);const a=!t&&!(e.inventory_quantity<1&&"deny"==e.inventory_policy),_=!a&&!t;d.style.display=a?"flex":"none",u.style.display=t?"flex":"none",b.update({id:e.id,sku:e.sku,show:_}),y.forEach(t=>{t.update(e,n)});const v=document.querySelector(".js-prod-personalise-link");v&&!l&&(v.style.display=e.title.includes("Halo")||e.title.includes("Mirror")||e.title.includes("Puffy")?"none":"block"),s.onceDone.data.selected_variant=e,s.next({variant:e})}});[...document.querySelectorAll(".js-product-model-selector"),...document.querySelectorAll(".js-option-as-product-selector")].forEach(e=>e.subscribe(()=>{const s=e.value,n=!!i.siblings[s]&&i.siblings[s],o=!!n&&`/products/${n.handle}`,r=e.selected_element.dataset.disable_personalisation;o&&(window.location.href=t.addParamToUrl(`${o}${l&&"true"!=r?"?customizer=true":""}`))}));const S=document.querySelector(".js-prod-main-phone-case-type-option-selectors");S&&(S.subscribe(()=>
1{v.updateAllOptions(S.selectedOptionsArray),v.update()}),await S.isMountedObserver$.once(),v.updateAllOptions(S.selectedOptionsArray),v.update());const k=Array.from(document.querySelectorAll(".js-prod-option-selectors"));k.length&&k.forEach(e=>e.subscribe(()=>{const t=e.options.map(({virtual:e,selected:t})=>({selected:t,virtual:e})),s=v.settings.selectedOptions.map((e,s)=>t[s].virtual?e:t[s].selected);v.updateAllOptions(s),v.update()})),document.querySelectorAll(".js-prod-color-tab-variant").forEach(e=>{e.subscribe(()=>{v.updateSelectedOptions(e.option.data.optionIndex,e.option.selected,!0),v.update()})}),(r||a)&&(document.querySelectorAll(".js-prod-color-radio").forEach(e=>{e.addEventListener("change",()=>{window.location.href=t.addParamToUrl(e.dataset.productUrl)})}),document.querySelectorAll("product-color-sibling-selector").forEach(e=>{e.subscribe(e=>{window.location.href=t.addParamToUrl(e.dataset.productUrl)})}),document.querySelectorAll(".js-prod-size-radio").forEach(e=>{e.addEventListener("change",()=>{const t=e.value,s=e.dataset.sizeOptionIndex;document.querySelector(".js-prod-size-radio-value").innerText=t,v.updateSelectedOptions(s,t,!0),v.update();const i=new CustomEvent("jsProdSizeRadioUpdate",{bubbles:!0});i.value=t,e.dispatchEvent(i)})}));new ObserverLite({key:"DataLayer.ProductSiblingTypeSelectors$"}).subscribe(({handle:e,matched_variant:s})=>{const i=`${e}${s?`?variant=${s.id}`:""}`;window.location.href=t.addParamToUrl(i)})}}customElements.define("pdp-selector-ui",PdpSelectorUi);class ProductPowerbankModalSelector extends HTMLElement{constructor(){super()}connectedCallback(){DomReadyPromise().then(async()=>{let e=this.querySelector(':scope > script[type="application/json"]');e&&(this.settings=JSON.parse(e.innerHTML),e.remove(),e=null),this.content=this.querySelector(":scope > template")?.innerHTML||!1,this.content?(this.powerBankContent=await new ObserverLite({key:"DataLayer.powerBankContent"}).once(),this.capacityTranalation=this.powerBankContent?.capacityTranalation||"Capacity",this.mainPdpSelector=document.querySelector(".js-prod-option-selectors"),await this.mainPdpSelector.isMountedObserver$.once(),this.render(),this.mainPdpSelector.subscribe(()=>{this.render()})):this.remove()}).catch(e=>{console.log(e)})}render(){const e=this.mainPdpSelector.querySelector(`.gos-item[data-key="${this.capacityTranalation}"] label`);if(!e||e?.querySelector(".js-phone-capacity-selector-modal-open"))return;const t=`\n <button type="button" class="js-phone-capacity-selector-modal-open btn-reset btn-inline-info">${this.settings.translations.learn_more}</button>\n `;e.insertAdjacentHTML("beforeend",t),this.button=e.querySelector(".js-phone-capacity-selector-modal-open"),this.button.addEventListener("click",e=>{e.preventDefault(),this.show()})}show(){this.modal||(this.modal=new ModalBox({content:this.content,settings:{containerCloseButton:!1}}),this.modal.subscribe(({eventType:e})=>{this.initRender||"open:rendered"!=e||(this.initRender=!0,this.bind())})),this.modal.toggle()}async bind(){this.variantContent=this.modal.wrapper.querySelector("product-variant-rich-content"),await this.variantContent.preInitObserver$.once(),this.variantContent.settings.highlightOption=this.capacityTranalation,this.variantContent.init(),this.selector=this.modal.wrapper.querySelector("global-product-option-selector"),await this.selector.preInitObserver$.once(),this.selector.settings.virtualOptions=this.selector.settings.optionUiTypes.filter(e=>!["Capacity",this.capacityTranalation].includes(e)),this.selector.init(),this.mainPdpSelector.subscribe(()=>{this.selector.updateOptions(this.mainPdpSelector.selectedOptionsArray,!0)}),this.selector.subscribe(()=>{this.mainPdpSelector.updateOptions(this.selector.selectedOptionsArray)})}}customElements.define("product-powerbank-modal-selector",ProductPowerbankModalSelector);class ProductVariantRichContent extends HTMLElement{constructor(){super(),this.preInitObserver$=new ObserverLite}connectedCallback(){DomReadyPromise().then(async()=>{let e=this.querySelector(':scope > script[type="application/json"]');e&&(this.settings=JSON.parse(e.innerHTML),e.remove(),e=null),this.preInitObserver$.next(),this.settings.manualInit||this.init()}).catch(e=>{console.log(e)})}getContent(){return(this.settings.highlightOption?this.variant.optionNames.filter(e=>e==this.settings.highlightOption):this.variant.optionNames).map((e,t)=>{this.settings.highlightOption&&(t=this.variant.optionNames.findIndex(e=>e==this.settings.highlightOption));const s=this.variant.options[t];return this.settings.metafield_data.filter(({option_name:t,option_variant_name:i})=>t==e&&i==s).map(({bullet_points:e})=>e)}
1).flat(1/0)}async init(){const e=new ObserverLite({key:"DataLayer.Product$"});e.subscribe(({variant:e})=>{this.variant=e,this.render()});const t=await e.once();this.variant=t.data.selected_variant,this.render()}render(){const e=this.getContent();if(!e)return void(this.innerHTML="");let t=!1;if(this.settings.highlightOption){const e=this.variant.optionNames.findIndex(e=>e==this.settings.highlightOption);t=this.variant.options[e]}this.innerHTML=`\n <div class="flex column-nowrap rte-content">\n ${t?`<h3 class="h-style h-m f-w500 row">${t}</h3>`:""}\n <ul class="flex column-nowrap">\n ${e.map(e=>`\n <li>${e}</li>\n `).join("")}\n </ul>\n </div>\n `}}customElements.define("product-variant-rich-content",ProductVariantRichContent);class ProductCustomizerWrapper extends GlobalCustomComponent{constructor(){super()}connectedCallback(){DomReadyPromise().then(async()=>{let e=this.querySelector(':scope > script[type="application/json"]');if(e){let t=JSON.parse(e.textContent);t&&(this.settings=t,e.remove(),e=null,this.init())}}).catch(e=>{console.log(e),this.remove()})}async showCustomizer(){this.modalBuild||(this.modalBuild=this.buildModal()),await this.modalBuild,this.modal.open()}async buildModal(){const e=new DynamicImporter(this.settings.assets);await e.load();const t=this.querySelector(":scope > template");this.modal=new ModalBox({content:t.innerHTML,settings:{containerCloseButton:!1,outerWrapperClass:"modal-flex--@mobile__no-padding"}}),this.modal.subscribe(async({eventType:e})=>{"open:rendered"==e&&(this.initRender||(this.initRender=!0,this.productCustomizer=await this.bind()))})}disabledVariant(e){return e?.title.includes("Halo")||e?.title.includes("Mirror")||e?.title.includes("Puffy")}updateButtonState(e){this.toggleButtons.forEach(t=>{this.disabledVariant(e)?t.setAttribute("hidden",""):t.removeAttribute("hidden")})}
1async init(){const e=this.toggleButtons=document.querySelectorAll(".js-cstmzr__toggle");if(!e?.length)return void this.remove();const t=this.product$=new ObserverLite({key:"DataLayer.Product$"}),s=(this.product=await t.once()).data.selected_variant;this.updateButtonState(s);new URLSearchParams(window.location.search).get("show_customizer")&&!this.disabledVariant(s)&&this.showCustomizer(),this.product$.subscribe(({variant:e})=>{e&&this.updateButtonState(e)}),e.forEach(e=>{e.addEventListener("click",e=>{e.preventDefault(),this.showCustomizer()})})}async bind(){const e=window.productCustomizer=new ProductCustomizer;e.data.custom_text_color=this.settings.custom_text_color||"#000000",this.settings.custom_text_top&&(wbsk_customizer.data.topPosition=parseFloat(this.settings.custom_text_top)),await deviceColorImages.ready();const baseImageFor=e=>e?.sku&&deviceColorImages.getMainImage(e.sku)?.url||e?.featured_image?.src;let t=baseImageFor(this.product.data.selected_variant);const applyBaseImage=s=>{s&&s!==t&&(t=s,e.is_init?e.selector_update_image(s):e.init_image=s)};e.init_image=t,e.init(),this.product$.subscribe(({variant:e})=>{e&&applyBaseImage(baseImageFor(e))}),deviceColorImages.subscribe(()=>{applyBaseImage(baseImageFor(this.product.data.selected_variant))}),this.atcButton=this.modal.wrapper.querySelector(".js-cstmzr__atc"),e.subscribe(t=>{e.data.current_text.length>0?this.atcButton.removeAttribute("disabled"):this.atcButton.setAttribute("disabled","")}),this.form=this.modal.wrapper.querySelector("form"),this.form.addEventListener("submit",async t=>{t.preventDefault(),this.GlobalCart=this.GlobalCart||await new GlobalCart;const s={id:this.product.data.selected_variant.id,properties:{Text:e.data.current_text,Style:`${e.data.current_font_family} / ${e.data.current_font_size} / ${e.data.custom_text_color}`,...deviceColorImages.selectedRealColor?{"Device Color":deviceColorImages.selectedRealColor}:{}}};this.GlobalCart.addToCart(s).then(async()=>{this.modal.close();const e=new ObserverLite({key:"GlobalSidebar.Cart"});(await e.once()).open()}).catch(e=>{console.log(e)})})}}customElements.define("product-customizer-wrapper",ProductCustomizerWrapper);class DynamicMetaAccordionBlocks extends HTMLElement{constructor(){super()}connectedCallback(){DomReadyPromise().then(async()=>{let e=this.querySelector(':scope > script[type="application/json"]');e&&(this.settings=JSON.parse(e.textContent)),this.product$=new ObserverLite({key:"DataLayer.Product$"});const[t,s]=await Promise.all([getAccordionBlocks(),this.product$.once()]);this.blocks=t,this.product=s,this.render()}).catch(e=>{console.log(e),new ObserverLite({key:"DynamicMetaAccordionBlocks$"}).next(this)})}render(){let e=getBlocksForProduct(this.blocks,this.product.data.tags);document.querySelector("product-faq-section")&&(e=e.filter(e=>!isFaqBlock(e)));let t=e.find(e=>"true"==e.show_link);if(t){e=e.filter(e=>"true"!=e.show_link);const s=this.querySelector('product-accordion-item[data-type="description"]');s&&s.insertAdjacentHTML("afterend",this.getBlockHtml(t))}this.insertAdjacentHTML("beforeend",e.map(e=>this.getBlockHtml(e)).join(""));const s=this.querySelector(".js-prod-personalise-link")||!1;if(s){document.querySelector("product-customizer-wrapper")?s.parentNode.appendChild(s):s.remove()}t&&this.bindModelLink(t);(this.dataset.open||"").split(",").map(e=>handleize(e)).filter(Boolean).forEach(e=>{this.querySelectorAll(`product-accordion-item[data-type="${e}"]`).forEach(e=>e.setAttribute("open",""))}),document.querySelectorAll(".js-prod-reviews-link")?.forEach(e=>e.addEventListener("click",e=>{e.preventDefault();const t=document.querySelector(".js-prod-reviews__title");if(t){if(t.classList.contains("prod-accord__title--active")){const e=t.getBoundingClientRect().top+window.pageYOffset-document.querySelector(".js-wbsk-sticky-product-form").offsetHeight;return void window.scrollTo({top:e,behavior:"smooth"})}t.dispatchEvent(new MouseEvent("click",{bubbles:!0,cancelable:!0,view:window}))}},!0)),this.style.display="block",new ObserverLite({key:"DynamicMetaAccordionBlocks$"}).next(this)}bindModelLink(e){const t=document.querySelector(".js-pdp-model-selector-group"),s=document.createElement("div");s.className=t?"ct--s":"cb--s tar",s.innerHTML=`\n <button \n type="button" \n data-accordion-id="${e.uid}" \n class="btn-reset btn-inline-info${t?" btn-inline-info--grey":""}"\n >${e.show_link_text}\n </button>\n `;const i=document.querySelector(".js-wbsk-product-form-selectors"),n=document.querySelector("product-design-selector");t?t.appendChild(s):n?n.parentNode.insertBefore(s,n.nextSibling):i.parentNode.insertBefore(s,i);const o=document.querySelector(`button[data-accordion-id="${e.uid}"]`);o&&o.addEventListener("click",t=>{t.preventDefault();const s=document.querySelector(`product-accordion-item[uid="${e.uid}"] .prod-accord__title`);
1if(s){const e=s.getBoundingClientRect().top,t=document.querySelector(".js-wbsk-sticky-product-form").offsetHeight,i=window.pageYOffset+e-t-60;window.scrollTo({top:i,behavior:"smooth"}),s.classList.contains("prod-accord__title--active")||s.click()}})}getBlockHtml(e){return`\n <product-accordion-item class="bdr-b bdr-grey" uid="${e.uid}" data-type="${handleize(e.title||"")}">\n <div \n class="prod-accord__title ct cb cell-r"\n style="background-image:url(${e.icon});"\n >\n <span class="f-w500 t-s t-ucase">${e.title}</span>\n </div>\n <template>\n <div \n style="display:none;" \n class="\n js-prod-accord__content prod-accord__content \n ${e.faq_metaobject?.length?"prod-accord__content--faq-mini-accordion":""} \n rte-content rte-content--s cb cell-l cell-r"\n >\n ${e.faq_metaobject?.length?`\n <simple-faq-accordion>\n <script type="application/json">\n ${JSON.stringify({content:e.faq_metaobject.map(({question:e,answer:t})=>({q:e,a:t}))})}\n\n <\/script>\n </simple-faq-accordion>\n `:`\n ${e.paragraph||""}\n \n ${e.image?`<img src="${e.image}" alt="${e.title}" />`:""}\n \n `}\n \n </div>\n </template>\n </product-accordion-item>\n `}}customElements.define("dynamic-meta-accordion-blocks",DynamicMetaAccordionBlocks);class productAccordionItem extends HTMLElement{constructor(){super()}static get observedAttributes(){return["open"]}attributeChangedCallback(e,t,s){"open"==e&&null!==s&&this.title_element&&(this.title_element.classList.contains("prod-accord__title--active")||this.toggle({animate:!1}))}connectedCallback(){DomReadyPromise().then(()=>{this.attributes.link_only||(this.title_element=this.querySelector(".prod-accord__title"),this.title_element&&(this.title_element.addEventListener("click",()=>this.toggle()),"BUTTON"!==this.title_element.tagName&&(this.title_element.setAttribute("role","button"),this.title_element.setAttribute("tabindex","0"),this.title_element.addEventListener("keydown",e=>{"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),this.title_element.click())})),this.title_element.setAttribute("aria-expanded","false"),this.hasAttribute("open")&&this.toggle({animate:!1})))}).catch(e=>{console.log(e)})}toggle({animate:e=!0}={}){this.title_element.classList.toggle("prod-accord__title--active"),this.title_element.setAttribute("aria-expanded",this.title_element.classList.contains("prod-accord__title--active")?"true":"false");const t=this.title_element.nextElementSibling;if(t&&"TEMPLATE"===t.tagName){const e=t.content;t.nextElementSibling&&"DIV"===t.nextElementSibling.tagName||t.parentNode.insertBefore(e,t.nextSibling),t.remove();new ObserverLite({key:"Global.ShortCodeTranslator$"}).once().then(e=>{e.render()})}const s=this.title_element.nextElementSibling&&"DIV"===this.title_element.nextElementSibling.tagName?this.title_element.nextElementSibling:null;if(!s)return;const notify=()=>{new ObserverLite({key:"updateProductContent$"}).next(!1)};if(this.title_element.classList.contains("prod-accord__title--active")){s.style.display="block",this.ensureReviewsWidget();const opened=()=>{s.style.height="auto",s.style.opacity=1,notify()};if(!e)return opened();s.animate([{height:"0px",opacity:0},{height:s.scrollHeight+"px",opacity:1}],{duration:300,easing:"ease"}).onfinish=opened}else{const closed=()=>{s.style.display="none",s.style.height="0px",s.style.opacity=0,notify()};if(!e)return closed();s.animate([{height:s.scrollHeight+"px",opacity:1},{height:"0px",opacity:0}],{duration:300,easing:"ease"}).onfinish=closed}}ensureReviewsWidget(){if(this.reviewsWidgetReady)return;const e=this.querySelector("[data-oke-widget]");if(!e)return;const t=e.hasAttribute("data-oke-reviews-group-id");if(t){if(this.reviewsWidgetReady=!0,e.hasAttribute("data-oke-rendered"))return;const t=Date.now(),s=setInterval(()=>{if(e.hasAttribute("data-oke-rendered"))return clearInterval(s);if(!(Date.now()-t<=15e3)){clearInterval(s);try{window.okeWidgetApi?.initWidget(e,!0)}catch(e){console.log(e)}}},100);return}const s=Date.now(),tryInit=()=>{if(!window.okeWidgetApi)return!1;try{return window.okeWidgetApi.initWidget(e,!t),this.reviewsWidgetReady=!0,!0}catch(e){return console.log(e),!1}};if(tryInit())return;const i=setInterval(()=>{(tryInit()||Date.now()-s>15e3)&&clearInterval(i)},100)}}customElements.define("product-accordion-item",productAccordionItem);class ProductFaqSection extends HTMLElement{constructor(){super()}connectedCallback(){DomReadyPromise().then(async()=>{this.product$=new ObserverLite({key:"DataLayer.Product$"});const[e,t]=await Promise.all([getAccordionBlocks(),this.product$.once()]);this.blocks=e,this.product=t,this.settings$=new ObserverLite({key:"DataLayer.ProductFaq$"}),this.settings=await this.settings$.once(3e3),this.render()}).catch(e=>{console.log(e)})}render(){const e=getBlocksForProduct(this.blocks,this.product.data.tags).filter(e=>isFaqBlock(e));if(!e.length)return;const t=e.flatMap(e=>e.faq_metaobject.map(({question:e,answer:t})=>({q:e,a:t}))),s=this.settings?.heading||"Got Questions?";this.innerHTML=`\n <h2 class="h-style h-border h-s f-w500 t-ucase tac row"><span class="bg-white block-rel">${s}</span></h2>\n <simple-faq-accordion class="d-block bdr bdr-grey rounded-md cell-l cell-r rte-content rte-content--s">\n <script type="application/json">\n ${JSON.stringify({content:t}).replace(/<\//g,"<\\/")}\n <\/script>\n </simple-faq-accordion>\n `,this.style.display="block"}}customElements.define("product-faq-section",ProductFaqSection);class ProductColorSiblingSelector extends GlobalCustomComponent{constructor(){super(),this.preInitObserver$=new ObserverLite}connectedCallback(){DomReadyPromise().then(async()=>{let e=this.querySelector(':scope > script[type="application/json"]');e&&(this.settings=JSON.parse(e.innerHTML),e.remove(),e=null),this.render()}).catch(e=>{console.log(e)})}getProducts(){return new Promise(async(e,t)=>{this.api=this.api||await new StorefrontApi;let s=`\n query @inContext(country: ${this.api.localization.country.iso_code}
1) {\n \n products(\n first:100,\n query:"tag:\\"color_sibling_collection:${this.settings.colorSiblingCollectionHandle}\\" AND product_type:\\"${this.settings.productType}\\""\n ){\n edges {\n node {\n id\n tags\n title\n onlineStoreUrl\n productType\n handle\n availableForSale\n featuredImage{\n url\n }\n media(first:100){\n edges {\n node {\n ... on Video {\n previewImage{\n url\n altText\n }\n sources {\n format\n height\n mimeType\n url\n width\n }\n }\n }\n }\n }\n }\n }\n }\n \n }\n `;this.api.authFetch({body:s}).then(async({data:t,errors:s})=>{if(s)return console.log(s),void e([]);let i=t?.products||!1;e(i?i.edges.map(e=>{const t=e.node,s=t.tags.find(e=>e.includes("color:"))?.split(":")?.[t.tags.length-1]||!1;return s&&(t.color=s),t}):[])}).catch(t=>{console.log(t),e([])})})}async render(){this.products=await this.getProducts(),this.products?.length&&(this.innerHTML=this.products.map(e=>`\n <div class="prod-image-swatch" ${e.availableForSale?"":'data-disabled="true"'}>\n <div class="prod-image-swatch-radio block-rel d-block"> \n <input class="js-prod-color-radio prod-image-swatch-radio__input" \n value="${escapeAttribute(e.color)}" \n aria-label="${escapeAttribute(e.color)}"\n data-product-url="${e.onlineStoreUrl||`/products/${e.handle}`}"\n type="radio" \n name="color" \n ${e.handle==this.settings.productHandle?"checked":""}\n >\n <span class="prod-image-swatch-radio__control block-rel">\n ${"Stickers"==e.productType&&e.color?`\n <span \n class="\n prod-col-swatch-radio__proxy-img--square\n prod-col-swatch-radio__proxy-img--global--${handleize(e.color)}\n prod-col-swatch-radio__proxy-img--stickers--${handleize(e.color)}\n "\n >\n </span>\n `:`\n <img src="${e.featuredImage.url}?w=128" width="128" height="128" loading="lazy" alt="">\n `}\n\n </span> \n </div>\n </div>\n `).join(""),this.querySelectorAll(".js-prod-color-radio").forEach(e=>{e.addEventListener("change",e=>{this.next(e.currentTarget)})}))}}customElements.define("product-color-sibling-selector",ProductColorSiblingSelector);class ProductDrinkwareTypeSelector extends GlobalCustomComponent{constructor(){super()}connectedCallback(){DomReadyPromise().then(async()=>{let e=this.querySelector(':scope > script[type="application/json"]');if(e){let t=JSON.parse(e.textContent);this.settings=t,t=null,e.remove(),e=null}if(this.types=Array.isArray(this.settings?.types)?this.settings.types:[],!this.types.length)return;const t=new ObserverLite({key:"DataLayer.GlobalUXContext"});this.GlobalUXContext=await t.once();const s=new ObserverLite({key:"DataLayer.Product$"});this.product=await s.once(),s.subscribe(()=>{this.render()}),this.drinkwareProductDesign=this.product.data.tags.find(e=>e.includes("design")||e.includes("color"))||!1,this.drinkwareProductDesign&&(this.api=await new StorefrontApi,this.update())}).catch(e=>{console.log(e)})}async update(){let e=this.types.map(e=>`(tag:\\"${this.drinkwareProductDesign}\\" AND product_type:\\"${e}\\")`).join(" OR "),t=`\n query @inContext(country: ${this.api.localization.country.iso_code}
1) {\n products(first:250, query:"${e}") {\n edges {\n node {\n tags\n productType\n title\n handle\n featuredImage {\n url\n }\n variants(first:100){\n edges {\n node {\n id\n sku\n price{\n amount\n }\n compareAtPrice{\n amount\n }\n selectedOptions{\n name\n value\n }\n image{\n url\n }\n }\n }\n }\n }\n }\n } \n }`;this.api.authFetch({body:t}).then(async e=>{let t=e.data?.products||!1;this.products=t?.edges?.length?t.edges.map(({node:e})=>{const t=e.tags.find(e=>e.includes("design:")||e.includes("color:"));t?.split(":")[1],e.title.includes("â");return e.model="Travel Mug"==e.productType?this.settings.TravelMugTranslation:"Water Bottle"==e.productType?this.settings.WaterBottleTranslation:"Leakproof Tumblers"==e.productType?this.settings.TumblersTranslation:"EasyGrip Travel Mug"==e.productType?this.settings.EasyGripTravelMugTranslation:"FitFlow Bottle"==e.productType?this.settings.FitFlowBottleTranslation:"FitSip Bottle"==e.productType?this.settings.FitSipBottleTranslation:e.productType,e.model=e.model?.length&&!e.model.toLowerCase().includes("translation missing")?e.model:e.productType,e.variants=e.variants?e.variants.edges.map(({node:e})=>e):[],e.active=this.product.data.handle==e.handle,!!e.model&&e}).filter(e=>e&&e.tags.includes(this.drinkwareProductDesign)):[],this.products=this.products.sort((e,t)=>this.types.indexOf(e.productType)-this.types.indexOf(t.productType)),this.render()}).catch(e=>{console.log(e)})}hasNumber(e){return/\d/.test(e)}async render(){if(!this.products?.length)return;this.products=await Promise.all(this.products.map(async e=>{let t=await getProxyTags({tags:e.tags,sku:e.variants[0]?.sku||!1});return t=t.find(({title:e})=>"new_waterbottle"==e?.toLowerCase())||!1,e.proxyTag=t,e}));const e=this.products.filter(({active:e})=>!e).length>0,t=this.product.data.selected_variant.options.filter(e=>!this.hasNumber(e));if(this.products=this.products.map(e=>{let s=!1,i=0;
1return e.variants.forEach(e=>{const n=e.selectedOptions.map(({value:e})=>e).filter(e=>!this.hasNumber(e)),o=t.filter(e=>n.includes(e)).length;o>i&&(i=o,s=e)}),e.selectedVariant=s||e.variants[0],e}),e){const e=new ObserverLite({key:"DataLayer.OptionNameTranslations$"}),t=await e.once();let s={name:getFrontEndOptionNameTranslation("Type",t.blocks),carousel:{class:"flex-item-grid flex-item-grid--s flex-item-grid--3 flex-item-grid--peek-50"},carouselScrollBar:!0,values:this.products.map(e=>({value:e.handle,label:e.model,image:e.selectedVariant?.image?.url||e.featuredImage?.url||null,proxyTags:e.proxyTag?[e.proxyTag]:null}))};const i=`\n <global-option-selector \n class="js-prod-drinkware-type d-block {{ class }}" \n option='${JSON.stringify(s)}' \n selected="${this.product.data.handle}"\n >\n </global-option-selector>\n `;this.innerHTML=i;const n=this.querySelector(".js-prod-drinkware-type");n?.subscribe(()=>{const e=n.option.selected;window.location.href=this.GlobalUXContext.addParamToUrl(`/products/${e}`)})}else this.setAttribute("hidden","")}}customElements.define("product-drinkware-type-selector",ProductDrinkwareTypeSelector);class SalesBox{constructor(e){this.element=e.element,this.content=e.content,this.GlobalGeoStoreLocator=e.GlobalGeoStoreLocator,this.ObserverLite=new ObserverLite,this.render()}subscribe(e){return this.ObserverLite.subscribe(e)}next(e){this.ObserverLite.next(e)}render(){this.element.innerHTML=`\n <ul class="ul-has-bullets lh-r">\n ${this.content.filter(({text:e})=>{const t=document.createElement("div");return t.innerHTML=e,t.innerText.trim().length>0}).map(({text:e})=>{if(["[[country]]","[[country_name]]","[[country_flag]]"].find(t=>e.includes(t))){if(!this.GlobalGeoStoreLocator?.ipStackData)return!1;const t=this.GlobalGeoStoreLocator?.ipStackData?.country_name||"",s=this.GlobalGeoStoreLocator?.ipStackData?.country_code.toLowerCase()||!1;return`<li class="salesbox-item">${e=(e=(e=(e=e.replace("[[country]]",t)).replace("[[country_name]]",t)).replace("[[country_flag]]",s?`<span class="fi fi-${s}"></span>`:"")).replace(/\[\[([a-z]+)\]\]/g,'<span class="fi fi-$1"></span>')}</li>`}return`<li class="salesbox-item">${e}</li>`}).filter(e=>e).join("")}\n </ul>\n `}}class ProductSalesboxContent extends GlobalCustomComponent{constructor(){super()}connectedCallback(){DomReadyPromise().then(async()=>{let e=this.querySelector(':scope > script[type="application/json"]');if(e&&(this.settings=JSON.parse(e.textContent),e.remove(),e=null),!this.settings)return void this.remove();const t=await new GeoStoreLocator,s=(await t.ObserverLite.once(),this.settings.productTags),i=await new ObserverLite({key:"Data.productSalesBoxContentCountries$"}).once(),n=await new ObserverLite({key:"Data.productSalesBoxContentProduct$"}).once();let o=[...i?.items||[],...n?.items||[]];o=o.filter(e=>{const i=Array.isArray(e.country_codes)?e.country_codes:e.country_codes?.split(",")||[],n=Array.isArray(e.keys)?e.keys:e.keys?.split(",")||[],o=Array.isArray(e.not_keys)?e.not_keys:e.not_keys?.split(",")||[],r=n.includes("*"),a=o?.some(e=>s.indexOf(e)>=0);return!a&&(r||n?.some(e=>s.indexOf(e)>=0)||i?.indexOf(t.ipStackData?.country_code)>=0)}),o.find(({exclude:e})=>e)&&(o=o.filter(({exclude:e})=>e)),o=o.map(e=>{const t=e._text?(e._text.match(/<div class="metafield-rich_text_field">(.*?)<\/div>/)||[])[1]:e.text;return{...e,text:t}});const r=new SalesBox({element:this,content:o,GlobalGeoStoreLocator:t}),{selectedVariantPreOrderDate:a,selectedVariantPreOrderText:l}=this.settings.translations;function updateContent(e){let t=o;e&&(t=t.filter(({hide_for_pre_order:e})=>!e),t=t.concat([{text:`<p>${l.replace("$date",e)}</p>`}])),r.content=t,r.render()}const c=await window.wbskProductForms.getByKey("product_main");c.ObserverLite.once().then(()=>{c.subscribe(()=>{const{pre_order:e}=c.settings.variant;updateContent(e)})}),updateContent(a)}).catch(e=>{console.log(e)})}}customElements.define("product-salesbox-content",ProductSalesboxContent);class ProductUSPList extends HTMLElement{constructor(){super()}connectedCallback(){DomReadyPromise().then(async()=>{document.querySelector("button")?.addEventListener("click",e=>{this.classList.toggle("product-usp-list--show-all")}
1)}).catch(e=>{console.log(e)})}}customElements.define("product-usp-list",ProductUSPList);const s="__none",i="__other",n=["powerbank","wireless_charger","ring_holder"],o=[{series:"mirror",test:/mirror/},{series:"elite",test:/elite/},{series:"tough",test:/tough/},{series:"snap",test:/snap/}],r=/magsafe|magnetic/,a={tough:"yes",elite:"yes",mirror:"yes"},l={magnet:!0,magnetic_case:{tough:!0,elite:!0,mirror:!0},powerbank:a,wireless_charger:a,ring_holder:a};function lookupModel(e,t){const s=e&&e.models?e.models[t]:null;if(s)return{row:s,source:"matrix"};const i=function iphoneGeneration(e){const t=/^iphone-(\d+)/.exec(e||"");return t?parseInt(t[1],10):null}(t);return null!==i&&i>=12?{row:l,source:"iphone-family"}:{row:null,source:"unknown-model"}}function negativeState(e){return"powerbank"===e?"cable_only":"not_compatible"}function unratedMagneticState(e){return"powerbank"===e?"cable_only":"compatible"}function resolveState({model:e,caseType:t,accessory:a,matrix:l}){const c=function normalizeCaseType(e){if(!e)return null;if(e===s||e===i)return{series:e,magnetic:!1,raw:e};const t=String(e).toLowerCase(),n=o.find(({test:e})=>e.test(t));return{series:n?n.series:null,magnetic:r.test(t),raw:e}}(t);if(!c||-1===n.indexOf(a))return{state:"unconfirmed",source:"invalid-input"};if(c.series===i)return{state:"unconfirmed",source:"rule"};const{row:d,source:u}=lookupModel(l,e);if(c.series===s){return{state:!!d&&!0===d.magnet?"no_case_magnet":"no_case_no_magnet",source:u}}if(!c.magnetic)return{state:negativeState(a),source:"non-magnetic-case"};if("ring_holder"===a&&"mirror"===c.series)return{state:"not_compatible",source:"rule:mirror-no-ring-holder"};const{verdict:p,inherited:h}=function lookupVerdict(e,t,s){const i=e?e[t]:null;if(!i)return{verdict:null,inherited:!1};if("mirror"===s)return{verdict:null==i.elite?null:i.elite,inherited:!0};const n=i[s];return{verdict:n??null,inherited:!1}}(d,a,c.series);return null===p?{state:unratedMagneticState(a),source:"unrated-combination"}:{state:"yes"===p?"compatible":negativeState(a),source:h?`${u}:mirror-inherits-elite`:u}}const c=["Dark","Light"];const d={},u={positive:{color:"t-green",icon:"check"},caution:{color:"t-yellow",icon:"alert"},unknown:{color:"t-dark-blue",icon:"query"},negative:{color:"t-red",icon:"cross"}},p={check:'<circle cx="8" cy="8" r="8" fill="currentColor"/><path d="M4.6 8.2 6.9 10.5 11.4 6" fill="none" stroke="#fff" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"/>',alert:'<circle cx="8" cy="8" r="8" fill="currentColor"/><path d="M8 4.1v4.7" stroke="#fff" stroke-width="1.6" stroke-linecap="round"/><circle cx="8" cy="11.4" r="1" fill="#fff"/>',query:'<circle cx="8" cy="8" r="8" fill="currentColor"/><path d="M6.3 6.2a1.75 1.75 0 1 1 2.35 1.65c-.44.17-.68.55-.68 1.02v.28" fill="none" stroke="#fff" stroke-width="1.5" stroke-linecap="round"/><circle cx="8" cy="11.4" r="1" fill="#fff"/>',cross:'<circle cx="8" cy="8" r="8" fill="currentColor"/><path d="M5.7 5.7 10.3 10.3M10.3 5.7 5.7 10.3" stroke="#fff" stroke-width="1.6" stroke-linecap="round"/>'};function fetchMatrix(e){return e?(d[e]||(d[e]=fetch(`/?sections=${e}`).then(e=>e.json()).then(t=>{const s=document.createElement("div");s.innerHTML=t[e];const i=s.querySelector('script[type="application/json"]');return i?JSON.parse(i.textContent):null}).catch(()=>null)),d[e]):Promise.resolve(null)}function decodeCopy(e){return"string"==typeof e?function decodeEntities(e){if("string"!=typeof e||-1===e.indexOf("&"))return e;const t=document.createElement("textarea");return t.innerHTML=e,t.value}(e):e&&"object"==typeof e?Object.keys(e).reduce((t,s)=>(t[s]=decodeCopy(e[s]),t),{}):e}class ProductMagneticFit extends HTMLElement{constructor(){super(),this.state={model:null,caseType:null}}connectedCallback(){DomReadyPromise().then(async()=>{let e=this.querySelector(':scope > script[type="application/json"]');e?(this.settings=JSON.parse(e.innerHTML),e.remove(),e=null,this.copy=decodeCopy(this.settings.translations||{}),this.matrix=await fetchMatrix(this.settings.matrix_section),"accessory"===this.settings.mode?await this.initAccessoryMode():await this.initCaseMode()):this.remove()}).catch(e=>{console.log("ProductMagneticFit:",e),this.remove()})}async initCaseMode(){const e=new ObserverLite({key:"DataLayer.Product$"}),t=await e.once();t?(this.state.model=handleize(String(t.model||"").replace(" Case","")),this.applyVariant(t.data.selected_variant),e.subscribe(e=>{e&&e.variant&&this.applyVariant(e.variant)})):this.remove()}applyVariant(e){if(!e)return;const t=(e.optionNames||[]).indexOf(this.settings.case_type_option||"Case Type");this.update({caseType:-1===t?null:e.options[t]})}update(e){const t={...this.state,...e},s=`${t.model}::${t.caseType}`;s!==this.renderedKey&&(this.renderedKey=s,this.state=t,this.render())}async initAccessoryMode(){this.accessory=this.settings.accessory;const[e,t]=await Promise.all([getPhoneCaseModelTypesDataFull(),new ObserverLite({key:"DataLayer.caseTypeContent"}).once()]);this.models=e,this.caseTypeContent=t,this.state.model=null,this.state.modelTitle=null,this.state.caseType=null,this.render(),this.applyPrefill().catch(e=>console.log("ProductMagneticFit:",e))}async applyPrefill(){const e=await new ObserverLite({key:"DataLayer.initSelectedPhoneModel$"}).once(),t=this.findModel(e&&e.model);
1if(await this.claimModelSelector(t),this.bindAccessoryControls(),!t||this.state.modelTitle)return;this.state.modelTitle=t.title;const s=this.querySelector(".js-mag-fit-model-toggle span");s&&(s.textContent=t.title),this.renderCaseDropdown(),this.update({model:handleize(t.title)})}async claimModelSelector(e){if(!document.querySelector(".js-global-phone-model-selector"))return;const t=await new ObserverLite({key:"GlobalPhoneModelSelector$"}).once();this.modelSelector=t,t.instances.magfit={},t.selected.magfit={observer:new ObserverLite,value:{name:e?e.title:""},onUpdate:()=>{const e=t.selected.magfit.value,s=this.findModel(e&&e.name);if(!s)return;this.state.modelTitle=s.title,this.state.caseType=null;const i=this.querySelector(".js-mag-fit-model-toggle span");i&&(i.textContent=s.title),this.renderCaseDropdown(),this.update({model:handleize(s.title)})}}}findModel(e){if(!e||!this.models)return null;const t=handleize(String(e).replace(" Case",""));return this.models.find(e=>handleize(e.title)===t)||null}caseOptions(){const e=this.findModel(this.state.modelTitle),t=e&&e.types?e.types:[],s=this.caseTypeContent||[],n=s.map(e=>e.option_title),rank=e=>{const t=n.indexOf(e);return-1===t?n.length:t},o=[];return t.filter(Boolean).sort((e,t)=>rank(e)-rank(t)).forEach(e=>{const t=s.find(t=>t.option_title===e),{key:i,title:n}=function getCaseTypeFamily(e,t){const s=e?.title||t,i=e?.finish||c.find(e=>s.split(" ").includes(e))||"",n=!!i&&s.replace(i,"").replace(/\s+/g," ").trim();return{key:n?`family:${n}`:t,family:n,finish:i,title:n||s}}(t,e);o.some(e=>e.key===i)||o.push({key:i,value:e,label:n})}),o.map(({value:e,label:t})=>({value:e,label:t})).concat([{value:"__none",label:this.copy.case_none},{value:i,label:this.copy.case_other}])}escape(e){return String(e??"").split("&").join("&").split("<").join("<").split(">").join(">").split('"').join(""")}stateTone(e){return"compatible"===e||"no_case_magnet"===e?"positive":"not_compatible"===e?"negative":"unconfirmed"===e?"unknown":"caution"}verdictHtml(e,t){const s=u[this.stateTone(e)],i=t?` ${t}`:"";return`\n <span class="mag-fit__verdict flex align-center gap--d4 ${s.color}${i}">
1\n <svg class="icon-16 flex-shrink-zero" viewBox="0 0 16 16" aria-hidden="true" focusable="false">${p[s.icon]}</svg>\n <span class="f-w500 t-s">${this.escape(this.copy.label&&this.copy.label[e])}</span>\n </span>\n `}rowHtml(e,t,s){return`\n <div\n class="mag-fit__row flex row-wrap align-top justify-space gap--d3 ct--s cb--s${0===s?"":" bdr-t bdr-grey"}"\n role="listitem"\n data-state="${this.escape(t.state)}"\n data-source="${this.escape(t.source)}"\n >\n <span class="mag-fit__row-name">\n <span class="f-w500 h-xxs d-block">${this.escape(this.copy.accessory&&this.copy.accessory[e])}</span>\n <span class="t-s t-grey d-block">${this.escape(this.copy.accessory_sub&&this.copy.accessory_sub[e])}</span>\n </span>\n ${this.verdictHtml(t.state)}\n </div>\n `}headingHtml(){return`<span class="mag-fit__heading f-w600 h-xxs d-block row--s">${this.escape(this.copy.heading)}</span>`}renderCaseMode(){const e=function resolveAll({model:e,caseType:t,matrix:s}){return n.reduce((i,n)=>(i[n]=resolveState({model:e,caseType:t,accessory:n,matrix:s}),i),{})}({model:this.state.model,caseType:this.state.caseType,matrix:this.matrix});this.innerHTML=`\n <div class="mag-fit bg-light-brown rounded-md ct cb cell-l cell-r row">\n ${this.headingHtml()}\n <div class="mag-fit__rows" role="list">\n ${n.map((t,s)=>this.rowHtml(t,e[t],s)).join("")}\n </div>\n </div>\n `}renderAccessoryMode(){this.innerHTML=`\n <div class="mag-fit mag-fit--accessory bg-light-brown rounded-md ct cb cell-l cell-r row">\n ${this.headingHtml()}\n\n <label class="f-w500 t-s d-block ct--s row--xs">${this.escape(this.copy.your_phone)}</label>\n <button type="button" class="js-mag-fit-model-toggle btn-reset wbsk-ui-option-toggle proxy-selector block-12/12 bg-white">\n <span>${this.escape(this.state.modelTitle||this.copy.select_phone)}</span>\n </button>\n\n <label class="f-w500 t-s d-block ct--s row--xs">${this.escape(this.copy.your_case)}</label>\n <div class="js-mag-fit-case-wrap block-12/12 row--s bg-white rounded-md"></div>\n\n <div class="js-mag-fit-result"></div>\n </div>\n `,this.renderCaseDropdown(),this.renderResult(),this.bindAccessoryControls()}renderCaseDropdown(){const e=this.querySelector(".js-mag-fit-case-wrap");if(!e)return;e.innerHTML="";const t=document.createElement("global-dropdown-ui");t.className="js-mag-fit-case global-dropdown-ui--collection-filter";const s=document.createElement("script");s.type="application/json",s.textContent=JSON.stringify({hide_checkbox:!0,empty:!1,key:"magnetic_fit_case",placeholder:this.copy.select_case,dropdown_heading:this.copy.your_case,selected:this.state.caseType?[this.state.caseType]:[],options:[{set:{options:this.caseOptions().map(({value:e,label:t})=>({name:"magnetic_fit_case",label:t,value:e}))}}]}),t.appendChild(s),e.appendChild(t),t.subscribe(({type:e})=>{if("update_selected"!==e)return;const s=t.settings&&t.settings.selected;this.update({caseType:s&&s.length?s[0]:null})})}renderResult(){const e=this.querySelector(".js-mag-fit-result");if(!e)return;if(!this.state.caseType)return void(e.innerHTML="");const t=resolveState({model:this.state.model,caseType:this.state.caseType,accessory:this.accessory,matrix:this.matrix});e.innerHTML=`\n <div\n class="mag-fit__result bdr-t bdr-grey ct--s"\n data-state="${this.escape(t.state)}"\n data-source="${this.escape(t.source)}"\n >\n ${this.verdictHtml(t.state,"row--xxs")}\n <span class="mag-fit__result-text t-s t-grey d-block pd-left-24">${this.escape(this.copy.text&&this.copy.text[function textKey(e,t){return"compatible"===e&&"ring_holder"===t?"compatible_ring_holder":e}(t.state,this.accessory)])}</span>\n </div>\n `}render(){"accessory"===this.settings.mode?this.querySelector(".js-mag-fit-result")?this.renderResult():this.renderAccessoryMode():this.renderCaseMode()}bindAccessoryControls(){const e=this.querySelector(".js-mag-fit-model-toggle");e&&this.modelSelector&&e.addEventListener("click",()=>this.modelSelector.toggle("magfit"))}}customElements.define("product-magnetic-fit",ProductMagneticFit);const h=".js-prod-accord__content";class MagneticFitPlacement extends HTMLElement{connectedCallback(){DomReadyPromise().then(async()=>{const e=this.querySelector(':scope > script[type="application/json"]');if(!e)return void this.done();this.settings=JSON.parse(e.textContent),fetchMatrix(this.settings.matrix_section);const t=document.querySelector("dynamic-meta-accordion-blocks");if(!t)return void this.done();await new ObserverLite({key:"DynamicMetaAccordionBlocks$"}).once();const s=this.target(t);s?this.injectInto(s):this.injectFallback(t),this.done()}).catch(e=>{console.log("MagneticFitPlacement:",e),this.done()})}done(){this.remove()}get targetType(){return this.settings.target_data_type||"magnetic-fit-guide"}target(e){return e.querySelector(`product-accordion-item[data-type="${this.targetType}"]`)}injectInto(e){const t=e.querySelector(":scope > template"),s=t?t.content.querySelector(h):e.querySelector(h);return s?(s.insertAdjacentHTML("afterbegin",this.panelHtml()),e):(console.log("MagneticFitPlacement: no content in",this.targetType),this.injectFallback(e.parentNode))}injectFallback(e){const t=this.settings.fallback_icon,s=t?` style="background-image:url(${this.escape(t)});"`:"",i=e.querySelector('product-accordion-item[data-type="shipping"]');return(i||e).insertAdjacentHTML(i?"afterend":"beforeend",`\n <product-accordion-item class="bdr-b bdr-grey" data-type="${this.escape(this.targetType)}">\n <div class="prod-accord__title ct cb cell-r"${s}>
1\n <span class="f-w500 t-s t-ucase">${this.escape(this.settings.fallback_title)}</span>\n </div>\n <template>\n <div style="display:none;" class="js-prod-accord__content prod-accord__content rte-content rte-content--s cb cell-l cell-r">\n ${this.panelHtml()}\n </div>\n </template>\n </product-accordion-item>\n `),i?i.nextElementSibling:e.lastElementChild}panelHtml(){const{target_data_type:e,fallback_title:t,fallback_icon:s,...i}=this.settings;return`<product-magnetic-fit class="mag-fit-wrap d-block"><script type="application/json">${JSON.stringify(i).split("<").join("\\u003c")}<\/script></product-magnetic-fit>`}escape(e){return String(e??"").split("&").join("&").split("<").join("<").split(">").join(">").split('"').join(""")}}customElements.define("magnetic-fit-placement",MagneticFitPlacement);class AccordionLink extends HTMLElement{connectedCallback(){DomReadyPromise().then(async()=>{const e=this.querySelector(':scope > script[type="application/json"]');if(!e)return void this.remove();if(this.settings=JSON.parse(e.textContent),!this.settings.target_data_type)return void this.remove();const t=this.readPlacement(),s=new ObserverLite({key:"DataLayer.Product$"}),[i,n]=await Promise.all([getAccordionBlocks(),s.once()]),o=getBlocksForProduct(i,n&&n.data?n.data.tags:[]).find(e=>handleize(e.title||"")===this.settings.target_data_type)||(t&&t.target===this.settings.target_data_type?t:null);o?this.render(o):this.remove()}).catch(e=>{console.log("AccordionLink:",e),this.remove()})}readPlacement(){const e=document.querySelector('magnetic-fit-placement > script[type="application/json"]');if(!e)return null;try{const t=JSON.parse(e.textContent);return{target:t.target_data_type,title:t.fallback_title,icon:t.fallback_icon}}catch(e){return null}}render({title:e,icon:t}){const s=this.settings.title||e;this.innerHTML=`\n <button\n type="button"\n class="js-accordion-link btn-reset flex align-center justify-space gap--d3 block-12/12 tal ct--s cb--s cell-l cell-r bdr-t bdr-b bdr-l bdr-r bdr-grey rounded-md"\n >\n <span class="flex align-center gap--d3">\n ${t?`<img class="icon-20 flex-shrink-zero" src="${this.escape(t)}" alt="" />`:""}\n <span class="f-w500 t-s t-ucase">${this.escape(s)}</span>\n </span>\n <span class="f-w500 t-s t-ucase t-green t-uline">${this.escape(this.settings.details)}</span>\n </button>\n `,this.querySelector(".js-accordion-link").addEventListener("click",()=>this.openItem()),this.hidden=!1}openItem(){const e=document.querySelector(`product-accordion-item[data-type="${this.settings.target_data_type}"]`),t=e&&e.querySelector(".prod-accord__title");if(!t)return;const s=document.querySelector(".js-wbsk-sticky-product-form"),i=(s?s.offsetHeight:0)+60;window.scrollTo({top:window.pageYOffset+t.getBoundingClientRect().top-i,behavior:"smooth"}),t.classList.contains("prod-accord__title--active")||t.click()}escape(e){return String(e??"").split("&").join("&").split("<").join("<").split(">").join(">").split('"').join(""")}}customElements.define("accordion-link",AccordionLink);const g={};function normalise(e){return String(e||"").trim().toLowerCase()}function escapeHtml(e){return String(e??"").replace(/[&<>"]/g,e=>({"&":"&","<":"<",">":">",'"':"""}[e]))}class ProductPromoBanner extends HTMLElement{connectedCallback(){DomReadyPromise().then(async()=>{let e=this.querySelector(':scope > script[type="application/json"]');if(!e)return void this.remove();this.settings=JSON.parse(e.innerHTML),e.remove(),e=null;const t=(await function fetchBanners(e){if(!e)return Promise.resolve([]);if(!g[e]){const t=window.Shopify&&window.Shopify.routes&&window.Shopify.routes.root||"/";g[e]=fetch(`${t}?sections=${e}`).then(e=>e.json()).then(t=>{const s=document.createElement("div");s.innerHTML=t[e];const i=s.querySelector('script[type="application/json"]'),n=i?JSON.parse(i.textContent):[];return Array.isArray(n)?n:[]}).catch(()=>[])}return g[e]}(this.settings.section)).find(e=>function hasCopy(e){const t=String(e.text||"").replace(/<[^>]*>| /g,"");return Boolean(String(e.heading||"").trim()||t.trim())}(e)&&function matchesType(e,t){const s=String(e.product_types||"").split(",").map(normalise).filter(
1Boolean);return 0===s.length||-1!==s.indexOf(normalise(t))}(e,this.settings.product_type)&&function matchesContext(e,t){const s=normalise(e.context)||"all";return"all"===s||s===normalise(t)}(e,this.settings.context));t?this.render(t):this.remove()}).catch(e=>{console.log("ProductPromoBanner:",e),this.remove()})}render(e){const t=Number(e.icon_width)||14,s=e.icon?`<img\n class="pdp-promo-banner__icon"\n style="--promo-icon-w:${t}px"\n src="${e.icon.src}"\n alt="${escapeHtml(e.icon.alt)}"\n loading="lazy"\n decoding="async">`:"",i=Number(e.image_width)||112,n=Number(e.image_width_mobile)||i,o=e.image?`<div\n class="pdp-promo-banner__media"\n style="--promo-img-w:${i}px;--promo-img-w-m:${n}px">\n <img\n class="pdp-promo-banner__image"\n src="${e.image.src}"\n srcset="${e.image.src} 1x, ${e.image.src_2x} 2x"\n width="${Number(e.image.width)||""}"\n height="${Number(e.image.height)||""}"\n alt="${escapeHtml(e.image.alt)}"\n loading="lazy"\n decoding="async">\n </div>`:"",r=e.heading?`<strong class="pdp-promo-banner__heading f-w600">${escapeHtml(e.heading)}</strong>`:"",a=e.text?`<div class="pdp-promo-banner__body rte-content">${e.text}</div>`:"";this.innerHTML=`\n <div class="pdp-promo-banner">\n <div class="pdp-promo-banner__content">\n ${s}\n <div class="pdp-promo-banner__text t-r @mobile__t-xs">${r}${a}</div>\n </div>\n ${o}\n </div>\n `,e.background_color&&this.firstElementChild.style.setProperty("--promo-bg",e.background_color),this.hidden=!1}}customElements.define("product-promo-banner",ProductPromoBanner);class GlobalDynamicProductGroupNavigation extends GlobalCustomComponent{constructor(){super(),this.ready$=new ObserverLite}connectedCallback(){if(this.is_init)return!1;DomReadyPromise().then(async()=>{let e=this.querySelector(':scope > script[type="application/json"]');if(e){const t=JSON.parse(e.innerHTML);this.settings=t,e.remove(),e=null,this.BundlesDataProducer=await new ObserverLite({key:`DataLayer.BundlesDataProducer.${this.settings.key}$`}).once(),this.current_slot=this.BundlesDataProducer.settings.slots.find(({id:e})=>e===this.settings.current_slot.id)||!1,this.current_slot.util.event$.subscribe(({type:e,data:t})=>{"productSlotsUpdate"!=e||this.is_init||this.init(),"slotConfigChange"==e&&(this.is_init=!1,this.active_filters=[],this.input&&(this.input.value=""),this.navSync$&&this.navSync$.next({active_filters:[],input_value:""})),"applyFiltersFromUI"===e&&(this.active_filters=t,this.update())})}}).catch(e=>{})}init(){this.is_init=!0,this.navSync$=new ObserverLite({key:`NavSync.${this.settings.key}.${this.current_slot.id}`});this.current_slot.util.settings.productFilters.some(({id:e,values:t})=>("filter.p.m.my_fields.collection"===e||"filter.p.m.my_fields.color"===e||"filter.p.m.my_fields.design"===e)&&t.length>0)?(this.active_filters=[],this.render()):this.remove()}render(){this.innerHTML=`\n <div class="flex row-wrap flex-item-grid flex-item-grid--2 @mobile__flex-item-grid--1 ${this.settings.wrapperClass||""}">\n <div class="flex-item-grid__child">\n <div class="wbsk-ui-option-toggle wbsk-ui-option-toggle--s gspg-nav__search-wrapper global-icon-button--search proxy-selector">\n <input \n type="text" \n class="js-gspg-nav__search gspg-nav__search block-12/12"\n aria-label="${escapeAttribute(this.current_slot.util.settings.translations.search)}"\n placeholder="${this.current_slot.util.settings.translations.search}"\n >\n </div>\n </div>\n <div class="flex-item-grid__child">\n <button \n type="button" \n class="js-gspg-nav__filter-toggle btn-reset wbsk-ui-option-toggle proxy-selector proxy-selector--filter-by flex-grid--xxs block-12/12">\n <span>${this.current_slot.util.settings.translations.filter_by}</span>\n <span class="js-gspg-nav__filter-count cell-l--xxs" style="display:none"></span>\n </button>\n </div>\n </div>\n `,this.bind()}updateFilterCount(){this.filterCount=this.filterCount||this.querySelector(".js-gspg-nav__filter-count");const e=this.active_filters.reduce((e,t)=>
1e+t.selected.length,0);this.filterCount.style.display=e?"block":"none",this.filterCount.innerText=`(${e})`}async update(){this.current_slot.util.event$.next({type:"loading_state",data:{loading:!0}}),this.updateFilterCount();const e=this.input.value,t=this.active_filters.length>0||e.length>3;if(this.current_slot.util.settings.products.forEach(e=>{delete e.filter_view}),t){const[t]=await this.BundlesDataProducer.updateSlotProducts([this.current_slot],{additional_query_params:e.length>3?` AND (title:${e}*)`:"",search_filter_query:!0,additional_query_filters:this.active_filters.length>0?this.active_filters:[],log_query:!1});t.products.map(e=>{e.filter_view=!0});const s=new Map(this.current_slot.util.settings.products.map(e=>[e.id,e]));t.products.forEach(e=>{e.filter_view=!0,s.set(e.id,e)}),this.current_slot.util.settings.products=[...s.values()],this.current_slot.util.settings.active_filters=!0}else this.current_slot.util.settings.active_filters=!1;this.current_slot.util.event$.next({type:"productSlotsUpdate",data:{filtered_view:t}}),this.current_slot.util.event$.next({type:"loading_state"}),this._isSyncing=!0,this.navSync$.next({active_filters:this.active_filters,input_value:this.input.value}),this._isSyncing=!1}mountFiltersSidebar(){const e=`\n <global-sidebar \n class="js-gspg-nav__filter-sidebar js-gspg-nav__filter-sidebar--${this.current_slot.id}"\n button_hide>\n <template>\n \n <div class="block-rel filter-nav__main_menu flex column-nowrap">\n <div class="filter-nav__menu-header">\n <button \n class="modal-close modal-close-btn btn-reset global-icon-button global-icon-button--close"\n aria-label="${escapeAttribute(window.wbskA11y?.close||"Close")}"\n data-passive\n ></button>\n <h2 class="h-style h-xs t-ucase f-w700 filter-nav__menu-title">${this.current_slot.util.settings.translations.confirm}</h2>\n <button \n class="js-sb__constrol-button filter-nav__control filter-nav__control--right btn-reset t-xs btn btn--bdr btn--s t-ucase"\n data-control-id="resetFiltersButton"\n style="display:none"\n >\n ${this.current_slot.util.settings.translations.reset_filters}\n </button>\n </div>\n <global-dynamic-product-group-navigation-filter-ui>\n <script type="application/json">\n ${JSON.stringify({key:this.settings.key,current_slot:{id:this.current_slot.id},translations:{show_less_filters:this.current_slot.util.settings.translations.show_less_filters,show_more_filters:this.current_slot.util.settings.translations.show_more_filters}})}\n <\/script>\n </global-dynamic-product-group-navigation-filter-ui>\n <div class="cell-l cell-r ct cb filter-nav__sticky-panel">\n <button \n type="button" \n class="modal-close btn btn--green block-12/12"\n >${this.current_slot.util.settings.translations.confirm}\n </button>\n </div>\n </div>\n </template>\n </global-sidebar>\n `;document.body.insertAdjacentHTML("beforeend",e)}updateFilterUi({active_filters:e,input_value:t}){this.active_filters=e,this.input.value=t,this.updateFilterCount()}bind(){if(this.input=this.querySelector(".js-gspg-nav__search"),this.filterNavToggle=this.querySelector(".js-gspg-nav__filter-toggle"),this.navSync$.subscribe(({active_filters:e,input_value:t})=>{this._isSyncing||this.updateFilterUi({active_filters:e,input_value:t})}),this.navSync$.onceDone){const{active_filters:e,input_value:t}=this.navSync$.onceDone;this.updateFilterUi({active_filters:e,input_value:t})}this.input.addEventListener("keyup",function(e){this.update(),this._isSyncing=!0,this.navSync$.next({active_filters:this.active_filters,input_value:this.input.value}),this._isSyncing=!1}.bind(this).debounce(500)),this.filterNavToggle.addEventListener("click",e=>{e.preventDefault(),this.filterSidebar||(this.mountFiltersSidebar(),this.filterSidebar=document.body.querySelector(`.js-gspg-nav__filter-sidebar--${this.current_slot.id}`)),this.filterSidebar.open()})}}customElements.define("global-dynamic-product-group-navigation",GlobalDynamicProductGroupNavigation);class GlobalDynamicProductGroupNavigationFilterUi extends GlobalCustomComponent{constructor(){super(),this.ready$=new ObserverLite}connectedCallback(){DomReadyPromise().then(async()=>{let e=this.querySelector(':scope > script[type="application/json"]');if(e){const t=JSON.parse(e.innerHTML);this.settings=t,e.remove(),e=null,this.BundlesDataProducer=await new ObserverLite({key:`DataLayer.BundlesDataProducer.${this.settings.key}$`}
1).once(),this.current_slot=this.BundlesDataProducer.settings.slots.find(({id:e})=>e===this.settings.current_slot.id)||!1,this.render(),this.bind()}}).catch(e=>{console.log(e)})}render(){const e=this.current_slot.util.settings.productFilters,t=[...[e.find(({id:e})=>"filter.p.m.my_fields.color"===e)]||0,...[e.find(({id:e})=>"filter.p.m.my_fields.collection"===e)]||0,...[e.find(({id:e})=>"filter.p.m.my_fields.design"===e)]||0];if(!t.length)return this.innerHTML="<p>No filters available</p>",!1;this.innerHTML=`\n \n <global-multipart-form class="ct flex column-nowrap gap--x2">\n <script type="application/json">\n ${JSON.stringify({key:this.current_slot.id})}\n <\/script>\n ${t.map(e=>`\n <collection-filter-sb-wrapper\n key="${e.label}" \n class="flex column-nowrap gap"\n >\n <global-multipart-form-fieldset class="flex column-nowrap gap" name="${e.id}">\n <span \n class="d-block cell-l cell-r f-w500 t-ucase btn-reset tal"\n >\n ${e.label}\n </span>\n <div \n class="js-collection-filter-sb-wrapper__items filter-option-tab-wrapper cell-l cell-r flex row-wrap align-center justify-left block-12/12"\n >\n ${e.values.map((t,s)=>`\n <label\n class="js-proxy-radio proxy-radio" for="Filter-${e.id}}-${s}">\n <input type="checkbox" \n class="proxy-radio__input reset-input" \n name="${e.id}"\n value="${t.label}"\n >\n <div class=" proxy-radio__content filter-option-tab"> \n ${"filter.p.m.my_fields.color"==e.id?`\n <span \n class="filter-option-tab-pill__img-wrap"\n >\n <span \n class="\n prod-col-swatch-radio__proxy-img \n prod-col-swatch-radio__proxy-img--global-${handleize(t.label)}\n "\n >\n </span>\n </span>\n `:""}\n ${t.label}\n </div>\n \n </label>\n `).join("")}\n </div>\n \n \n \n </global-multipart-form-fieldset>\n <button \n class="js-collection-filter-sb-wrapper__toggle collection-filter-sb-wrapper__toggle d-block cell-l cell-r f-w500 t-ucase btn-reset tal"\n data-passive-text="${this.settings.translations.show_more_filters}"\n data-active-text="${this.settings.translations.show_less_filters}"\n type="button"\n >\n \n </button>\n </collection-filter-sb-wrapper>\n `).join("")}\n </global-multipart-form>\n \n `}bind(){this.currentSelectedOption=[],this.sidebarUi=this.closest("global-sidebar"),this.GlobalMultipartForm=this.querySelector("global-multipart-form"),this.sidebarUi.subscribe(({type:e,controlId:t,open:s,passive:i})=>{"resetFiltersButton"!=t?(s||i||(this.currentSelectedOptions=this.GlobalMultipartForm.options.filter(e=>e.selected.length>0).map(({name:e,selected:t})=>({name:e,selected:t})),this.current_slot.util.event$.next({type:"applyFiltersFromUI",data:this.currentSelectedOptions})),s&&(this.currentSelectedOptions&&this.currentSelectedOptions.length?this.GlobalMultipartForm.applySettingsOptions(this.currentSelectedOptions):this.GlobalMultipartForm.resetAll())):this.GlobalMultipartForm.resetAll()});const e=new ObserverLite({key:this.current_slot.id});this.values$=e.subscribe(e=>{const t=this.sidebarUi?.controls?.find(({controlId:e})=>"resetFiltersButton"==e)||!1;if(t){const s=e.options.some(e=>e.selected.length>0);t.element.style.display=s?"block":"none"}})}}customElements.define("global-dynamic-product-group-navigation-filter-ui",GlobalDynamicProductGroupNavigationFilterUi);class GlobalMultipartForm extends GlobalCustomComponent{constructor(){super(),this.ready$=new ObserverLite}connectedCallback(){DomReadyPromise().then(()=>{let e=this.querySelector(':scope > script[type="application/json"]');e&&(this.settings=JSON.parse(e.innerHTML),e.remove()),this.values$=new ObserverLite({key:this.settings?.key||!1}),this.init(),this.ready$.next(!0)}).catch(console.log)}init(){const e=this.options=[],t=this.values$,applySettingsOptions=(s=[])=>
1{s.forEach(({name:t,selected:s})=>{const i=e.find(e=>e.name===t);i&&(i.selected=[...s],i.updateSelectedInputs(s))}),t.next({options:e})};this.applySettingsOptions=applySettingsOptions,this.resetAll=()=>{e.forEach(e=>{e.selected=[],e.updateSelectedInputs([])}),t.next({options:e})},this.querySelectorAll("global-multipart-form-fieldset").forEach(s=>{const i=s.getAttribute("name"),n=this.settings?.options?.find(e=>e.name===i),o=[...s.querySelectorAll("input")],r={name:i,selected:n?.selected||o.filter(({checked:e})=>e).map(({value:e})=>e)||[],inputs:o,updateSelectedInputs(e){this.inputs.forEach(t=>{t.checked=e.includes(t.value)})},updateSelectedArray({value:s,checked:i}){this.selected=i?[...this.selected,s]:this.selected.filter(e=>e!=s),t.next({options:e})}};r.updateSelectedInputs(r.selected),r.inputs.forEach(e=>{e.addEventListener("change",()=>{r.updateSelectedArray(e)})}),e.push(r)}),this.settings?.options&&applySettingsOptions(this.settings.options)}}customElements.define("global-multipart-form",GlobalMultipartForm);class CollectionFilterSbWrapper extends HTMLElement{constructor(){super(),this.ObserverLite=new ObserverLite}subscribe(e){return this.ObserverLite.subscribe(e)}next(e){this.ObserverLite.next(e)}connectedCallback(){DomReadyPromise().then(async()=>{const e=this.getAttribute("key");if(!e)return;const t=new ObserverLite({key:"Global.filtersOrderData$"});let s=await t.once();if(s=s.find(t=>t.key===e),this.wrapper=this.querySelector(".js-collection-filter-sb-wrapper__items"),requestAnimationFrame(()=>{this.wrapper.scrollHeight>this.wrapper.clientHeight&&(this.toggle=this.querySelector(".js-collection-filter-sb-wrapper__toggle"),this.setAttribute("has_toggle",""),this.toggle?.addEventListener("click",()=>{this.toggleAttribute("open")}))}),!s)return;if(this.items=[...this.querySelectorAll("label[data-value]")],s.exclusions_male?.length||s.exclusions_female?.length){const e=new ObserverLite({key:"DataLayer.GlobalUXContext"}),t=(await e.once())?.settings?.context||"female",i="female"==t?s.exclusions_female:"male"==t?s.exclusions_male:[];this.items=this.items.filter(e=>{const t=!i?.includes(e.dataset.value);return t||e.remove(),t})}this.items.sort((e,t)=>{const i=e.dataset.value,n=t.dataset.value,o=s.order.indexOf(i),r=s.order.indexOf(n);return-1!==o&&-1!==r?o-r:-1===o&&-1===r?0:-1===o?1:-1}).forEach(e=>{this.wrapper.appendChild(e)})}).catch(e=>{console.log(e)})}}customElements.define("collection-filter-sb-wrapper",CollectionFilterSbWrapper);const m=self;for(var y in t)m[y]=t[y];t.__esModule&&Object.defineProperty(m,"__esModule",{value:!0})})();
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.