https://www.thewilloughbybookclub.co.uk/cdn/shop/t/35/assets/compo…?v=160254582486201099611784636123
1(()=>{"use strict";/** 2 * @license 3 * Copyright 2019 Google LLC 4 * SPDX-License-Identifier: BSD-3-Clause 5 */const css_tag_t=window,e=css_tag_t.ShadowRoot&&(css_tag_t.ShadyCSS===void 0||css_tag_t.ShadyCSS.nativeShadow)&&"adoptedStyleSheets"in Document.prototype&&"replace"in CSSStyleSheet.prototype,s=Symbol(),n=new WeakMap;class o{constructor(t2,e2,n2){if(this._$cssResult$=!0,n2!==s)throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");this.cssText=t2,this.t=e2}get styleSheet(){let t2=this.o;const s2=this.t;if(e&&t2===void 0){const e2=s2!==void 0&&s2.length===1;e2&&(t2=n.get(s2)),t2===void 0&&((this.o=t2=new CSSStyleSheet).replaceSync(this.cssText),e2&&n.set(s2,t2))}return t2}toString(){return this.cssText}}const r=t2=>new o(typeof t2=="string"?t2:t2+"",void 0,s),i=(t2,...e2)=>{const n2=t2.length===1?t2[0]:e2.reduce(((e3,s2,n3)=>e3+(t3=>{if(t3._$cssResult$===!0)return t3.cssText;if(typeof t3=="number")return t3;throw Error("Value passed to 'css' function must be a 'css' function result: "+t3+". Use 'unsafeCSS' to pass non-literal values, but take care to ensure page security.")})(s2)+t2[n3+1]),t2[0]);return new o(n2,t2,s)},S=(s2,n2)=>{e?s2.adoptedStyleSheets=n2.map((t2=>t2 instanceof CSSStyleSheet?t2:t2.styleSheet)):n2.forEach((e2=>{const n3=document.createElement("style"),o2=css_tag_t.litNonce;o2!==void 0&&n3.setAttribute("nonce",o2),n3.textContent=e2.cssText,s2.appendChild(n3)}))},c=e?t2=>t2:t2=>t2 instanceof CSSStyleSheet?(t3=>{let e2="";for(const s2 of t3.cssRules)e2+=s2.cssText;return r(e2)})(t2):t2;/** 6 * @license 7 * Copyright 2017 Google LLC 8 * SPDX-License-Identifier: BSD-3-Clause 9 */var reactive_element_s;const reactive_element_e=window,reactive_element_r=reactive_element_e.trustedTypes,h=reactive_element_r?reactive_element_r.emptyScript:"",reactive_element_o=reactive_element_e.reactiveElementPolyfillSupport,reactive_element_n={toAttribute(t2,i2){switch(i2){case Boolean:t2=t2?h:null;break;case Object:case Array:t2=t2==null?t2:JSON.stringify(t2)}return t2},fromAttribute(t2,i2){let s2=t2;switch(i2){case Boolean:s2=t2!==null;break;case Number:s2=t2===null?null:Number(t2);break;case Object:case Array:try{s2=JSON.parse(t2)}catch{s2=null}}return s2}},a=(t2,i2)=>i2!==t2&&(i2==i2||t2==t2),l={attribute:!0,type:String,converter:reactive_element_n,reflect:!1,hasChanged:a},d="finalized";class u extends HTMLElement{constructor(){super(),this._$Ei=new Map,this.isUpdatePending=!1,this.hasUpdated=!1,this._$El=null,this._$Eu()}static addInitializer(t2){var i2;this.finalize(),((i2=this.h)!==null&&i2!==void 0?i2:this.h=[]).push(t2)}static get observedAttributes(){this.finalize();const t2=[];return this.elementProperties.forEach(((i2,s2)=>{const e2=this._$Ep(s2,i2);e2!==void 0&&(this._$Ev.set(e2,s2),t2.push(e2))})),t2}static createProperty(t2,i2=l){if(i2.state&&(i2.attribute=!1),this.finalize(),this.elementProperties.set(t2,i2),!i2.noAccessor&&!this.prototype.hasOwnProperty(t2)){const s2=typeof t2=="symbol"?Symbol():"__"+t2,e2=this.getPropertyDescriptor(t2,s2,i2);e2!==void 0&&Object.defineProperty(this.prototype,t2,e2)}}static getPropertyDescriptor(t2,i2,s2){return{get(){return this[i2]},set(e2){const r2=this[t2];this[i2]=e2,this.requestUpdate(t2,r2,s2)},configurable:!0,enumerable:!0}}static getPropertyOptions(t2){return this.elementProperties.get(t2)||l}static finalize(){if(this.hasOwnProperty(d))return!1;this[d]=!0;const t2=Object.getPrototypeOf(this);if(t2.finalize(),t2.h!==void 0&&(this.h=[...t2.h]),this.elementProperties=new Map(t2.elementProperties),this._$Ev=new Map,this.hasOwnProperty("properties")){const t3=this.properties,i2=[...Object.getOwnPropertyNames(t3),...Object.getOwnPropertySymbols(t3)];for(const s2 of i2)this.createProperty(s2,t3[s2])}return this.elementStyles=this.finalizeStyles(this.styles),!0}static finalizeStyles(i2){const s2=[];if(Array.isArray(i2)){const e2=new Set(i2.flat(1/0).reverse());for(const i3 of e2)s2.unshift(c(i3))}else i2!==void 0&&s2.push(c(i2));return s2}static _$Ep(t2,i2){const s2=i2.attribute;return s2===!1?void 0:typeof s2=="string"?s2:typeof t2=="string"?t2.toLowerCase():void 0}_$Eu(){var t2;this._$E_=new Promise((t3=>this.enableUpdating=t3)),this._$AL=new Map,this._$Eg(),this.requestUpdate(),(t2=this.constructor.h)===null||t2===void 0||t2.forEach((t3=>t3(this)))}addController(t2){var i2,s2;
9((i2=this._$ES)!==null&&i2!==void 0?i2:this._$ES=[]).push(t2),this.renderRoot!==void 0&&this.isConnected&&((s2=t2.hostConnected)===null||s2===void 0||s2.call(t2))}removeController(t2){var i2;(i2=this._$ES)===null||i2===void 0||i2.splice(this._$ES.indexOf(t2)>>>0,1)}_$Eg(){this.constructor.elementProperties.forEach(((t2,i2)=>{this.hasOwnProperty(i2)&&(this._$Ei.set(i2,this[i2]),delete this[i2])}))}createRenderRoot(){var t2;const s2=(t2=this.shadowRoot)!==null&&t2!==void 0?t2:this.attachShadow(this.constructor.shadowRootOptions);return S(s2,this.constructor.elementStyles),s2}connectedCallback(){var t2;this.renderRoot===void 0&&(this.renderRoot=this.createRenderRoot()),this.enableUpdating(!0),(t2=this._$ES)===null||t2===void 0||t2.forEach((t3=>{var i2;return(i2=t3.hostConnected)===null||i2===void 0?void 0:i2.call(t3)}))}enableUpdating(t2){}disconnectedCallback(){var t2;(t2=this._$ES)===null||t2===void 0||t2.forEach((t3=>{var i2;return(i2=t3.hostDisconnected)===null||i2===void 0?void 0:i2.call(t3)}))}attributeChangedCallback(t2,i2,s2){this._$AK(t2,s2)}_$EO(t2,i2,s2=l){var e2;const r2=this.constructor._$Ep(t2,s2);if(r2!==void 0&&s2.reflect===!0){const h2=(((e2=s2.converter)===null||e2===void 0?void 0:e2.toAttribute)!==void 0?s2.converter:reactive_element_n).toAttribute(i2,s2.type);this._$El=t2,h2==null?this.removeAttribute(r2):this.setAttribute(r2,h2),this._$El=null}}_$AK(t2,i2){var s2;const e2=this.constructor,r2=e2._$Ev.get(t2);if(r2!==void 0&&this._$El!==r2){const t3=e2.getPropertyOptions(r2),h2=typeof t3.converter=="function"?{fromAttribute:t3.converter}:((s2=t3.converter)===null||s2===void 0?void 0:s2.fromAttribute)!==void 0?t3.converter:reactive_element_n;this._$El=r2,this[r2]=h2.fromAttribute(i2,t3.type),this._$El=null}}requestUpdate(t2,i2,s2){let e2=!0;t2!==void 0&&(((s2=s2||this.constructor.getPropertyOptions(t2)).hasChanged||a)(this[t2],i2)?(this._$AL.has(t2)||this._$AL.set(t2,i2),s2.reflect===!0&&this._$El!==t2&&(this._$EC===void 0&&(this._$EC=new Map),this._$EC.set(t2,s2))):e2=!1),!this.isUpdatePending&&e2&&(this._$E_=this._$Ej())}async _$Ej(){this.isUpdatePending=!0;try{await this._$E_}catch(t3){Promise.reject(t3)}const t2=this.scheduleUpdate();return t2!=null&&await t2,!this.isUpdatePending}scheduleUpdate(){return this.performUpdate()}performUpdate(){var t2;if(!this.isUpdatePending)return;this.hasUpdated,this._$Ei&&(this._$Ei.forEach(((t3,i3)=>this[i3]=t3)),this._$Ei=void 0);let i2=!1;const s2=this._$AL;try{i2=this.shouldUpdate(s2),i2?(this.willUpdate(s2),(t2=this._$ES)===null||t2===void 0||t2.forEach((t3=>{var i3;return(i3=t3.hostUpdate)===null||i3===void 0?void 0:i3.call(t3)})),this.update(s2)):this._$Ek()}catch(t3){throw i2=!1,this._$Ek(),t3}i2&&this._$AE(s2)}willUpdate(t2){}_$AE(t2){var i2;(i2=this._$ES)===null||i2===void 0||i2.forEach((t3=>{var i3;return(i3=t3.hostUpdated)===null||i3===void 0?void 0:i3.call(t3)})),this.hasUpdated||(this.hasUpdated=!0,this.firstUpdated(t2)),this.updated(t2)}_$Ek(){this._$AL=new Map,this.isUpdatePending=!1}get updateComplete(){return this.getUpdateComplete()}getUpdateComplete(){return this._$E_}shouldUpdate(t2){return!0}update(t2){this._$EC!==void 0&&(this._$EC.forEach(((t3,i2)=>this._$EO(i2,this[i2],t3))),this._$EC=void 0),this._$Ek()}updated(t2){}firstUpdated(t2){}}u[d]=!0,u.elementProperties=new Map,u.elementStyles=[],u.shadowRootOptions={mode:"open"},reactive_element_o?.({ReactiveElement:u}),((reactive_element_s=reactive_element_e.reactiveElementVersions)!==null&&reactive_element_s!==void 0?reactive_element_s:reactive_element_e.reactiveElementVersions=[]).push("1.6.3");/** 10 * @license 11 * Copyright 2017 Google LLC 12 * SPDX-License-Identifier: BSD-3-Clause 13 */var lit_html_t;const lit_html_i=window,lit_html_s=lit_html_i.trustedTypes,lit_html_e=lit_html_s?lit_html_s.createPolicy("lit-html",{createHTML:t2=>t2}):void 0,lit_html_o="$lit$",lit_html_n=`lit$${(Math.random()+"").slice(9)}$`,lit_html_l="?"+lit_html_n,lit_html_h=`<${lit_html_l}>`,lit_html_r=document,lit_html_u=()=>lit_html_r.createComment(""),lit_html_d=t2=>t2===null||typeof t2!="object"&&typeof t2!="function",lit_html_c=Array.isArray,v=t2=>lit_html_c(t2)||typeof t2?.[Symbol.iterator]=="function",lit_html_a=`[ 14\f\r]`,f=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,_=/-->/g,m=/>/g,p=RegExp(`>|${lit_html_a}(?:([^\\s"'>=/]+)(${lit_html_a}*=${lit_html_a}*(?:[^ 15\f\r"'\`<>=]|("|')|))|$)`,"g"),g=/'/g,$=/"/g,y=/^(?:script|style|textarea|title)$/i,w=t2=>(i2,...s2)=>({_$litType$:t2,strings:i2,values:s2}
vendor: 5,090 bytes, line 15
15),x=w(1),b=w(2),T=Symbol.for("lit-noChange"),A=Symbol.for("lit-nothing"),E=new WeakMap,C=lit_html_r.createTreeWalker(lit_html_r,129,null,!1);function P(t2,i2){if(!Array.isArray(t2)||!t2.hasOwnProperty("raw"))throw Error("invalid template strings array");return lit_html_e!==void 0?lit_html_e.createHTML(i2):i2}const V=(t2,i2)=>{const s2=t2.length-1,e2=[];let l2,r2=i2===2?"<svg>":"",u2=f;for(let i3=0;i3<s2;i3++){const s3=t2[i3];let d2,c2,v2=-1,a2=0;for(;a2<s3.length&&(u2.lastIndex=a2,c2=u2.exec(s3),c2!==null);)a2=u2.lastIndex,u2===f?c2[1]==="!--"?u2=_:c2[1]!==void 0?u2=m:c2[2]!==void 0?(y.test(c2[2])&&(l2=RegExp("</"+c2[2],"g")),u2=p):c2[3]!==void 0&&(u2=p):u2===p?c2[0]===">"?(u2=l2??f,v2=-1):c2[1]===void 0?v2=-2:(v2=u2.lastIndex-c2[2].length,d2=c2[1],u2=c2[3]===void 0?p:c2[3]==='"'?$:g):u2===$||u2===g?u2=p:u2===_||u2===m?u2=f:(u2=p,l2=void 0);const w2=u2===p&&t2[i3+1].startsWith("/>")?" ":"";r2+=u2===f?s3+lit_html_h:v2>=0?(e2.push(d2),s3.slice(0,v2)+lit_html_o+s3.slice(v2)+lit_html_n+w2):s3+lit_html_n+(v2===-2?(e2.push(void 0),i3):w2)}return[P(t2,r2+(t2[s2]||"<?>")+(i2===2?"</svg>":"")),e2]};class N{constructor({strings:t2,_$litType$:i2},e2){let h2;this.parts=[];let r2=0,d2=0;const c2=t2.length-1,v2=this.parts,[a2,f2]=V(t2,i2);if(this.el=N.createElement(a2,e2),C.currentNode=this.el.content,i2===2){const t3=this.el.content,i3=t3.firstChild;i3.remove(),t3.append(...i3.childNodes)}for(;(h2=C.nextNode())!==null&&v2.length<c2;){if(h2.nodeType===1){if(h2.hasAttributes()){const t3=[];for(const i3 of h2.getAttributeNames())if(i3.endsWith(lit_html_o)||i3.startsWith(lit_html_n)){const s2=f2[d2++];if(t3.push(i3),s2!==void 0){const t4=h2.getAttribute(s2.toLowerCase()+lit_html_o).split(lit_html_n),i4=/([.?@])?(.*)/.exec(s2);v2.push({type:1,index:r2,name:i4[2],strings:t4,ctor:i4[1]==="."?H:i4[1]==="?"?L:i4[1]==="@"?z:k})}else v2.push({type:6,index:r2})}for(const i3 of t3)h2.removeAttribute(i3)}if(y.test(h2.tagName)){const t3=h2.textContent.split(lit_html_n),i3=t3.length-1;if(i3>0){h2.textContent=lit_html_s?lit_html_s.emptyScript:"";for(let s2=0;s2<i3;s2++)h2.append(t3[s2],lit_html_u()),C.nextNode(),v2.push({type:2,index:++r2});h2.append(t3[i3],lit_html_u())}}}else if(h2.nodeType===8)if(h2.data===lit_html_l)v2.push({type:2,index:r2});else{let t3=-1;for(;(t3=h2.data.indexOf(lit_html_n,t3+1))!==-1;)v2.push({type:7,index:r2}),t3+=lit_html_n.length-1}r2++}}static createElement(t2,i2){const s2=lit_html_r.createElement("template");return s2.innerHTML=t2,s2}}function lit_html_S(t2,i2,s2=t2,e2){var o2,n2,l2,h2;if(i2===T)return i2;let r2=e2!==void 0?(o2=s2._$Co)===null||o2===void 0?void 0:o2[e2]:s2._$Cl;const u2=lit_html_d(i2)?void 0:i2._$litDirective$;return r2?.constructor!==u2&&((n2=r2?._$AO)===null||n2===void 0||n2.call(r2,!1),u2===void 0?r2=void 0:(r2=new u2(t2),r2._$AT(t2,s2,e2)),e2!==void 0?((l2=(h2=s2)._$Co)!==null&&l2!==void 0?l2:h2._$Co=[])[e2]=r2:s2._$Cl=r2),r2!==void 0&&(i2=lit_html_S(t2,r2._$AS(t2,i2.values),r2,e2)),i2}class M{constructor(t2,i2){this._$AV=[],this._$AN=void 0,this._$AD=t2,this._$AM=i2}get parentNode(){return this._$AM.parentNode}get _$AU(){return this._$AM._$AU}u(t2){var i2;const{el:{content:s2},parts:e2}=this._$AD,o2=((i2=t2?.creationScope)!==null&&i2!==void 0?i2:lit_html_r).importNode(s2,!0);C.currentNode=o2;let n2=C.nextNode(),l2=0,h2=0,u2=e2[0];for(;u2!==void 0;){if(l2===u2.index){let i3;u2.type===2?i3=new R(n2,n2.nextSibling,this,t2):u2.type===1?i3=new u2.ctor(n2,u2.name,u2.strings,this,t2):u2.type===6&&(i3=new Z(n2,this,t2)),this._$AV.push(i3),u2=e2[++h2]}l2!==u2?.index&&(n2=C.nextNode(),l2++)}return C.currentNode=lit_html_r,o2}v(t2){let i2=0;for(const s2 of this._$AV)s2!==void 0&&(s2.strings!==void 0?(s2._$AI(t2,s2,i2),i2+=s2.strings.length-2):s2._$AI(t2[i2])),i2++}}class R{constructor(t2,i2,s2,e2){var o2;this.type=2,this._$AH=A,this._$AN=void 0,this._$AA=t2,this._$AB=i2,this._$AM=s2,this.options=e2,this._$Cp=(o2=e2?.isConnected)===null||o2===void 0||o2}get _$AU(){var t2,i2;return(i2=(t2=this._$AM)===null||t2===void 0?void 0:t2._$AU)!==null&&i2!==void 0?i2:this._$Cp}get parentNode(){let t2=this._$AA.parentNode;const i2=this._$AM;return i2!==void 0&&t2?.nodeType===11&&(t2=i2.parentNode),t2}get startNode(){return this._$AA}get endNode(){return this._$AB}_$AI(t2,i2=this){t2=lit_html_S(this,t2,i2),lit_html_d(t2)?t2===A||t2==null||t2===""?(this._$AH!==A&&this._$AR(),this._$AH=A):t2!==this._$AH&&t2!==T&&this._(t2):t2._$litType$!==void 0?this.g(t2):t2.nodeType!==void 0?this.$(t2):v(t2)?this.T(t2):this._(t2)}k(t2){return this._$AA.parentNode.insertBefore(t2,this._$AB)}$(t2){this._$AH!==t2&&(this._$AR(),this._$AH=this.k(t2))}_(t2){this._$AH!==A&&lit_html_d(this._$AH)?this._$AA.nextSibling.data=t2:this.$(lit_html_r.createTextNode(t2)),this._$AH=t2}g(t2){var i2;const{values:s2,_$litType$:e2}=t2,o2=typeof e2=="number"?this._$AC(t2):(e2.el===void 0&&(e2.el=N.createElement(P(e2.h,e2.h[0]),this.options)),e2);if(((i2=this._$AH)===null||i2===void 0?void 0:i2._$AD)===o2)this._$AH.v(s2);else{const t3=new M(o2,this),i3=t3.u(this.options);t3.v(s2),this.$(i3),this._$AH=t3}}_$AC(t2){let i2=E.get(t2.strings);
vendor: 5,106 bytes, lines 15-27
15return i2===void 0&&E.set(t2.strings,i2=new N(t2)),i2}T(t2){lit_html_c(this._$AH)||(this._$AH=[],this._$AR());const i2=this._$AH;let s2,e2=0;for(const o2 of t2)e2===i2.length?i2.push(s2=new R(this.k(lit_html_u()),this.k(lit_html_u()),this,this.options)):s2=i2[e2],s2._$AI(o2),e2++;e2<i2.length&&(this._$AR(s2&&s2._$AB.nextSibling,e2),i2.length=e2)}_$AR(t2=this._$AA.nextSibling,i2){var s2;for((s2=this._$AP)===null||s2===void 0||s2.call(this,!1,!0,i2);t2&&t2!==this._$AB;){const i3=t2.nextSibling;t2.remove(),t2=i3}}setConnected(t2){var i2;this._$AM===void 0&&(this._$Cp=t2,(i2=this._$AP)===null||i2===void 0||i2.call(this,t2))}}class k{constructor(t2,i2,s2,e2,o2){this.type=1,this._$AH=A,this._$AN=void 0,this.element=t2,this.name=i2,this._$AM=e2,this.options=o2,s2.length>2||s2[0]!==""||s2[1]!==""?(this._$AH=Array(s2.length-1).fill(new String),this.strings=s2):this._$AH=A}get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}_$AI(t2,i2=this,s2,e2){const o2=this.strings;let n2=!1;if(o2===void 0)t2=lit_html_S(this,t2,i2,0),n2=!lit_html_d(t2)||t2!==this._$AH&&t2!==T,n2&&(this._$AH=t2);else{const e3=t2;let l2,h2;for(t2=o2[0],l2=0;l2<o2.length-1;l2++)h2=lit_html_S(this,e3[s2+l2],i2,l2),h2===T&&(h2=this._$AH[l2]),n2||(n2=!lit_html_d(h2)||h2!==this._$AH[l2]),h2===A?t2=A:t2!==A&&(t2+=(h2??"")+o2[l2+1]),this._$AH[l2]=h2}n2&&!e2&&this.j(t2)}j(t2){t2===A?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,t2??"")}}class H extends k{constructor(){super(...arguments),this.type=3}j(t2){this.element[this.name]=t2===A?void 0:t2}}const I=lit_html_s?lit_html_s.emptyScript:"";class L extends k{constructor(){super(...arguments),this.type=4}j(t2){t2&&t2!==A?this.element.setAttribute(this.name,I):this.element.removeAttribute(this.name)}}class z extends k{constructor(t2,i2,s2,e2,o2){super(t2,i2,s2,e2,o2),this.type=5}_$AI(t2,i2=this){var s2;if((t2=(s2=lit_html_S(this,t2,i2,0))!==null&&s2!==void 0?s2:A)===T)return;const e2=this._$AH,o2=t2===A&&e2!==A||t2.capture!==e2.capture||t2.once!==e2.once||t2.passive!==e2.passive,n2=t2!==A&&(e2===A||o2);o2&&this.element.removeEventListener(this.name,this,e2),n2&&this.element.addEventListener(this.name,this,t2),this._$AH=t2}handleEvent(t2){var i2,s2;typeof this._$AH=="function"?this._$AH.call((s2=(i2=this.options)===null||i2===void 0?void 0:i2.host)!==null&&s2!==void 0?s2:this.element,t2):this._$AH.handleEvent(t2)}}class Z{constructor(t2,i2,s2){this.element=t2,this.type=6,this._$AN=void 0,this._$AM=i2,this.options=s2}get _$AU(){return this._$AM._$AU}_$AI(t2){lit_html_S(this,t2)}}const j={O:lit_html_o,P:lit_html_n,A:lit_html_l,C:1,M:V,L:M,R:v,D:lit_html_S,I:R,V:k,H:L,N:z,U:H,F:Z},B=lit_html_i.litHtmlPolyfillSupport;B?.(N,R),((lit_html_t=lit_html_i.litHtmlVersions)!==null&&lit_html_t!==void 0?lit_html_t:lit_html_i.litHtmlVersions=[]).push("2.8.0");const D=(t2,i2,s2)=>{var e2,o2;const n2=(e2=s2?.renderBefore)!==null&&e2!==void 0?e2:i2;let l2=n2._$litPart$;if(l2===void 0){const t3=(o2=s2?.renderBefore)!==null&&o2!==void 0?o2:null;n2._$litPart$=l2=new R(i2.insertBefore(lit_html_u(),t3),t3,void 0,s2??{})}return l2._$AI(t2),l2};/** 16 * @license 17 * Copyright 2017 Google LLC 18 * SPDX-License-Identifier: BSD-3-Clause 19 */var lit_element_l,lit_element_o;const lit_element_r=null;class lit_element_s extends u{constructor(){super(...arguments),this.renderOptions={host:this},this._$Do=void 0}createRenderRoot(){var t2,e2;const i2=super.createRenderRoot();return(t2=(e2=this.renderOptions).renderBefore)!==null&&t2!==void 0||(e2.renderBefore=i2.firstChild),i2}update(t2){const i2=this.render();this.hasUpdated||(this.renderOptions.isConnected=this.isConnected),super.update(t2),this._$Do=D(i2,this.renderRoot,this.renderOptions)}connectedCallback(){var t2;super.connectedCallback(),(t2=this._$Do)===null||t2===void 0||t2.setConnected(!0)}disconnectedCallback(){var t2;super.disconnectedCallback(),(t2=this._$Do)===null||t2===void 0||t2.setConnected(!1)}render(){return T}}lit_element_s.finalized=!0,lit_element_s._$litElement$=!0,(lit_element_l=globalThis.litElementHydrateSupport)===null||lit_element_l===void 0||lit_element_l.call(globalThis,{LitElement:lit_element_s});const lit_element_n=globalThis.litElementPolyfillSupport;lit_element_n?.({LitElement:lit_element_s});const lit_element_h={_$AK:(t2,e2,i2)=>{t2._$AK(e2,i2)},_$AL:t2=>t2._$AL};((lit_element_o=globalThis.litElementVersions)!==null&&lit_element_o!==void 0?lit_element_o:globalThis.litElementVersions=[]).push("3.3.3");/** 20 * @license 21 * Copyright 2017 Google LLC 22 * SPDX-License-Identifier: BSD-3-Clause 23 */const directive_t={ATTRIBUTE:1,CHILD:2,PROPERTY:3,BOOLEAN_ATTRIBUTE:4,EVENT:5,ELEMENT:6},directive_e=t2=>(...e2)=>({_$litDirective$:t2,values:e2});class directive_i{constructor(t2){}get _$AU(){return this._$AM._$AU}_$AT(t2,e2,i2){this._$Ct=t2,this._$AM=e2,this._$Ci=i2}_$AS(t2,e2){return this.update(t2,e2)}update(t2,e2){return this.render(...e2)}}/** 24 * @license 25 * Copyright 2017 Google LLC 26 * SPDX-License-Identifier: BSD-3-Clause 27 */class unsafe_html_e extends directive_i{constructor(i2){if(super(i2),this.et=A,i2.type!==directive_t.CH
27ILD)throw Error(this.constructor.directiveName+"() can only be used in child bindings")}render(r2){if(r2===A||r2==null)return this.ft=void 0,this.et=r2;if(r2===T)return r2;if(typeof r2!="string")throw Error(this.constructor.directiveName+"() called with a non-string value");if(r2===this.et)return this.ft;this.et=r2;const s2=[r2];return s2.raw=s2,this.ft={_$litType$:this.constructor.resultType,strings:s2,values:[]}}}unsafe_html_e.directiveName="unsafeHTML",unsafe_html_e.resultType=1;const unsafe_html_o=directive_e(unsafe_html_e);/** 28 * @license 29 * Copyright 2017 Google LLC 30 * SPDX-License-Identifier: BSD-3-Clause 31 */class unsafe_svg_t extends unsafe_html_e{}unsafe_svg_t.directiveName="unsafeSVG",unsafe_svg_t.resultType=2;const unsafe_svg_o=directive_e(unsafe_svg_t);/** 32 * @license 33 * Copyright 2018 Google LLC 34 * SPDX-License-Identifier: BSD-3-Clause 35 */const class_map_o=directive_e(class extends directive_i{constructor(t2){var i2;if(super(t2),t2.type!==directive_t.ATTRIBUTE||t2.name!=="class"||((i2=t2.strings)===null||i2===void 0?void 0:i2.length)>2)throw Error("`classMap()` can only be used in the `class` attribute and must be the only part in the attribute.")}render(t2){return" "+Object.keys(t2).filter((i2=>t2[i2])).join(" ")+" "}update(i2,[s2]){var r2,o2;if(this.it===void 0){this.it=new Set,i2.strings!==void 0&&(this.nt=new Set(i2.strings.join(" ").split(/\s/).filter((t2=>t2!==""))));for(const t2 in s2)s2[t2]&&!(!((r2=this.nt)===null||r2===void 0)&&r2.has(t2))&&this.it.add(t2);return this.render(s2)}const e2=i2.element.classList;this.it.forEach((t2=>{t2 in s2||(e2.remove(t2),this.it.delete(t2))}));for(const t2 in s2){const i3=!!s2[t2];i3===this.it.has(t2)||!((o2=this.nt)===null||o2===void 0)&&o2.has(t2)||(i3?(e2.add(t2),this.it.add(t2)):(e2.remove(t2),this.it.delete(t2)))}return T}});function throttle(callback,interval){let enableCall=!0,calledWhenDisabled=!1;return(...args)=>{const onTimeout=()=>{calledWhenDisabled?(callback.apply(this,args),setTimeout(onTimeout,interval)):enableCall=!0,calledWhenDisabled=!1};if(!enableCall){calledWhenDisabled=!0;return}enableCall=!1,callback.apply(this,args),setTimeout(onTimeout,interval)}}function formatMoney(cents,format){var moneyFormat=format||"${{amount}}";typeof cents=="string"&&(cents=cents.replace(".",""));var value="",placeholderRegex=/\{\{\s*(\w+)\s*\}\}/,formatString=moneyFormat;function formatWithDelimiters(number,precision,thousands,decimal){if(precision==null&&(precision=2),thousands=thousands||",",decimal=decimal||".",isNaN(number)||number==null)return"0";number=(number/100).toFixed(precision);var parts=number.split("."),dollarsAmount=parts[0].replace(/(\d)(?=(\d{3})+(?!\d))/g,"$1"+thousands),centsAmount=parts[1]?decimal+parts[1]:"";return dollarsAmount+centsAmount}var match=formatString.match(placeholderRegex);if(!match)throw new Error(`Invalid format string: '${formatString}'. Expected '{{amount}}' or similar placeholders.`);switch(match[1]){case"amount":value=formatWithDelimiters(cents,2);break;case"amount_no_decimals":value=formatWithDelimiters(cents,0);break;case"amount_with_comma_separator":value=formatWithDelimiters(cents,2,".",",");break;case"amount_with_space_separator":value=formatWithDelimiters(cents,2," ",",");break;case"amount_no_decimals_with_comma_separator":value=formatWithDelimiters(cents,0,".",",");break;case"amount_no_decimals_with_space_separator":value=formatWithDelimiters(cents,0," ");break;default:throw new Error(`Unknown format type: ${match[1]}`)}return formatString.replace(placeholderRegex,value)}class FocusTrap{constructor(container,initialElement=null,onEscape=null){this.container=container,this.initialElement=initialElement,this.onEscape=onEscape,this.focusableElements=[],this.firstElement=null,this.lastElement=null,this.handleKeyDown=this.handleKeyDown.bind(this),this.updateFocusableElements=this.updateFocusableElements.bind(this),this.observer=new MutationObserver(this.updateFocusableElements),this.init()}init(){this.container&&(this.container.removeAttribute("inert"),this.updateFocusableElements(),this.initialElement&&this.isFocusable(this.initialElement)?this.initialElement.focus():this.firstElement&&this.firstElement.focus(),this.container.addEventListener("keydown",this.handleKeyDown),this.observer.observe(this.container,{childList:!0,subtree:!0,attributes:!0}))}isFocusable(el){return el?el.offsetParent!==null&&el.getAttribute("tabindex")!=="-1"&&!this.isInsideClosedDetails(el):!1}isInsideClosedDetails(el){let parent=el.parentElement;for(;parent;){if(parent.tagName.toLowerCase()==="details"&&!parent.hasAttribute("open"))return!(el.tagName.toLowerCase()==="summary"&&parent.querySelector("summary")===el);parent=parent.parentElement}return!1}updateFocusableElements(){this.focusableElements=Array.from(this.container.querySelectorAll('a[href], area[href], input
35:not([type=hidden]), select, textarea, button:not([disabled]), iframe, object, embed, [tabindex]:not([tabindex="-1"]), [contenteditable], summary')).filter(el=>this.isFocusable(el)),this.focusableElements.length>0?(this.firstElement=this.focusableElements[0],this.lastElement=this.focusableElements[this.focusableElements.length-1]):(this.firstElement=null,this.lastElement=null,console.warn("No focusable elements found within the container."))}handleKeyDown(e2){if(e2.key==="Tab"){if(this.focusableElements.length===0){e2.preventDefault();return}e2.shiftKey?document.activeElement===this.firstElement&&(e2.preventDefault(),this.lastElement.focus()):document.activeElement===this.lastElement&&(e2.preventDefault(),this.firstElement.focus())}else e2.key==="Escape"&&this.onEscape&&this.onEscape()}destroy(){this.container.setAttribute("inert",""),this.container.removeEventListener("keydown",this.handleKeyDown),this.observer.disconnect()}}class CartManager{constructor(){this.cartType=document.getElementById("PageContainer")?.dataset.cartType,this.cartAction=document.getElementById("PageContainer")?.dataset.cartAction,this.languageUrl=document.getElementById("PageContainer")?.dataset.languageUrl,this.cartCountIndicator=document.querySelector("[data-cart-count-indicator]"),this.wethemeGlobal=document.querySelector("script#wetheme-global"),this.translations=this.wethemeGlobal?JSON.parse(this.wethemeGlobal.textContent).translations:{}}async addSingleProduct(formOrData,button,options={}){let variantId,quantity=1;if(formOrData instanceof HTMLFormElement){const formData=new FormData(formOrData);variantId=formData.get("id"),quantity=parseInt(formData.get("quantity")||"1",10)}else formOrData instanceof FormData?(variantId=formOrData.get("id"),quantity=parseInt(formOrData.get("quantity")||"1",10)):typeof formOrData=="object"&&(variantId=formOrData.id||formOrData.variantId,quantity=formOrData.quantity||1);if(!variantId)throw new Error("No variant ID provided");const items=[{id:parseInt(variantId,10),quantity}];return this.addItemsToCart(items,button,options)}async addMultipleProducts(items,button,options={}){if(!Array.isArray(items)||items.length===0)throw new Error("No items provided or invalid items array");return this.addItemsToCart(items,button,options)}async addItemsToCart(items,button,options={}){button&&this.showLoadingState(button);try{const response=await this.performBulkAdd(items);if(response.ok)return await this.handleSuccess(button,response,options),response;if(response.status===422){console.warn("Bulk add failed due to inventory constraints, trying individual adds...");const individualResponse=await this.addItemsIndividually(items);return await this.handleSuccess(button,individualResponse,options),individualResponse}else{const errorData=await response.json();throw new Error(errorData.description||"Failed to add items to cart")}}catch(error){console.warn("Bulk add failed, trying individual adds...",error);try{const individualResponse=await this.addItemsIndividually(items);return await this.handleSuccess(button,individualResponse,options),individualResponse}catch(individualError){throw button&&this.hideLoadingState(button),individualError}}}async performBulkAdd(items){const payload={items};this.cartType==="drawer"&&(payload.sections="cart-drawer");const config={method:"POST",headers:{"Content-Type":"application/json",Accept:"application/json"},body:JSON.stringify(payload)};return fetch(window.routes.cart_add_url,config)}async addItemsIndividually(items){let lastSuccessfulResponse=null,successfullyAdded=0,skippedItems=0;for(const item of items)try{const payload={items:[item]};this.cartType==="drawer"&&(payload.sections="cart-drawer");const config={method:"POST",headers:{"Content-Type":"application/json",Accept:"application/json"},body:JSON.stringify(payload)},response=await fetch(window.routes.cart_add_url,config);if(response.ok)successfullyAdded++,lastSuccessfulResponse=response;else if(response.status===422)skippedItems++,console.warn(`Skipping item ${item.id} due to inventory constraints`);else{const errorData=await response.json();console.error(`Failed to add item ${item.id}:`,errorData.description||"Unknown error"),skippedItems++}}catch(error){console.error(`Error adding item ${item.id}:`,error),skippedItems++}if(successfullyAdded===0)throw new Error("No items could be added to cart");return skippedItems>0&&console.info(`Successfully added ${successfullyAdded} items, skipped ${skippedItems} items due to inventory or other issues`),lastSuccessfulResponse||{ok:!0,status:200}}async handleSuccess(button,response,options={}){if(button&&this.hideLoadingState(button),this.cartType==="drawer"&&response&&response.ok)try{const responseJson=await response.clone().json();this.updateCartDrawer(responseJson)}catch(error){console.warn("Could not parse response for cart drawer update:",error)}window.eventBus&&options.sectionId&&window.eventBus.emit("cart:added",{sectionId:options.sectionId}),button?this.handleCartAction(button):this.updateCartCountIndicator()}updateCartDrawer(responseJson){window.eventBus&&window.eventBus.emit("update:cart:drawer",responseJson)}handleCartAction(button){this.cartType==="drawer"?this.cartAction==="show_added_message"?(this.showAddedMessage(button),this.updateCartCountIndicator()):this.cartAction==="go_to_or_open_cart"&&(window.eventBus&&window.eventBus.emit("open:cart:drawer",{scrollToTop:!0}),this.updateCartCountIndicator()):this.cartAction==="show_added_message"?(this.showAddedMessage(button),this.updateCartCountIndicator()):window.location=window.routes.cart_url}showAddedMessage(button){const addedTranslation=this.translations.added,buttonText=button.querySelector("[data-button-text]"),addedText=button.querySelector("[data-cart-added-text]");if(buttonText&&addedText)buttonText.style.visibility="hidden",addedText.style.display="block",setTimeout(()=>{addedText.style.display="none",buttonText.style.visibility="",button.disabled=!1},2e3);else if(buttonText){buttonText.style.visibility="hidden";const tempAddedText=document.createElement("span");tempAddedText.textContent=addedTranslation,tempAddedText.style.gridColumn="1",tempAddedText.style.gridRow="1",tempAddedText.classList.add("temp-added-text"),button.appendChild(tempAddedText),setTimeout(()=>{buttonText.style.visibility="",tempAddedText.remove(),button.disabled=!1},2e3)}else{const originalHTML=button.dataset.originalText||button.innerHTML,originalContent=button.innerHTML;button.innerHTML="";const hiddenContent=document.createElement("span");hiddenContent.innerHTML=originalContent,hiddenContent.style.visibility="hidden",hiddenContent.style.gridColumn="1",hiddenContent.style.gridRow="1";
35const addedContent=document.createElement("span");addedContent.textContent=addedTranslation,addedContent.style.gridColumn="1",addedContent.style.gridRow="1",addedContent.classList.add("temp-added-text"),button.appendChild(hiddenContent),button.appendChild(addedContent),setTimeout(()=>{button.innerHTML=originalHTML,button.disabled=!1},2e3)}}async updateCartCountIndicator(){if(this.cartCountIndicator)try{const languageParam=!this.languageUrl||this.languageUrl==="/"?"":this.languageUrl,cart=await(await fetch(`${languageParam}/cart?view=compare`)).json();window.wetheme?.updateCartCount&&window.wetheme.updateCartCount(cart)}catch(error){console.error("Error updating cart count:",error)}}showLoadingState(button){button.disabled=!0,button.classList.add("loading");const buttonText=button.querySelector("[data-button-text]"),loadingIcon=button.querySelector("[data-loading-icon]");buttonText&&loadingIcon?(buttonText.style.visibility="hidden",loadingIcon.classList.remove("hidden")):(button.dataset.originalText||(button.dataset.originalText=button.textContent),button.innerHTML='<svg viewBox="0 0 25 24" fill="none" xmlns="http://www.w3.org/2000/svg" width="1.6em" height="1.6em" class="spin flex-full"><g clip-path="url(#clip0_3605_47041)"><path d="M12.5 23C6.42487 23 1.5 18.0751 1.5 12C1.5 5.92487 6.42487 1 12.5 1C18.5751 1 23.5 5.92487 23.5 12C23.5 15.1767 22.1534 18.0388 20 20.0468" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/></g><defs><clipPath id="clip0_3605_47041"><rect width="24" height="24" fill="none" transform="translate(0.5)"/></clipPath></defs></svg>')}hideLoadingState(button){button.disabled=!1,button.classList.remove("loading");const buttonText=button.querySelector("[data-button-text]"),loadingIcon=button.querySelector("[data-loading-icon]");buttonText&&loadingIcon?(buttonText.style.visibility="",loadingIcon.classList.add("hidden")):button.dataset.originalText&&(button.innerHTML=button.dataset.originalText)}}class ProductCrossSell extends lit_element_s{static get styles(){return i` 36 :host { 37 display: block; 38 display: flex; 39 flex-direction: columns; 40 width: 100%; 41 } 42 43 .grid__image div.aspect-ratio--natural { 44 display: flex; 45 } 46 47 .featured-image { 48 width: 100%; 49 height: auto; 50 } 51 52 svg.icon.icon--placeholder { 53 background: #969696; /* in line with img placeholder color */ 54 fill: #5D5D5D; /* in line with img placeholder color */ 55 border: 1px solid #858585; /* in line with img placeholder color */ 56 } 57 58 .info { 59 display: flex; 60 flex-direction: column; 61 justify-content: space-between; 62 flex: 1; 63 row-gap: 15px; 64 } 65 66 .info.vertical { 67 flex-direction: column; 68 } 69 70 .product-info { 71 width: 100%; 72 } 73 74 .title { 75 display: inline; 76 padding: 0 0 5px 0; 77 font-size: var(--base-font-size); 78 line-height: 1.6; 79 color: var(--text-color); 80 font-family: var(--body-font-stack); 81 font-weight: var(--body-font-weight); 82 font-style: var(--body-font-style); 83 } 84 85 .title a { 86 color: var(--text-color); 87 text-decoration: none; 88 word-wrap: break-word; 89 word-break: break-word; 90 } 91 92 .price { 93 font-family: var(--header-font-stack); 94 font-weight: var(--header-font-weight); 95 font-style: var(--header-font-style); 96 text-transform: var(--heading-font-case); 97 } 98 99 .price a { 100 text-decoration: none; 101 color: var(--text-color); 102 } 103 104 .price a .icon { 105 display: inline-block; 106 margin-right: 5px; 107 } 108 109 .price .price-line-through { 110 text-decoration: line-through; 111 } 112 113 .price .money.sale-price { 114 color: var(--text-color); 115 opacity: .4; 116 padding-right: 5px; 117 } 118 119 .price .money:not(.sale-price):not(.price-line-through) { 120 color: var(--text-color); 121 } 122 123 .money.sale-price+.money:not(.sale-price):not(.price-line-through) { 124 color: var(--on-sale-color); 125 } 126 127 .buttons { 128 flex-shrink: 0; 129 padding-left: 15px; 130 display: flex; 131 align-items: flex-end; 132 padding-bottom: 1px; 133 } 134 135 .product-image { 136 width: 90px; 137 padding-right: 15px; 138 } 139 140 .product-image .grid__image { 141 display: block; 142 margin: 0 auto; 143 clip-path: inset(0 round var(--thumbnail-border-radius)); 144 } 145
146 .aspect-ratio:not(.aspect-ratio--natural) { 147 position: relative; 148 margin-left: auto; 149 margin-right: auto; 150 } 151 152 .aspect-ratio.aspect-ratio--square { 153 padding-bottom: 100%; 154 } 155 156 .aspect-ratio.aspect-ratio--tall { 157 padding-bottom: 150%; 158 } 159 160 .aspect-ratio.aspect-ratio--wide { 161 padding-bottom: 75%; 162 } 163 164 .aspect-ratio:not(.aspect-ratio--natural) img, 165 .aspect-ratio:not(.aspect-ratio--natural) svg { 166 width: 100%; 167 height: 100%; 168 -o-object-fit: cover; 169 object-fit: cover; 170 position: absolute; 171 left: 50%; 172 top: 50%; 173 transform: translate(-50%,-50%); 174 } 175 176 @media only screen and (max-width: 989px) { 177 .info .product-info { 178 width: 100%; 179 padding-right: 0; 180 } 181 182 .buttons { 183 padding-left: 0; 184 } 185 186 .buttons button.text-link-animated, 187 .buttons a.text-link-animated { 188 margin-left: 0; 189 } 190 } 191 192 button.disabled { 193 pointer-events: none; 194 } 195 196 button.unavailable { 197 opacity: .50; 198 pointer-events: none; 199 } 200 201 .lds-dual-ring { 202 display: inline-block; 203 width: 15px; 204 height: 15px; 205 } 206 207 .lds-dual-ring:after { 208 content: " "; 209 display: block; 210 width: 15px; 211 height: 15px; 212 border-radius: 50%; 213 border: 3px solid #000; 214 border-color: var(--text-color) transparent var(--text-color) transparent; 215 animation: lds-dual-ring 1.2s linear infinite; 216 } 217 218 @keyframes lds-dual-ring { 219 0% { 220 transform: rotate(0deg); 221 } 222 223 100% { 224 transform: rotate(360deg); 225 } 226 } 227 228 button.text-link-animated .cross-sells__button-label, 229 a.text-link-animated .cross-sells__button-label { 230 display: inline-flex; 231 text-decoration: none; 232 padding-bottom: 2px; 233 position: relative; 234 background: linear-gradient(to top, var(--text-color-transparent5) 0, var(--text-color-transparent5) 0), linear-gradient(to top, currentColor 0, currentColor 0); 235 background-size: 100% 0.1em, 0 0.1em; 236 background-position: 100% 100%, 0 100%; 237 background-repeat: no-repeat; 238 transition-property: background-size; 239 transition-timing-function: ease; 240 transition-duration: .25s; 241 text-transform: var(--button-text-case); 242 243 &:hover, 244 &:focus { 245 background-size: 0 0.1em, 100% 0.1em; 246 } 247 248 .cross-sells__button-label--content { 249 display: inline-flex; 250 gap: 10px; 251 252 svg { 253 display: block; 254 } 255 } 256 } 257 258 a.text-link-animated .cross-sells__button-label .text { 259 line-height: normal; 260 } 261 262 .cross-sells__button-label--content .icon { 263 display: flex; 264 align-items: center; 265 color: currentColor; 266 } 267 268 .cross-sells__button-label--content .icon svg { 269 min-width: 16px; 270 min-height: 16px; 271 max-width: 16px; 272 max-height: 16px; 273 width: 16px; 274 height: 16px; 275 display: inline-block; 276 margin: 0; 277 } 278 279 button.text-link-animated, 280 a.text-link-animated { 281 display: block; 282 cursor: pointer; 283 margin-left: auto; 284 letter-spacing: var(--button-text-spacing-px); 285 font-size: var(--button-font-size-px); 286 text-transform: var(--button-text-case); 287 height: 18px; 288 color: var(--text-color); 289 border: none; 290 background: 0 0; 291 font-family: var(--body-font-stack); 292 font-weight: var(--body-font-weight); 293 font-style: var(--body-font-style); 294 padding: 0; 295 } 296 297 .sr-only { 298 position: absolute; 299 left: -10000px; 300 top: auto; 301 width: 1px; 302 height: 1px; 303 overflow: hidden; 304 } 305 306 select { 307 appearance: none; 308 background-color: transparent; 309 border: none; 310 padding: 6px 1em 6px 6px; 311 margin: 0; 312 width: 100%; 313 font-family: inherit; 314 font-size: 0.85rem; 315 cursor: inherit; 316 line-height: inherit; 317 outline: none; 318 border: 1px solid var(--border-color); 319 } 320 321 .not-available { 322 font-weight: bold; 323 text-align: center; 324 padding: 2px 6px; 325 margin-bottom: 8px; 326 opacity: 0.6; 327 border: 1px solid var(--border-color); 328 width: 100%; 329 } 330 331 .select-wrapper { 332 position: relative; 333 margin-top: 8px; 334 } 335 336 .select-wrapper button { 337 text-align: left; 338 border: 1px solid var(--border-color); 339 border-radius: var(--input-border-radius); 340 padding: 8px 36px 8px 10px; 341 position: relative; 342 background: none; 343 min-width: 100%; 344 z-index: 1; 345 font-size: var(--base-font-size); 346 font-family: var(--body-font-stack); 347 font-weight: var(--body-font-weight); 348 font-style: var(--body-font-style); 349 display: grid; 350 cursor: pointer; 351 line-height: 1.6; 352 } 353 354 .select-wrapper--borders-round button { 355 padding-left: 15px; 356 } 357 358 .select-wrapper button span { 359 overflow: hidden; 360 width: 100%; 361 color: var(--text-color); 362 } 363 364 .select-wrapper button .icon { 365 position: absolute; 366 width: auto; 367 display: flex; 368 height: 100%; 369 right: 0; 370 align-items: center; 371 color: currentColor; 372 } 373 374 .select-wrapper button .chevron { 375 min-width: 16px; 376 min-height: 16px; 377 max-width: 16px; 378 max-height: 16px; 379 width: 16px; 380 height: 16px; 381 display: inline-block; 382 margin-right: 10px; 383 margin-left: 10px; 384 } 385 386 .select-wrapper button.open .chevron { 387 transform: rotate(180deg); 388 } 389 390 ul { 391 display: none; 392 flex-direction: column; 393 text-align: left; 394 position: absolute; 395 left: 0; 396 right: 0; 397 top: calc(100% - 1px); 398 bottom: auto; 399 list-style: none; 400 margin: 0; 401 padding: 0; 402 color: var(--text-color); 403 background-color: var(--body-color); 404 border: 1px solid var(--border-color); 405 border-radius: var(--input-border-radius); 406 clip-path: inset(0 round var(--input-border-radius)); 407 max-height: 40vh; 408 overflow: auto; 409 max-height: calc( (var(--base-font-size) * 3) + 69px ); 410 opacity: 0; 411 transition: opacity 0.2s ease-in-out; 412 z-index: 0; 413 pointer-events: none; 414 } 415 416 .select-wrapper--borders-round ul, 417 .select-wrapper--borders-curved ul, 418 .select-wrapper--borders-subtle ul { 419 top: calc(100% + 2px); 420 } 421 422 ul::-webkit-scrollbar {
423 width: 3px; 424 } 425 426 /* Track */ 427 ul::-webkit-scrollbar-track { 428 background: var(--text-color-transparent30); 429 } 430 431 /* Handle */ 432 ul::-webkit-scrollbar-thumb { 433 background: var(--text-color-transparent5); 434 } 435 436 @supports (-webkit-touch-callout: none) { 437 ul { 438 top: top: calc(100% - 2px); 439 width: 100%; 440 } 441 } 442 443 ul.open { 444 display: flex; 445 opacity: 1; 446 z-index: 3; 447 pointer-events: all; 448 } 449 450 ul li { 451 font-size: var(--base-font-size); 452 padding: 8px 10px; 453 margin: 0; 454 font-family: inherit; 455 font-weight: inherit; 456 font-weight: inherit; 457 line-height: 1.6; 458 cursor: pointer; 459 word-wrap: break-word; 460 word-break: break-word; 461 } 462 463 ul li:hover, 464 ul li.selected { 465 background-color: var(--filter-bg-color); 466 } 467 468 .select-wrapper--borders-round ul li { 469 padding: 8px 15px; 470 } 471 472 .spin { 473 animation: spin 1s linear infinite; 474 } 475 476 @keyframes spin { 477 from { 478 transform: rotate(0deg); 479 } 480 481 to { 482 transform: rotate(360deg); 483 } 484 } 485 `}static properties={button:{type:String},variant:{type:String},optionSelects:{type:Array},productSelects:{type:Array},selectButtonLabels:{type:Array},currentVariant:{type:Array},featuredImage:{type:String},allOptionsChosen:{type:Boolean},focusedIndex:{type:Array},productUrl:{type:String}};constructor(){super()}connectedCallback(){if(super.connectedCallback(),this.addToCart=this.dataset.addToCart,this.shoppingBagIcon=this.dataset.shoppingBagIcon,this.dropdownChevron=this.dataset.dropdownChevron,this.loginToOrderIcon=this.dataset.loginToOrderIcon,this.soldOut=this.dataset.soldOut,this.chooseOption=this.dataset.chooseOption,this.from=this.dataset.from,this.notAvailable=this.dataset.notAvailable,this.added=this.dataset.added,this.loading=this.dataset.loading,this.productRegularPrice=this.dataset.productsRegularPrice,this.productPriceDisplay=this.dataset.productPriceDisplay,this.showMaxPrice=this.dataset.showMaxPrice,this.loginToOrder=this.dataset.loginToOrder==="true",this.loginToOrderLabel=this.dataset.loginToOrderLabel,this.loginToOrderHref=this.dataset.loginToOrderHref,this.productData=JSON.parse(this.getAttribute("product")),this.moneyFormat=this.getAttribute("money-format"),this.currentVariant=this._firstAvailableVariant(),this.productImagePlaceholder=this.getAttribute("product-image-placeholder"),this.imageAspectRatio=this.getAttribute("image-aspect-ratio"),this.imageSrcSet=this.getAttribute("image-srcset"),this.borderRadius=this.getAttribute("border-radius"),this.defaultImage=this.productData.featured_image,this.featuredImage=this.defaultImage,this.optionSelects=[],this.productSelects=[],this.button=this._getButton(),this.focusedIndex=this.productData.options.map(()=>-1),this.selectButtonLabels=[...this.productData.options],this.allOptionsChosen=!this.productData.options.some(r2=>this.selectButtonLabels.includes(r2)),this.cartAction=document.getElementById("PageContainer").dataset.cartAction,this.cartType=document.getElementById("PageContainer").dataset.cartType,this.showCurrencyCode=document.getElementById("PageContainer").dataset.showCurrencyCode,this.currencyCode=document.getElementById("PageContainer").dataset.currencyCode,this.productUrl=this.dataset.productUrl,this._productHasVariants()&&this._productHasVariants()&&this.productData.options.length===1&&(this._checkOptions(),this.productSelects.length===1&&this.productSelects[0].options.length===1)){this._getOptions(),this.selectButtonLabels[0]=this.optionSelects[0].options[0],this.allOptionsChosen=!0,this.focusedIndex[0]=0;const title=this.selectButtonLabels[0],variant=this.productData.variants.find(obj=>obj.title===title);variant&&(this.currentVariant=variant,this.currentVariant.featured_image&&(this.featuredImage=this.currentVariant.featured_image.src)),this.button=this._getButton(!0)}this.addEventListener("animationend",()=>{this.removeAttribute("data-animate-nested"),this.removeAttribute("data-animate")})}_checkOptions(){let optionsDeDupe=[];for(const[optionIndex,option]of Object.entries(this.productData.options)){optionsDeDupe[optionIndex]={label:"",options:[]};let theseOptions=[];for(const variant of this.productData.variants)theseOptions.push(variant[`option${parseInt(optionIndex)+1}`]);let uniqueOptions=[...new Set(theseOptions)];optionsDeDupe[optionIndex].label=option,optionsDeDupe[optionIndex].options=uniqueOptions}this.productSelects=optionsDeDupe}_firstAvailableVariant(){const available=this.productData.variants.find(variant=>variant.available);return available||this.productData.variants[0]}_imageAtSize(url,size){if(!url)return;let fullFileName=url;fullFileName=fullFileName.replace(/_([0-9]+x+)/,"");let separatorIndex=fullFileName.lastIndexOf("."),fileName=fullFileName.substr(0,separatorIndex),extension=fullFileName.substr(separatorIndex);return`${fileName}_${size}${extension}`}
485_renderStringWithIcon(string,icon){return x` 486 <span class="cross-sells__button-label--content"><span class="icon">${unsafe_svg_o(icon)}</span><span class="text">${string}</span></span> 487 `}_productHasVariants(){return this.productData.variants[0].public_title!==null}_disableButton(){this.button=x` 488 <button 489 type="button" 490 class="disabled text-link-animated" 491 disabled 492 aria-label="${this.loading}" 493 > 494 <svg viewBox="0 0 25 24" fill="none" xmlns="http://www.w3.org/2000/svg" width="1.6em" height="1.6em" class="spin"><g clip-path="url(#clip0_3605_47041)"><path d="M12.5 23C6.42487 23 1.5 18.0751 1.5 12C1.5 5.92487 6.42487 1 12.5 1C18.5751 1 23.5 5.92487 23.5 12C23.5 15.1767 22.1534 18.0388 20 20.0468" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/></g><defs><clipPath id="clip0_3605_47041"><rect width="24" height="24" fill="none" transform="translate(0.5)"/></clipPath></defs></svg> 495 <span class="sr-only">${this.loading}</span> 496 </button> 497 `}_enableButton(){this.button=this._getButton(!0)}_addedButton(){this.button=x` 498 <button 499 type="button" 500 class="disabled text-link-animated" 501 disabled 502 aria-label="${this.added}" 503 > 504 <span class="cross-sells__button-label">${this.added}</span> 505 </button> 506 `}_getButton(showAdd=!1){return this.loginToOrder?x` 507 <a 508 href="${this.loginToOrderHref}" 509 class="text-link-animated" 510 aria-label="${this.loginToOrderLabel}" 511 > 512 <span class="cross-sells__button-label">${this._renderStringWithIcon(this.loginToOrderLabel,this.loginToOrderIcon)}</span> 513 </a> 514 `:!this.currentVariant.available&&this.optionSelects.length>0?x` 515 <button 516 type="button" 517 @click=${()=>this._handleButtonClick()} 518 class="unavailable text-link-animated" 519 aria-label="${this.soldOut}" 520 > 521 <span class="cross-sells__button-label">${this.soldOut}</span> 522 </button> 523 `:this._productHasVariants()&&!showAdd&&!this.allOptionsChosen||!this.currentVariant.available?x` 524 <button 525 type="button" 526 @click=${()=>this._handleButtonClick()} 527 class="text-link-animated" 528 aria-label="${this.chooseOption}" 529 > 530 <span class="cross-sells__button-label">${this._renderStringWithIcon(this.chooseOption,this.shoppingBagIcon)}</span> 531 </button> 532 `:x` 533 <button 534 type="button" 535 @click=${()=>this._handleButtonClick()} 536 class="action-add text-link-animated" 537 aria-label="${this.addToCart}" 538 > 539 <span class="cross-sells__button-label">${this._renderStringWithIcon(this.addToCart,this.shoppingBagIcon)}</span> 540 </button> 541 `}_getOptions(){let optionsDeDupe=[];for(const[optionIndex,option]of Object.entries(this.productData.options)){optionsDeDupe[optionIndex]={label:"",options:[]};let theseOptions=[];for(const[variantIndex,variant]of Object.entries(this.productData.variants))theseOptions.push(variant[`option${parseInt(optionIndex)+1}`]);let uniqueOptions=[...new Set(theseOptions)];optionsDeDupe[optionIndex].label=option,optionsDeDupe[optionIndex].options=uniqueOptions}this.optionSelects=optionsDeDupe}async _addToCart(){let formData={items:[{id:this.currentVariant.id,quantity:1}]};this.cartType=="drawer"&&(formData.sections="cart-drawer");try{const fetchResult=await window.fetch("/cart/add.js",{method:"POST",credentials:"same-origin",headers:{"Content-Type":"application/json"},body:JSON.stringify(formData)}),responseJson=await fetchResult.json();if(!fetchResult.ok)console.error("Unable to add to cart: ",responseJson);else return this._updateCart(responseJson),responseJson}catch(e2){console.error("Unable to add to cart: ",e2)}}async _updateCart(responseJson){this.cartType=="drawer"&&window.eventBus.emit("update:cart:drawer",responseJson);const cart=await(await fetch("/cart.js")).json();this.cartType=="drawer"&&this.cartAction=="go_to_or_open_cart"&&window.eventBus.emit("open:cart:drawer",{scrollToTop:!0}),window.wetheme.updateCartCount(cart)}async _handleButtonClick(){if(!this._productHasVariants()||this.allOptionsChosen){this._disableButton();let json=await this._addToCart();this._addedButton(),setTimeout(()=>this._enableButton(),3e3)}else{const selectButtons=this.renderRoot.querySelectorAll(".select-button");if(selectButtons.length===0){if(this._getOptions(),this.optionSelects.every(select=>select.options.length===1)){const title=this.optionSelects.map(select=>select.options[0]).join(" / ");
541this.optionSelects.forEach((select,index)=>{this.selectButtonLabels[index]=select.options[0],this.focusedIndex[index]=0}),this.allOptionsChosen=!0;const variant=this.productData.variants.find(obj=>obj.title===title);variant&&(this.currentVariant=variant,this.currentVariant.featured_image&&(this.featuredImage=this.currentVariant.featured_image.src)),this.button=this._getButton(!0);return}this.optionSelects.forEach((select,index)=>{select.options.length===1&&(this.selectButtonLabels[index]=select.options[0],this.focusedIndex[index]=0)});return}Array.from(selectButtons).find(input=>input.value===input.getAttribute("aria-label")).focus()}}_toggleDropdown(index){this.renderRoot.querySelector(`#option-${index}`).classList.toggle("open"),this.renderRoot.querySelector(`#ul-${index}`).classList.toggle("open")}_closeDropdown(index){this.renderRoot.querySelector(`#option-${index}`).classList.remove("open"),this.renderRoot.querySelector(`#ul-${index}`).classList.remove("open")}_openDropdown(index){this.renderRoot.querySelector(`#option-${index}`).classList.remove("open"),this.renderRoot.querySelector(`#ul-${index}`).classList.remove("open")}_findVariantIndex(option,optionIndex){var index;return this.optionSelects[optionIndex].options.forEach(function(o2,i2){o2===option&&(index=i2)}),index}_updateSelectedIndex(updatedOptionIndex,selectIndex){const lis=this.renderRoot.querySelector(`#ul-${selectIndex}`).querySelectorAll("li");lis[this.focusedIndex[selectIndex]]?.classList.remove("selected"),updatedOptionIndex>=0&&updatedOptionIndex<lis.length?(this.focusedIndex[selectIndex]=updatedOptionIndex,lis[this.focusedIndex[selectIndex]].classList.add("selected")):this.focusedIndex[selectIndex]=-1}async _handleOptionClick(value,index){this.selectButtonLabels[index]=value,this._updateSelectedIndex(this._findVariantIndex(value,index),index),await this.update();const selects=this.renderRoot.querySelectorAll(".select-button"),unorderedList=this.renderRoot.querySelector(`#ul-${index}`);if(unorderedList.querySelectorAll(`#ul-${index} li`).forEach(li=>li.getAttribute("aria-label")===value?li.classList.add("selected"):li.classList.remove("selected")),this.allOptionsChosen=!this.productData.options.some(r2=>this.selectButtonLabels.includes(r2)),!this.allOptionsChosen){unorderedList.classList.contains("open")&&Array.from(selects).find(select=>select.value===select.getAttribute("aria-label")).focus();return}let vals=[];for(const[index2,selectButton]of Object.entries(selects))vals.push(selectButton.value);const title=vals.join(" / "),variant=this.productData.variants.find(obj=>obj.title==title);variant?(this.currentVariant=variant,this.currentVariant.featured_image&&(this.featuredImage=this.currentVariant.featured_image.src)):(this.currentVariant={available:!1},this.featuredImage=this.defaultImage),this.button=this._getButton(this.currentVariant.available)}async _moveFocusedIndex(e2){let focusedIndex=this.focusedIndex[e2.target.dataset.index];const ul=this.renderRoot.querySelector(`#ul-${e2.target.dataset.index}`),lis=ul.querySelectorAll("li");let newFocusedIndex,focusedOption;switch(e2.key){case"ArrowDown":e2.preventDefault(),newFocusedIndex=focusedIndex+1,newFocusedIndex>=0&&newFocusedIndex<lis.length&&(ul.classList.contains("open")===!1?(focusedOption=this.optionSelects[e2.target.dataset.index].options[newFocusedIndex],this._handleOptionClick(focusedOption,e2.target.dataset.index)):this._updateSelectedIndex(newFocusedIndex,e2.target.dataset.index));break;case"ArrowUp":e2.preventDefault(),newFocusedIndex=focusedIndex-1,newFocusedIndex>=0&&newFocusedIndex<lis.length&&(ul.classList.contains("open")===!1?(focusedOption=this.optionSelects[e2.target.dataset.index].options[newFocusedIndex],this._handleOptionClick(focusedOption,e2.target.dataset.index)):this._updateSelectedIndex(newFocusedIndex,e2.target.dataset.index));break;case"Enter":ul.classList.contains("open")===!1?this._openDropdown(e2.target.dataset.index):(focusedOption=this.optionSelects[e2.target.dataset.index].options[this.focusedIndex[e2.target.dataset.index]],focusedOption&&this._handleOptionClick(focusedOption,e2.target.dataset.index));break;case" ":ul.classList.contains("open")===!1?this._openDropdown(e2.target.dataset.index):(focusedOption=this.optionSelects[e2.target.dataset.index].options[this.focusedIndex[e2.target.dataset.index]],focusedOption&&this._handleOptionClick(focusedOption,e2.target.dataset.index));break;case"Escape":this._closeDropdown(e2.target.dataset.index);break;default:break}}
541render(){if(this.productData.available===!1)return window.Shopify.designMode?x` 542 <div class="not-available"> 543 ${this.productData.title} ${this.notAvailable}. 544 </div> 545 `:void 0;const optionsList=(option,index)=>{const sanitizedId=encodeURIComponent(option.replace(" ","")).toLowerCase();return x` 546 <li 547 id="${sanitizedId}" 548 @mousedown=${()=>this._handleOptionClick(option,index)} 549 key="${sanitizedId}" 550 aria-label="${option}" 551 > 552 ${option} 553 </li> 554 `};return x` 555 <div class="product-image"> 556 <a href="${this.productUrl}" class="grid__image" target="_blank" rel="noopener" title="Opens ${this.productData.title} in a new tab"> 557 <div class="aspect-ratio aspect-ratio--${this.imageAspectRatio}"> 558 ${this.defaultImage!=null?x` 559 <img 560 class="featured-image" 561 loading="lazy" 562 srcset=" 563 ${this.imageSrcSet} 564 " 565 sizes="(min-width: 1200px) 300px, (min-width: 750px) 200px, 100px" 566 src="${this.featuredImage}" 567 alt="${this.currentVariant.title}" 568 width="90px" 569 /> 570 `:x`${unsafe_svg_o(this.productImagePlaceholder)}`} 571 </div> 572 </a> 573 </div> 574 <div class="${class_map_o({info:!0,vertical:this.optionSelects.length>0})}"> 575 <div class="product-info"> 576 <div class="title"> 577 <a 578 href="${this.productUrl}" 579 target="_blank" 580 rel="noopener" 581 title="Opens ${this.productData.title} in a new tab" 582 >${this.productData.title}</a 583 > 584 </div> 585 ${this.loginToOrder?"":x` 586 <div class="price"> 587 ${this.currentVariant.available?x` 588 <a href="${this.productUrl}" target="_blank" title="Opens ${this.productData.title} in a new tab"> 589 ${this.productData.price_varies&&this._productHasVariants()&&this.showMaxPrice=="false"&&!this.allOptionsChosen?this.from:""} 590 ${this.showMaxPrice=="false"&&!this.allOptionsChosen&&this.productData.compare_at_price_min>this.productData.price_min?x` 591 <span class="money price-line-through sale-price"> 592 <span class="sr-only">${this.productRegularPrice}</span> 593 ${formatMoney(this.productData.compare_at_price_min,this.moneyFormat)} 594 ${this.showCurrencyCode=="true"?x`<span class="currency-code">${this.currencyCode}</span>`:""} 595 </span>`:this.showMaxPrice=="true"&&!this.allOptionsChosen&&this.productData.compare_at_price_max>this.productData.price_max?x` 596 <span class="money price-line-through sale-price"> 597 <span class="sr-only">${this.productRegularPrice}</span> 598 ${formatMoney(this.productData.compare_at_price_max,this.moneyFormat)} 599 ${this.showCurrencyCode=="true"?x`<span class="currency-code">${this.currencyCode}</span>`:""} 600 </span>`:this.currentVariant.compare_at_price>this.currentVariant.price?x` 601 <span class="money price-line-through sale-price"> 602 <span class="sr-only">${this.productRegularPrice}</span> 603 ${formatMoney(this.currentVariant.compare_at_price,this.moneyFormat)} 604 ${this.showCurrencyCode=="true"?x`<span class="currency-code">${this.currencyCode}</span>`:""} 605 </span> 606 `:""} 607 608 ${this.showMaxPrice=="false"&&!this.allOptionsChosen?x` 609 <span class="money"> 610 ${formatMoney(this.productData.price_min,this.moneyFormat)} 611 ${this.showCurrencyCode=="true"?x`<span class="currency-code">${this.currencyCode}</span>`:""} 612 </span> 613 `:this.showMaxPrice=="true"&&!this.allOptionsChosen?x`
614 <span class="money"> 615 ${formatMoney(this.productData.price_max,this.moneyFormat)} 616 ${this.showCurrencyCode=="true"?x`<span class="currency-code">${this.currencyCode}</span>`:""} 617 </span> 618 `:x` 619 <span class="money"> 620 ${formatMoney(this.currentVariant.price,this.moneyFormat)} 621 ${this.showCurrencyCode=="true"?x`<span class="currency-code">${this.currencyCode}</span>`:""} 622 </span> 623 `} 624 </a> 625 `:x`<span>Sold out</span>`} 626 </div> 627 `} 628 ${this.optionSelects.length>0?x` 629 <div class="options"> 630 ${this.optionSelects.map((item,index)=>x` 631 <div class="select-wrapper select-wrapper--borders-${this.borderRadius}"> 632 <button 633 class="alt-focus select-button" 634 id="option-${index}" 635 value="${this.selectButtonLabels[index]}" 636 type="button" 637 readonly="true" 638 tabindex="0" 639 aria-haspopup="listbox" 640 aria-label="${item.label}" 641 aria-controls="ul-${index}" 642 data-index="${index}" 643 @click=${()=>this._toggleDropdown(index)} 644 @blur=${()=>this._closeDropdown(index)} 645 @keydown="${this._moveFocusedIndex}" 646 > 647 <span> 648 ${item.options.length===1?item.options[0]:this.selectButtonLabels[index]} 649 </span> 650 <span class="icon inline-icon--wrapper dropdown-icon"> 651 ${unsafe_svg_o(this.dropdownChevron)} 652 </span> 653 </button> 654 <ul 655 role="listbox" 656 tabindex="0" 657 id="ul-${index}" 658 > 659 ${item.options.map(option=>optionsList(option,index))} 660 </ul> 661 </div> 662 `)} 663 </div> 664 `:""} 665 </div> 666 <div class="buttons"> 667 ${this.button} 668 </div> 669 </div> 670 `}}customElements.get("product-cross-sell")||customElements.define("product-cross-sell",ProductCrossSell)})(); 671//# sourceMappingURL=/cdn/shop/t/35/assets/component-product-cross-sell.js.map?v=160254582486201099611784636123
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.