@blotoutio/providers-blotout-wallet-sdk 0.41.0 → 0.42.0

package/index.mjs

@@ -1,46 +1,5 @@
 const packageName = 'blotoutWallet';
 
-const canLog = () => {
-    try {
-        return localStorage.getItem('edgeTagDebug') === '1';
-    }
-    catch {
-        return false;
-    }
-};
-const logger = {
-    log: (...args) => {
-        if (canLog()) {
-            console.log(...args);
-        }
-    },
-    error: (...args) => {
-        if (canLog()) {
-            console.error(...args);
-        }
-    },
-    info: (...args) => {
-        if (canLog()) {
-            console.info(...args);
-        }
-    },
-    trace: (...args) => {
-        if (canLog()) {
-            console.trace(...args);
-        }
-    },
-    table: (...args) => {
-        if (canLog()) {
-            console.table(...args);
-        }
-    },
-    dir: (...args) => {
-        if (canLog()) {
-            console.dir(...args);
-        }
-    },
-};
-
 class APIError extends Error {
     constructor(...args) {
         super(...args);
@@ -49,7 +8,7 @@ class APIError extends Error {
 class WalletAPI {
     constructor({ baseUrl, userId }) {
         this.listeners = new Set();
-        this._cart = null;
+        this._cart = { cartId: null, items: [], email: false };
         this.baseUrl = baseUrl;
         this.userId = userId;
     }
@@ -79,10 +38,8 @@ class WalletAPI {
         return this._cart;
     }
     set cart(value) {
-        if (this._cart !== value) {
-            this._cart = value;
-            this.notify();
-        }
+        this._cart = value;
+        this.notify();
     }
     subscribe(listener) {
         this.listeners.add(listener);
@@ -96,9 +53,6 @@ class WalletAPI {
             headers: this.getHeaders(),
         }).then(async (response) => {
             if (!response.ok) {
-                if (response.status == 404) {
-                    return (this.cart = null);
-                }
                 throw new APIError(`Could not fetch cart contents`, {
                     cause: response,
                 });
@@ -167,34 +121,400 @@ class WalletAPI {
             if (!response.ok) {
                 throw new APIError(`Could not mark purchase`, { cause: response });
             }
+            this.cart = { cartId: null, email: this.cart.email, items: [] };
+            this.notify();
+        });
+    }
+    saveEmail(email) {
+        return fetch(this.getUrl('/cart/email'), {
+            method: 'POST',
+            body: JSON.stringify({ email }),
+            headers: this.getHeaders(true),
+        }).then((response) => {
+            if (!response.ok) {
+                throw new APIError('Could not save email', { cause: response });
+            }
+            this.cart.email = true;
+            this.notify();
+        });
+    }
+    restore() {
+        return fetch(this.getUrl('/cart/restore'), {
+            method: 'POST',
+            headers: this.getHeaders(),
+        }).then((response) => {
+            if (!response.ok) {
+                throw new APIError('Could not mark cart as restored', {
+                    cause: response,
+                });
+            }
         });
     }
 }
 
-let api;
-let component;
-const setComponent = (_component) => {
-    component = _component;
-};
-const setAPI = (_api) => {
-    api = _api;
+var _a;
+const registryKey = Symbol.for('blotout-wallet');
+(_a = window[registryKey]) !== null && _a !== void 0 ? _a : (window[registryKey] = {});
+
+/******************************************************************************
+Copyright (c) Microsoft Corporation.
+
+Permission to use, copy, modify, and/or distribute this software for any
+purpose with or without fee is hereby granted.
+
+THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
+REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
+AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
+INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
+LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
+OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
+PERFORMANCE OF THIS SOFTWARE.
+***************************************************************************** */
+/* global Reflect, Promise, SuppressedError, Symbol */
+
+
+function __decorate(decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+}
+
+function __metadata(metadataKey, metadataValue) {
+    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(metadataKey, metadataValue);
+}
+
+typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
+    var e = new Error(message);
+    return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
 };
-const getAPI = () => api;
-const getComponent = () => component;
 
-const symbol = Symbol.for('blotout-store-implementation');
+/**
+ * @license
+ * Copyright 2019 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+const t$3=globalThis,e$6=t$3.ShadowRoot&&(void 0===t$3.ShadyCSS||t$3.ShadyCSS.nativeShadow)&&"adoptedStyleSheets"in Document.prototype&&"replace"in CSSStyleSheet.prototype,s$2=Symbol(),o$4=new WeakMap;let n$4 = class n{constructor(t,e,o){if(this._$cssResult$=!0,o!==s$2)throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");this.cssText=t,this.t=e;}get styleSheet(){let t=this.o;const s=this.t;if(e$6&&void 0===t){const e=void 0!==s&&1===s.length;e&&(t=o$4.get(s)),void 0===t&&((this.o=t=new CSSStyleSheet).replaceSync(this.cssText),e&&o$4.set(s,t));}return t}toString(){return this.cssText}};const r$5=t=>new n$4("string"==typeof t?t:t+"",void 0,s$2),i$4=(t,...e)=>{const o=1===t.length?t[0]:e.reduce(((e,s,o)=>e+(t=>{if(!0===t._$cssResult$)return t.cssText;if("number"==typeof t)return t;throw Error("Value passed to 'css' function must be a 'css' function result: "+t+". Use 'unsafeCSS' to pass non-literal values, but take care to ensure page security.")})(s)+t[o+1]),t[0]);return new n$4(o,t,s$2)},S$1=(s,o)=>{if(e$6)s.adoptedStyleSheets=o.map((t=>t instanceof CSSStyleSheet?t:t.styleSheet));else for(const e of o){const o=document.createElement("style"),n=t$3.litNonce;void 0!==n&&o.setAttribute("nonce",n),o.textContent=e.cssText,s.appendChild(o);}},c$2=e$6?t=>t:t=>t instanceof CSSStyleSheet?(t=>{let e="";for(const s of t.cssRules)e+=s.cssText;return r$5(e)})(t):t;
+
+/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */const{is:i$3,defineProperty:e$5,getOwnPropertyDescriptor:r$4,getOwnPropertyNames:h$1,getOwnPropertySymbols:o$3,getPrototypeOf:n$3}=Object,a$1=globalThis,c$1=a$1.trustedTypes,l$1=c$1?c$1.emptyScript:"",p$1=a$1.reactiveElementPolyfillSupport,d$1=(t,s)=>t,u$1={toAttribute(t,s){switch(s){case Boolean:t=t?l$1:null;break;case Object:case Array:t=null==t?t:JSON.stringify(t);}return t},fromAttribute(t,s){let i=t;switch(s){case Boolean:i=null!==t;break;case Number:i=null===t?null:Number(t);break;case Object:case Array:try{i=JSON.parse(t);}catch(t){i=null;}}return i}},f$1=(t,s)=>!i$3(t,s),y$1={attribute:!0,type:String,converter:u$1,reflect:!1,hasChanged:f$1};Symbol.metadata??=Symbol("metadata"),a$1.litPropertyMetadata??=new WeakMap;let b$1 = class b extends HTMLElement{static addInitializer(t){this._$Ei(),(this.l??=[]).push(t);}static get observedAttributes(){return this.finalize(),this._$Eh&&[...this._$Eh.keys()]}static createProperty(t,s=y$1){if(s.state&&(s.attribute=!1),this._$Ei(),this.elementProperties.set(t,s),!s.noAccessor){const i=Symbol(),r=this.getPropertyDescriptor(t,i,s);void 0!==r&&e$5(this.prototype,t,r);}}static getPropertyDescriptor(t,s,i){const{get:e,set:h}=r$4(this.prototype,t)??{get(){return this[s]},set(t){this[s]=t;}};return {get(){return e?.call(this)},set(s){const r=e?.call(this);h.call(this,s),this.requestUpdate(t,r,i);},configurable:!0,enumerable:!0}}static getPropertyOptions(t){return this.elementProperties.get(t)??y$1}static _$Ei(){if(this.hasOwnProperty(d$1("elementProperties")))return;const t=n$3(this);t.finalize(),void 0!==t.l&&(this.l=[...t.l]),this.elementProperties=new Map(t.elementProperties);}static finalize(){if(this.hasOwnProperty(d$1("finalized")))return;if(this.finalized=!0,this._$Ei(),this.hasOwnProperty(d$1("properties"))){const t=this.properties,s=[...h$1(t),...o$3(t)];for(const i of s)this.createProperty(i,t[i]);}const t=this[Symbol.metadata];if(null!==t){const s=litPropertyMetadata.get(t);if(void 0!==s)for(const[t,i]of s)this.elementProperties.set(t,i);}this._$Eh=new Map;for(const[t,s]of this.elementProperties){const i=this._$Eu(t,s);void 0!==i&&this._$Eh.set(i,t);}this.elementStyles=this.finalizeStyles(this.styles);}static finalizeStyles(s){const i=[];if(Array.isArray(s)){const e=new Set(s.flat(1/0).reverse());for(const s of e)i.unshift(c$2(s));}else void 0!==s&&i.push(c$2(s));return i}static _$Eu(t,s){const i=s.attribute;return !1===i?void 0:"string"==typeof i?i:"string"==typeof t?t.toLowerCase():void 0}constructor(){super(),this._$Ep=void 0,this.isUpdatePending=!1,this.hasUpdated=!1,this._$Em=null,this._$Ev();}_$Ev(){this._$ES=new Promise((t=>this.enableUpdating=t)),this._$AL=new Map,this._$E_(),this.requestUpdate(),this.constructor.l?.forEach((t=>t(this)));}addController(t){(this._$EO??=new Set).add(t),void 0!==this.renderRoot&&this.isConnected&&t.hostConnected?.();}removeController(t){this._$EO?.delete(t);}_$E_(){const t=new Map,s=this.constructor.elementProperties;for(const i of s.keys())this.hasOwnProperty(i)&&(t.set(i,this[i]),delete this[i]);t.size>0&&(this._$Ep=t);}createRenderRoot(){const t=this.shadowRoot??this.attachShadow(this.constructor.shadowRootOptions);return S$1(t,this.constructor.elementStyles),t}connectedCallback(){this.renderRoot??=this.createRenderRoot(),this.enableUpdating(!0),this._$EO?.forEach((t=>t.hostConnected?.()));}enableUpdating(t){}disconnectedCallback(){this._$EO?.forEach((t=>t.hostDisconnected?.()));}attributeChangedCallback(t,s,i){this._$AK(t,i);}_$EC(t,s){const i=this.constructor.elementProperties.get(t),e=this.constructor._$Eu(t,i);if(void 0!==e&&!0===i.reflect){const r=(void 0!==i.converter?.toAttribute?i.converter:u$1).toAttribute(s,i.type);this._$Em=t,null==r?this.removeAttribute(e):this.setAttribute(e,r),this._$Em=null;}}_$AK(t,s){const i=this.constructor,e=i._$Eh.get(t);if(void 0!==e&&this._$Em!==e){const t=i.getPropertyOptions(e),r="function"==typeof t.converter?{fromAttribute:t.converter}:void 0!==t.converter?.fromAttribute?t.converter:u$1;this._$Em=e,this[e]=r.fromAttribute(s,t.type),this._$Em=null;}}requestUpdate(t,s,i){if(void 0!==t){if(i??=this.constructor.getPropertyOptions(t),!(i.hasChanged??f$1)(this[t],s))return;this.P(t,s,i);}!1===this.isUpdatePending&&(this._$ES=this._$ET());}P(t,s,i){this._$AL.has(t)||this._$AL.set(t,s),!0===i.reflect&&this._$Em!==t&&(this._$Ej??=new Set).add(t);}async _$ET(){this.isUpdatePending=!0;try{await this._$ES;}catch(t){Promise.reject(t);}const t=this.scheduleUpdate();return null!=t&&await t,!this.isUpdatePending}scheduleUpdate(){return this.performUpdate()}performUpdate(){if(!this.isUpdatePending)return;if(!this.hasUpdated){if(this.renderRoot??=this.createRenderRoot(),this._$Ep){for(const[t,s]of this._$Ep)this[t]=s;this._$Ep=void 0;}const t=this.constructor.elementProperties;if(t.size>0)for(const[s,i]of t)!0!==i.wrapped||this._$AL.has(s)||void 0===this[s]||this.P(s,this[s],i);}let t=!1;const s=this._$AL;try{t=this.shouldUpdate(s),t?(this.willUpdate(s),this._$EO?.forEach((t=>t.hostUpdate?.())),this.update(s)):this._$EU();}catch(s){throw t=!1,this._$EU(),s}t&&this._$AE(s);}willUpdate(t){}_$AE(t){this._$EO?.forEach((t=>t.hostUpdated?.())),this.hasUpdated||(this.hasUpdated=!0,this.firstUpdated(t)),this.updated(t);}_$EU(){this._$AL=new Map,this.isUpdatePending=!1;}get updateComplete(){return this.getUpdateComplete()}getUpdateComplete(){return this._$ES}shouldUpdate(t){return !0}update(t){this._$Ej&&=this._$Ej.forEach((t=>this._$EC(t,this[t]))),this._$EU();}updated(t){}firstUpdated(t){}};b$1.elementStyles=[],b$1.shadowRootOptions={mode:"open"},b$1[d$1("elementProperties")]=new Map,b$1[d$1("finalized")]=new Map,p$1?.({ReactiveElement:b$1}),(a$1.reactiveElementVersions??=[]).push("2.0.4");
+
+/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+const t$2=globalThis,i$2=t$2.trustedTypes,s$1=i$2?i$2.createPolicy("lit-html",{createHTML:t=>t}):void 0,e$4="$lit$",h=`lit$${Math.random().toFixed(9).slice(2)}$`,o$2="?"+h,n$2=`<${o$2}>`,r$3=document,l=()=>r$3.createComment(""),c=t=>null===t||"object"!=typeof t&&"function"!=typeof t,a=Array.isArray,u=t=>a(t)||"function"==typeof t?.[Symbol.iterator],d="[ \t\n\f\r]",f=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,v=/-->/g,_=/>/g,m=RegExp(`>|${d}(?:([^\\s"'>=/]+)(${d}*=${d}*(?:[^ \t\n\f\r"'\`<>=]|("|')|))|$)`,"g"),p=/'/g,g=/"/g,$=/^(?:script|style|textarea|title)$/i,y=t=>(i,...s)=>({_$litType$:t,strings:i,values:s}),x=y(1),b=y(2),w=Symbol.for("lit-noChange"),T=Symbol.for("lit-nothing"),A=new WeakMap,E=r$3.createTreeWalker(r$3,129);function C(t,i){if(!Array.isArray(t)||!t.hasOwnProperty("raw"))throw Error("invalid template strings array");return void 0!==s$1?s$1.createHTML(i):i}const P=(t,i)=>{const s=t.length-1,o=[];let r,l=2===i?"<svg>":"",c=f;for(let i=0;i<s;i++){const s=t[i];let a,u,d=-1,y=0;for(;y<s.length&&(c.lastIndex=y,u=c.exec(s),null!==u);)y=c.lastIndex,c===f?"!--"===u[1]?c=v:void 0!==u[1]?c=_:void 0!==u[2]?($.test(u[2])&&(r=RegExp("</"+u[2],"g")),c=m):void 0!==u[3]&&(c=m):c===m?">"===u[0]?(c=r??f,d=-1):void 0===u[1]?d=-2:(d=c.lastIndex-u[2].length,a=u[1],c=void 0===u[3]?m:'"'===u[3]?g:p):c===g||c===p?c=m:c===v||c===_?c=f:(c=m,r=void 0);const x=c===m&&t[i+1].startsWith("/>")?" ":"";l+=c===f?s+n$2:d>=0?(o.push(a),s.slice(0,d)+e$4+s.slice(d)+h+x):s+h+(-2===d?i:x);}return [C(t,l+(t[s]||"<?>")+(2===i?"</svg>":"")),o]};class V{constructor({strings:t,_$litType$:s},n){let r;this.parts=[];let c=0,a=0;const u=t.length-1,d=this.parts,[f,v]=P(t,s);if(this.el=V.createElement(f,n),E.currentNode=this.el.content,2===s){const t=this.el.content.firstChild;t.replaceWith(...t.childNodes);}for(;null!==(r=E.nextNode())&&d.length<u;){if(1===r.nodeType){if(r.hasAttributes())for(const t of r.getAttributeNames())if(t.endsWith(e$4)){const i=v[a++],s=r.getAttribute(t).split(h),e=/([.?@])?(.*)/.exec(i);d.push({type:1,index:c,name:e[2],strings:s,ctor:"."===e[1]?k:"?"===e[1]?H:"@"===e[1]?I:R}),r.removeAttribute(t);}else t.startsWith(h)&&(d.push({type:6,index:c}),r.removeAttribute(t));if($.test(r.tagName)){const t=r.textContent.split(h),s=t.length-1;if(s>0){r.textContent=i$2?i$2.emptyScript:"";for(let i=0;i<s;i++)r.append(t[i],l()),E.nextNode(),d.push({type:2,index:++c});r.append(t[s],l());}}}else if(8===r.nodeType)if(r.data===o$2)d.push({type:2,index:c});else {let t=-1;for(;-1!==(t=r.data.indexOf(h,t+1));)d.push({type:7,index:c}),t+=h.length-1;}c++;}}static createElement(t,i){const s=r$3.createElement("template");return s.innerHTML=t,s}}function N(t,i,s=t,e){if(i===w)return i;let h=void 0!==e?s._$Co?.[e]:s._$Cl;const o=c(i)?void 0:i._$litDirective$;return h?.constructor!==o&&(h?._$AO?.(!1),void 0===o?h=void 0:(h=new o(t),h._$AT(t,s,e)),void 0!==e?(s._$Co??=[])[e]=h:s._$Cl=h),void 0!==h&&(i=N(t,h._$AS(t,i.values),h,e)),i}class S{constructor(t,i){this._$AV=[],this._$AN=void 0,this._$AD=t,this._$AM=i;}get parentNode(){return this._$AM.parentNode}get _$AU(){return this._$AM._$AU}u(t){const{el:{content:i},parts:s}=this._$AD,e=(t?.creationScope??r$3).importNode(i,!0);E.currentNode=e;let h=E.nextNode(),o=0,n=0,l=s[0];for(;void 0!==l;){if(o===l.index){let i;2===l.type?i=new M(h,h.nextSibling,this,t):1===l.type?i=new l.ctor(h,l.name,l.strings,this,t):6===l.type&&(i=new L(h,this,t)),this._$AV.push(i),l=s[++n];}o!==l?.index&&(h=E.nextNode(),o++);}return E.currentNode=r$3,e}p(t){let i=0;for(const s of this._$AV)void 0!==s&&(void 0!==s.strings?(s._$AI(t,s,i),i+=s.strings.length-2):s._$AI(t[i])),i++;}}class M{get _$AU(){return this._$AM?._$AU??this._$Cv}constructor(t,i,s,e){this.type=2,this._$AH=T,this._$AN=void 0,this._$AA=t,this._$AB=i,this._$AM=s,this.options=e,this._$Cv=e?.isConnected??!0;}get parentNode(){let t=this._$AA.parentNode;const i=this._$AM;return void 0!==i&&11===t?.nodeType&&(t=i.parentNode),t}get startNode(){return this._$AA}get endNode(){return this._$AB}_$AI(t,i=this){t=N(this,t,i),c(t)?t===T||null==t||""===t?(this._$AH!==T&&this._$AR(),this._$AH=T):t!==this._$AH&&t!==w&&this._(t):void 0!==t._$litType$?this.$(t):void 0!==t.nodeType?this.T(t):u(t)?this.k(t):this._(t);}S(t){return this._$AA.parentNode.insertBefore(t,this._$AB)}T(t){this._$AH!==t&&(this._$AR(),this._$AH=this.S(t));}_(t){this._$AH!==T&&c(this._$AH)?this._$AA.nextSibling.data=t:this.T(r$3.createTextNode(t)),this._$AH=t;}$(t){const{values:i,_$litType$:s}=t,e="number"==typeof s?this._$AC(t):(void 0===s.el&&(s.el=V.createElement(C(s.h,s.h[0]),this.options)),s);if(this._$AH?._$AD===e)this._$AH.p(i);else {const t=new S(e,this),s=t.u(this.options);t.p(i),this.T(s),this._$AH=t;}}_$AC(t){let i=A.get(t.strings);return void 0===i&&A.set(t.strings,i=new V(t)),i}k(t){a(this._$AH)||(this._$AH=[],this._$AR());const i=this._$AH;let s,e=0;for(const h of t)e===i.length?i.push(s=new M(this.S(l()),this.S(l()),this,this.options)):s=i[e],s._$AI(h),e++;e<i.length&&(this._$AR(s&&s._$AB.nextSibling,e),i.length=e);}_$AR(t=this._$AA.nextSibling,i){for(this._$AP?.(!1,!0,i);t&&t!==this._$AB;){const i=t.nextSibling;t.remove(),t=i;}}setConnected(t){void 0===this._$AM&&(this._$Cv=t,this._$AP?.(t));}}class R{get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}constructor(t,i,s,e,h){this.type=1,this._$AH=T,this._$AN=void 0,this.element=t,this.name=i,this._$AM=e,this.options=h,s.length>2||""!==s[0]||""!==s[1]?(this._$AH=Array(s.length-1).fill(new String),this.strings=s):this._$AH=T;}_$AI(t,i=this,s,e){const h=this.strings;let o=!1;if(void 0===h)t=N(this,t,i,0),o=!c(t)||t!==this._$AH&&t!==w,o&&(this._$AH=t);else {const e=t;let n,r;for(t=h[0],n=0;n<h.length-1;n++)r=N(this,e[s+n],i,n),r===w&&(r=this._$AH[n]),o||=!c(r)||r!==this._$AH[n],r===T?t=T:t!==T&&(t+=(r??"")+h[n+1]),this._$AH[n]=r;}o&&!e&&this.j(t);}j(t){t===T?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,t??"");}}class k extends R{constructor(){super(...arguments),this.type=3;}j(t){this.element[this.name]=t===T?void 0:t;}}class H extends R{constructor(){super(...arguments),this.type=4;}j(t){this.element.toggleAttribute(this.name,!!t&&t!==T);}}class I extends R{constructor(t,i,s,e,h){super(t,i,s,e,h),this.type=5;}_$AI(t,i=this){if((t=N(this,t,i,0)??T)===w)return;const s=this._$AH,e=t===T&&s!==T||t.capture!==s.capture||t.once!==s.once||t.passive!==s.passive,h=t!==T&&(s===T||e);e&&this.element.removeEventListener(this.name,this,s),h&&this.element.addEventListener(this.name,this,t),this._$AH=t;}handleEvent(t){"function"==typeof this._$AH?this._$AH.call(this.options?.host??this.element,t):this._$AH.handleEvent(t);}}class L{constructor(t,i,s){this.element=t,this.type=6,this._$AN=void 0,this._$AM=i,this.options=s;}get _$AU(){return this._$AM._$AU}_$AI(t){N(this,t);}}const Z=t$2.litHtmlPolyfillSupport;Z?.(V,M),(t$2.litHtmlVersions??=[]).push("3.1.3");const j=(t,i,s)=>{const e=s?.renderBefore??i;let h=e._$litPart$;if(void 0===h){const t=s?.renderBefore??null;e._$litPart$=h=new M(i.insertBefore(l(),t),t,void 0,s??{});}return h._$AI(t),h};
+
+/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */class s extends b$1{constructor(){super(...arguments),this.renderOptions={host:this},this._$Do=void 0;}createRenderRoot(){const t=super.createRenderRoot();return this.renderOptions.renderBefore??=t.firstChild,t}update(t){const i=this.render();this.hasUpdated||(this.renderOptions.isConnected=this.isConnected),super.update(t),this._$Do=j(i,this.renderRoot,this.renderOptions);}connectedCallback(){super.connectedCallback(),this._$Do?.setConnected(!0);}disconnectedCallback(){super.disconnectedCallback(),this._$Do?.setConnected(!1);}render(){return w}}s._$litElement$=!0,s[("finalized")]=!0,globalThis.litElementHydrateSupport?.({LitElement:s});const r$2=globalThis.litElementPolyfillSupport;r$2?.({LitElement:s});(globalThis.litElementVersions??=[]).push("4.0.5");
+
+/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+const t$1=t=>(e,o)=>{void 0!==o?o.addInitializer((()=>{customElements.define(t,e);})):customElements.define(t,e);};
+
+/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */const o$1={attribute:!0,type:String,converter:u$1,reflect:!1,hasChanged:f$1},r$1=(t=o$1,e,r)=>{const{kind:n,metadata:i}=r;let s=globalThis.litPropertyMetadata.get(i);if(void 0===s&&globalThis.litPropertyMetadata.set(i,s=new Map),s.set(r.name,t),"accessor"===n){const{name:o}=r;return {set(r){const n=e.get.call(this);e.set.call(this,r),this.requestUpdate(o,n,t);},init(e){return void 0!==e&&this.P(o,void 0,t),e}}}if("setter"===n){const{name:o}=r;return function(r){const n=this[o];e.call(this,r),this.requestUpdate(o,n,t);}}throw Error("Unsupported decorator location: "+n)};function n$1(t){return (e,o)=>"object"==typeof o?r$1(t,e,o):((t,e,o)=>{const r=e.hasOwnProperty(o);return e.constructor.createProperty(o,r?{...t,wrapped:!0}:t),r?Object.getOwnPropertyDescriptor(e,o):void 0})(t,e,o)}
+
+/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */function r(r){return n$1({...r,state:!0,attribute:!1})}
+
+/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+const e$3=(e,t,c)=>(c.configurable=!0,c.enumerable=!0,Reflect.decorate&&"object"!=typeof t&&Object.defineProperty(e,t,c),c);
+
+/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */function e$2(e,r){return (n,s,i)=>{const o=t=>t.renderRoot?.querySelector(e)??null;if(r){const{get:e,set:r}="object"==typeof s?n:i??(()=>{const t=Symbol();return {get(){return this[t]},set(e){this[t]=e;}}})();return e$3(n,s,{get(){let t=e.call(this);return void 0===t&&(t=o(this),(null!==t||this.hasUpdated)&&r.call(this,t)),t}})}return e$3(n,s,{get(){return o(this)}})}}
 
+/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+const t={ATTRIBUTE:1,CHILD:2,PROPERTY:3,BOOLEAN_ATTRIBUTE:4,EVENT:5,ELEMENT:6},e$1=t=>(...e)=>({_$litDirective$:t,values:e});let i$1 = class i{constructor(t){}get _$AU(){return this._$AM._$AU}_$AT(t,e,i){this._$Ct=t,this._$AM=e,this._$Ci=i;}_$AS(t,e){return this.update(t,e)}update(t,e){return this.render(...e)}};
+
+/**
+ * @license
+ * Copyright 2018 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */const e=e$1(class extends i$1{constructor(t$1){if(super(t$1),t$1.type!==t.ATTRIBUTE||"class"!==t$1.name||t$1.strings?.length>2)throw Error("`classMap()` can only be used in the `class` attribute and must be the only part in the attribute.")}render(t){return " "+Object.keys(t).filter((s=>t[s])).join(" ")+" "}update(s,[i]){if(void 0===this.st){this.st=new Set,void 0!==s.strings&&(this.nt=new Set(s.strings.join(" ").split(/\s/).filter((t=>""!==t))));for(const t in i)i[t]&&!this.nt?.has(t)&&this.st.add(t);return this.render(i)}const r=s.element.classList;for(const t of this.st)t in i||(r.remove(t),this.st.delete(t));for(const t in i){const s=!!i[t];s===this.st.has(t)||this.nt?.has(t)||(s?(r.add(t),this.st.add(t)):(r.remove(t),this.st.delete(t)));}return w}});
+
+/**
+ * @license
+ * Copyright 2018 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */const n="important",i=" !"+n,o=e$1(class extends i$1{constructor(t$1){if(super(t$1),t$1.type!==t.ATTRIBUTE||"style"!==t$1.name||t$1.strings?.length>2)throw Error("The `styleMap` directive must be used in the `style` attribute and must be the only part in the attribute.")}render(t){return Object.keys(t).reduce(((e,r)=>{const s=t[r];return null==s?e:e+`${r=r.includes("-")?r:r.replace(/(?:^(webkit|moz|ms|o)|)(?=[A-Z])/g,"-$&").toLowerCase()}:${s};`}),"")}update(e,[r]){const{style:s}=e.element;if(void 0===this.ft)return this.ft=new Set(Object.keys(r)),this.render(r);for(const t of this.ft)null==r[t]&&(this.ft.delete(t),t.includes("-")?s.removeProperty(t):s[t]=null);for(const t in r){const e=r[t];if(null!=e){this.ft.add(t);const r="string"==typeof e&&e.endsWith(i);t.includes("-")||r?s.setProperty(t,r?e.slice(0,-11):e,r?n:""):s[t]=e;}}return w}});
+
+const bounce = 'linear(0, 0.004, 0.016, 0.035, 0.063, 0.098, 0.141 13.6%, 0.25, 0.391, 0.563, 0.765, 1, 0.891 40.9%, 0.848, 0.813, 0.785, 0.766, 0.754, 0.75, 0.754, 0.766, 0.785, 0.813, 0.848, 0.891 68.2%, 1 72.7%, 0.973, 0.953, 0.941, 0.938, 0.941, 0.953, 0.973, 1, 0.988, 0.984, 0.988, 1)';
+const spring = 'linear(0, 0.009, 0.035 2.1%, 0.141, 0.281 6.7%, 0.723 12.9%, 0.938 16.7%, 1.017, 1.077, 1.121, 1.149 24.3%, 1.159, 1.163, 1.161, 1.154 29.9%, 1.129 32.8%, 1.051 39.6%, 1.017 43.1%, 0.991, 0.977 51%, 0.974 53.8%, 0.975 57.1%, 0.997 69.8%, 1.003 76.9%, 1.004 83.8%, 1)';
+
+const cssVars = i$4 `
+  :host {
+    --primary: var(--bw-primary, #f25c2b);
+    --secondary: var(--bw-secondary, #172a41);
+    --button: var(--bw-primary, #da2e3a);
+    --foreground: var(--bw-foreground, white);
+    --input-border: var(--bw-input-border, #dbe2eb);
+    --input-foreground: var(--wb-input-foreground, var(--secondary));
+    --input-background: var(--wb-input-background, white);
+    --backdrop: var(--wb-backdrop, #00000077);
+    --z-index: var(--wb-z-index, 9999);
+
+    --spring-easing: ${r$5(spring)};
+
+    --bounce-easing: ${r$5(bounce)};
+  }
+`;
+
+const wallet = (attrs) => b `<svg
+  width="32"
+  height="22"
+  viewBox="0 0 32 22"
+  fill="none"
+  xmlns="http://www.w3.org/2000/svg"
+  class=${attrs === null || attrs === void 0 ? void 0 : attrs.class}
+  style=${attrs === null || attrs === void 0 ? void 0 : attrs.style}
+>
+  <g>
+    <path
+      fill-rule="evenodd"
+      clip-rule="evenodd"
+      d="M29.2312 0H2.7688C1.24278 0 0 1.24278 0 2.7688V18.7688C0 20.2959 1.24278 21.5376 2.7688 21.5376H29.2301C30.7572 21.5376 31.9989 20.2948 31.9989 18.7688V14.7691H22.1525C21.6431 14.7691 21.2296 14.3555 21.2296 13.8461V7.69254C21.2296 7.18315 21.6431 6.7696 22.1525 6.7696H31.9989V2.7688C31.9989 1.2417 30.7561 0 29.2301 0H29.2312ZM8.92347 18.1582C7.76038 18.1582 6.69206 17.7532 5.85098 17.0769V17.554C5.85098 17.7037 5.85098 17.778 5.8219 17.8351C5.79606 17.8857 5.75513 17.9266 5.70559 17.9514C5.64852 17.9805 5.57421 17.9805 5.42451 17.9805H4.43266C4.28404 17.9805 4.20866 17.9805 4.15158 17.9514C4.10096 17.9256 4.06112 17.8846 4.03527 17.8351C4.00619 17.778 4.00619 17.7037 4.00619 17.554V4.02558C4.00619 3.87588 4.00619 3.80158 4.03527 3.7445C4.06112 3.69388 4.10204 3.65296 4.15158 3.62819C4.20866 3.59911 4.28296 3.59911 4.43266 3.59911H5.42451C5.57313 3.59911 5.64852 3.59911 5.70559 3.62819C5.75621 3.65404 5.79606 3.69496 5.8219 3.7445C5.85098 3.80158 5.85098 3.87696 5.85098 4.02558V9.37686C6.69314 8.70055 7.76146 8.29562 8.92347 8.29562C11.6384 8.29562 13.8397 10.5033 13.8397 13.2269C13.8397 15.9505 11.6384 18.1582 8.92347 18.1582Z"
+      fill="currentColor"
+    />
+    <path
+      d="M8.92308 16.3091C10.62 16.3091 11.9956 14.9292 11.9956 13.227C11.9956 11.5247 10.62 10.1448 8.92308 10.1448C7.22619 10.1448 5.85059 11.5247 5.85059 13.227C5.85059 14.9292 7.22619 16.3091 8.92308 16.3091Z"
+      fill="currentColor"
+    />
+    <path
+      fill-rule="evenodd"
+      clip-rule="evenodd"
+      d="M23.0771 12.9232H32.0006V8.61548H23.0771V12.9232ZM24.615 9.84641H25.8459C26.3553 9.84641 26.7689 10.26 26.7689 10.7693C26.7689 11.2787 26.3553 11.6923 25.8459 11.6923H24.615C24.1056 11.6923 23.6921 11.2787 23.6921 10.7693C23.6921 10.26 24.1056 9.84641 24.615 9.84641Z"
+      fill="currentColor"
+    />
+  </g>
+</svg>`;
+const blotout = (attrs) => b `<svg
+  width="26"
+  height="36"
+  viewBox="0 0 26 36"
+  fill="none"
+  xmlns="http://www.w3.org/2000/svg"
+  class=${attrs === null || attrs === void 0 ? void 0 : attrs.class}
+  style=${attrs === null || attrs === void 0 ? void 0 : attrs.style}
+>
+  <path
+    fill-rule="evenodd"
+    clip-rule="evenodd"
+    d="M0.830995 0.42104C0.75879 0.56208 0.758789 0.746712 0.758789 1.11598V34.5089C0.758789 34.8782 0.75879 35.0628 0.830995 35.2038C0.894508 35.3279 0.995851 35.4288 1.1205 35.4921C1.26221 35.5638 1.44772 35.5638 1.81874 35.5638H4.28515C4.65617 35.5638 4.84167 35.5638 4.98338 35.4921C5.10803 35.4288 5.20938 35.3279 5.27289 35.2038C5.3451 35.0628 5.3451 34.8782 5.3451 34.5089V33.3303C7.4389 35.0007 10.0967 36 12.9889 36C19.7435 36 25.2191 30.5502 25.2191 23.8275C25.2191 17.1049 19.7435 11.6552 12.9889 11.6552C10.0967 11.6552 7.4389 12.6544 5.3451 14.3249V1.11598C5.3451 0.746712 5.3451 0.56208 5.27289 0.42104C5.20938 0.296978 5.10803 0.196112 4.98338 0.132899C4.84167 0.0610352 4.65617 0.0610352 4.28515 0.0610352H1.81874C1.44772 0.0610352 1.26221 0.0610352 1.1205 0.132899C0.995851 0.196112 0.894508 0.296978 0.830995 0.42104ZM5.3451 23.8275C5.3451 28.0292 8.76736 31.4353 12.9889 31.4353C17.2105 31.4353 20.6328 28.0292 20.6328 23.8275C20.6328 19.626 17.2105 16.2198 12.9889 16.2198C8.76736 16.2198 5.3451 19.626 5.3451 23.8275Z"
+    fill="currentColor"
+  />
+</svg>`;
+const wink = (attrs) => b `<svg
+  width="18"
+  height="18"
+  viewBox="0 0 18 18"
+  fill="none"
+  xmlns="http://www.w3.org/2000/svg"
+  class=${attrs === null || attrs === void 0 ? void 0 : attrs.class}
+  style=${attrs === null || attrs === void 0 ? void 0 : attrs.style}
+>
+  <g>
+    <path
+      d="M9.5 1.125C7.94248 1.125 6.41992 1.58686 5.12489 2.45218C3.82985 3.31749 2.82049 4.5474 2.22445 5.98637C1.62841 7.42534 1.47246 9.00874 1.77632 10.5363C2.08018 12.0639 2.8302 13.4671 3.93154 14.5685C5.03288 15.6698 6.43607 16.4198 7.96367 16.7237C9.49127 17.0275 11.0747 16.8716 12.5136 16.2756C13.9526 15.6795 15.1825 14.6702 16.0478 13.3751C16.9131 12.0801 17.375 10.5575 17.375 9C17.375 6.91142 16.5453 4.90838 15.0685 3.43153C13.5916 1.95469 11.5886 1.125 9.5 1.125ZM9.5 15.75C8.16498 15.75 6.85994 15.3541 5.7499 14.6124C4.63987 13.8707 3.77471 12.8165 3.26382 11.5831C2.75293 10.3497 2.61925 8.99251 2.8797 7.68314C3.14015 6.37377 3.78303 5.17103 4.72703 4.22703C5.67104 3.28302 6.87377 2.64015 8.18314 2.3797C9.49252 2.11925 10.8497 2.25292 12.0831 2.76381C13.3165 3.2747 14.3707 4.13987 15.1124 5.2499C15.8541 6.35993 16.25 7.66498 16.25 9C16.25 10.7902 15.5388 12.5071 14.273 13.773C13.0071 15.0388 11.2902 15.75 9.5 15.75Z"
+      fill="currentColor"
+    />
+    <path
+      d="M12.0313 6.1875C11.7531 6.1875 11.4812 6.26997 11.25 6.4245C11.0187 6.57902 10.8385 6.79864 10.732 7.0556C10.6256 7.31256 10.5978 7.59531 10.652 7.8681C10.7063 8.14088 10.8402 8.39145 11.0369 8.58812C11.2335 8.78479 11.4841 8.91872 11.7569 8.97298C12.0297 9.02724 12.3124 8.99939 12.5694 8.89296C12.8264 8.78652 13.046 8.60628 13.2005 8.37502C13.355 8.14376 13.4375 7.87188 13.4375 7.59375C13.4375 7.22079 13.2893 6.8631 13.0256 6.59938C12.7619 6.33566 12.4042 6.1875 12.0313 6.1875Z"
+      fill="currentColor"
+    />
+    <path d="M8.375 7.3125H5V8.4375H8.375V7.3125Z" fill="white" />
+    <path
+      d="M9.49961 13.5001C10.2761 13.4988 11.039 13.2966 11.7142 12.9132C12.3893 12.5298 12.9538 11.9782 13.3527 11.312L12.3909 10.7495C12.0907 11.248 11.6667 11.6604 11.1601 11.9467C10.6535 12.233 10.0815 12.3834 9.49961 12.3834C8.91771 12.3834 8.3457 12.233 7.83911 11.9467C7.33251 11.6604 6.90854 11.248 6.60836 10.7495L5.64648 11.312C6.04539 11.9782 6.60987 12.5298 7.28506 12.9132C7.96024 13.2966 8.72315 13.4988 9.49961 13.5001Z"
+      fill="currentColor"
+    />
+  </g>
+</svg> `;
+const cross = (attrs) => b `<svg
+  width="32"
+  height="32"
+  viewBox="0 0 32 32"
+  fill="none"
+  xmlns="http://www.w3.org/2000/svg"
+  class=${attrs === null || attrs === void 0 ? void 0 : attrs.class}
+  style=${attrs === null || attrs === void 0 ? void 0 : attrs.style}
+>
+  <g>
+    <path
+      d="M17.4141 16L24 9.4141L22.5859 8L16 14.5859L9.4143 8L8 9.4141L14.5859 16L8 22.5859L9.4143 24L16 17.4141L22.5859 24L24 22.5859L17.4141 16Z"
+      fill="currentColor"
+    />
+  </g>
+</svg> `;
+
+const fadeInDialog = (element) => {
+    const dialogAnimation = element.animate([
+        { transform: 'translateY(-20px)', opacity: 0 },
+        { transform: 'translateY(0)', opacity: 1 },
+    ], { duration: 600, easing: spring, composite: 'add' });
+    const backdropAnimation = element.animate([{ opacity: 0 }, { opacity: 1 }], {
+        duration: 300,
+        easing: 'ease-out',
+        pseudoElement: '::backdrop',
+        fill: 'forwards',
+    });
+    return Promise.all([dialogAnimation.finished, backdropAnimation.finished]);
+};
+const fadeOutToBottom = (element) => {
+    const dialogAnimation = element.animate([
+        { transform: 'translateY(0)', opacity: 1 },
+        { transform: 'translateY(20px)', opacity: 0 },
+    ], { duration: 600, easing: spring });
+    const backdropAnimation = element.animate([{ opacity: 1 }, { opacity: 0 }], {
+        duration: 300,
+        easing: 'ease-out',
+        pseudoElement: '::backdrop',
+        fill: 'forwards',
+    });
+    return Promise.all([dialogAnimation.finished, backdropAnimation.finished]);
+};
+const springInFromLeft = (element, offset = '100%') => element.animate([{ transform: `translateX(-${offset})` }, { transform: 'translateX(0)' }], { duration: 600, easing: bounce, composite: 'add' }).finished;
+const springInFromRight = (element, offset = '100%') => element.animate([{ transform: `translateX(${offset})` }, { transform: 'translateX(0)' }], { duration: 600, easing: bounce, composite: 'add' }).finished;
+const springInFromTop = (element, offset = '100%') => element.animate([{ transform: `translateY(-${offset})` }, { transform: 'translateY(0)' }], { duration: 600, easing: bounce, composite: 'add' }).finished;
+const springInFromBottom = (element, offset = '100%') => element.animate([{ transform: `translateY(${offset})` }, { transform: 'translateY(0)' }], { duration: 600, easing: bounce, composite: 'add' }).finished;
+const springOutToLeft = (element, offset = '100%') => element.animate([{ transform: 'translateX(0)' }, { transform: `translateX(-${offset})` }], { duration: 600, easing: bounce, composite: 'add' }).finished;
+const springOutToRight = (element, offset = '100%') => element.animate([{ transform: 'translateX(0)' }, { transform: `translateX(${offset})` }], { duration: 600, easing: bounce, composite: 'add' }).finished;
+const springOutToTop = (element, offset = '100%') => element.animate([{ transform: 'translateY(0)' }, { transform: `translateY(-${offset})` }], { duration: 600, easing: bounce, composite: 'add' }).finished;
+const springOutToBottom = (element, offset = '100%') => element.animate([{ transform: 'translateY(0)' }, { transform: `translateY(${offset})` }], { duration: 600, easing: bounce, composite: 'add' }).finished;
+
+const validPositions = new Set([
+    'bottom',
+    'bottom-left',
+    'bottom-right',
+    'left',
+    'right',
+    'top',
+    'top-left',
+    'top-right',
+]);
 const getItemKey = (item) => `${item.productId}-${item.variantId}`;
-const syncCartItems = async (api, storeApi) => {
-    try {
-        const [wallet, shopItems] = await Promise.all([
-            api.getCart(),
-            storeApi.getCart(),
+const wait = (timeout) => new Promise((res) => setTimeout(res, timeout));
+let BlotoutWallet = class BlotoutWallet extends s {
+    constructor() {
+        super(...arguments);
+        this._buttonVisible = false;
+        this._bannerVisible = false;
+        this._hasItemsInWallet = false;
+        this._hasEmail = false;
+        this.onWalletUpdated = () => {
+            const cart = this._walletApi.cart;
+            this._hasItemsInWallet = cart.items.length > 0;
+            if (this._hasItemsInWallet || !this._hasEmail) {
+                this.showButton();
+            }
+            else if (!this._hasItemsInWallet && this._hasEmail) {
+                this.hideButton();
+            }
+        };
+        this.onSubmit = (ev) => {
+            var _a;
+            ev.preventDefault();
+            ev.stopPropagation();
+            const modalAnimation = this.hideModal();
+            const email = (_a = this._email) === null || _a === void 0 ? void 0 : _a.value.trim();
+            if (email) {
+                this._walletApi.saveEmail(email)
+                    .then(() => {
+                    this._email.value = '';
+                    this._hasEmail = true;
+                    this.dispatchEvent(new CustomEvent('blotout-wallet-email-saved', { bubbles: true }));
+                })
+                    .catch((err) => console.error(err));
+            }
+            if (this._hasItemsInWallet) {
+                this._storeApi.clearCart()
+                    .then(() => this._storeApi.addItems(this._walletApi.cart.items))
+                    .then(() => this._walletApi.restore())
+                    .then(() => {
+                    this.dispatchEvent(new CustomEvent('blotout-wallet-restored', { bubbles: true }));
+                    return modalAnimation.then(() => this.showRestorationBanner());
+                })
+                    .catch((err) => console.error(err));
+            }
+        };
+        this.showRestorationBanner = async () => {
+            this._bannerVisible = true;
+            await new Promise(requestAnimationFrame);
+            await springInFromBottom(this._banner, '120%');
+            await wait(5000);
+            await springOutToBottom(this._banner, '120%');
+            this._bannerVisible = false;
+        };
+    }
+    get _storeApi() {
+        var _a;
+        return (_a = window[registryKey]) === null || _a === void 0 ? void 0 : _a.storeAPI;
+    }
+    get _walletApi() {
+        var _a;
+        return (_a = window[registryKey]) === null || _a === void 0 ? void 0 : _a.walletAPI;
+    }
+    get _position() {
+        return validPositions.has(this.position) ? this.position : 'bottom-left';
+    }
+    connectedCallback() {
+        var _a;
+        super.connectedCallback();
+        this._unsubscribe = (_a = this._walletApi) === null || _a === void 0 ? void 0 : _a.subscribe(this.onWalletUpdated);
+        this.syncItems().then((hasItemsSaved) => {
+            this.dispatchEvent(new CustomEvent('blotout-wallet-loaded', { bubbles: true }));
+            this._hasItemsInWallet = hasItemsSaved;
+            if (this._hasItemsInWallet) {
+                this.showButton();
+            }
+        });
+    }
+    disconnectedCallback() {
+        var _a;
+        super.disconnectedCallback();
+        (_a = this._unsubscribe) === null || _a === void 0 ? void 0 : _a.call(this);
+        this._unsubscribe = undefined;
+    }
+    async syncItems() {
+        if (!this._walletApi || !this._storeApi) {
+            console.error('The required APIs are not available');
+            return false;
+        }
+        const [savedCart, shopItems] = await Promise.all([
+            this._walletApi.getCart(),
+            this._storeApi.getCart(),
         ]);
-        const lookup = new Map(wallet === null || wallet === void 0 ? void 0 : wallet.items.map((item) => [getItemKey(item), item]));
+        this._hasEmail = savedCart.email;
+        const savedItemsLookup = new Map(savedCart.items.map((item) => [getItemKey(item), item]));
         const missingItems = [];
         for (const item of shopItems) {
-            const walletItem = lookup.get(getItemKey(item));
+            const walletItem = savedItemsLookup.get(getItemKey(item));
             if (!walletItem) {
                 missingItems.push(item);
             }
@@ -206,63 +526,442 @@ const syncCartItems = async (api, storeApi) => {
             }
         }
         if (missingItems.length > 0) {
-            await api.addItems(missingItems);
+            await this._walletApi.addItems(missingItems);
+        }
+        return savedCart.items.length > 0;
+    }
+    async showButton() {
+        if (this._buttonVisible) {
+            return;
+        }
+        this._buttonVisible = true;
+        await new Promise(requestAnimationFrame).then(() => {
+            switch (this._position) {
+                case 'top-left':
+                case 'left':
+                case 'bottom-left': {
+                    return springInFromLeft(this._button);
+                }
+                case 'top-right':
+                case 'right':
+                case 'bottom-right': {
+                    return springInFromRight(this._button);
+                }
+                case 'bottom': {
+                    return springInFromBottom(this._button);
+                }
+                case 'top': {
+                    return springInFromTop(this._button);
+                }
+                default: {
+                    return springInFromLeft(this._button);
+                }
+            }
+        });
+        this.dispatchEvent(new CustomEvent('blotout-wallet-shown', { bubbles: true }));
+    }
+    async hideButton() {
+        if (!this._buttonVisible) {
+            return;
+        }
+        switch (this._position) {
+            case 'top-left':
+            case 'left':
+            case 'bottom-left': {
+                await springOutToLeft(this._button);
+                break;
+            }
+            case 'top-right':
+            case 'right':
+            case 'bottom-right': {
+                await springOutToRight(this._button);
+                break;
+            }
+            case 'bottom': {
+                await springOutToBottom(this._button);
+                break;
+            }
+            case 'top': {
+                await springOutToTop(this._button);
+                break;
+            }
+            default: {
+                await springOutToLeft(this._button);
+            }
         }
+        this._buttonVisible = false;
+        this.dispatchEvent(new CustomEvent('blotout-wallet-hidden', { bubbles: true }));
+    }
+    async showModal() {
+        this._dialog.showModal();
+        await new Promise(requestAnimationFrame);
+        await fadeInDialog(this._dialog);
     }
-    catch (err) {
-        logger.error(err);
+    async hideModal() {
+        await fadeOutToBottom(this._dialog);
+        this._dialog.close();
+    }
+    render() {
+        return x `
+      <button
+        class="${e({
+            cta: true,
+            [this._position]: true,
+            hidden: !this._buttonVisible,
+        })}"
+        @click=${this.showModal}
+      >
+        ${wallet({ class: 'icon' })}
+      </button>
+
+      <dialog>
+        <button class="dismiss" @click=${this.hideModal}>${cross()}</button>
+        ${blotout({ class: 'logo' })}
+        <form method="dialog" @submit=${this.onSubmit}>
+          ${this._hasItemsInWallet
+            ? x `<p>
+                Hey! Your <strong>cart has expired!</strong><br />But we've got
+                you covered. ${wink({ style: 'vertical-align:middle' })}
+              </p>`
+            : x `<p>
+                Carts expire in 7 days.<br />But we can save your carts for life
+                ${wink({ style: 'vertical-align:middle' })}
+              </p>`}
+
+          <p>
+            <input
+              type="email"
+              name="email"
+              placeholder="Enter your email ID"
+              ?required=${!this._hasEmail}
+              style=${o({
+            display: this._hasEmail ? 'none' : 'block',
+        })}
+            />
+          </p>
+          <p>
+            <button class="restore" type="submit">
+              ${this._hasItemsInWallet ? 'Restore Cart' : 'Save Cart'}
+            </button>
+          </p>
+        </form>
+      </dialog>
+
+      <div
+        class="banner"
+        style=${o({ display: this._bannerVisible ? '' : 'none' })}
+      >
+        ${blotout({
+            class: 'logo',
+            style: 'height: 18px',
+        })}
+        <div>Cart restored!</div>
+      </div>
+    `;
     }
 };
+BlotoutWallet.styles = [
+    cssVars,
+    i$4 `
+      * {
+        box-sizing: border-box;
+        font-family: inherit;
+        font-size: 16px;
+        line-height: 24px;
+      }
+
+      strong {
+        font-weight: bold;
+      }
+
+      button {
+        cursor: pointer;
+      }
+
+      .cta {
+        position: fixed;
+        z-index: var(--z-index);
+        background: var(--button);
+        color: var(--foreground);
+        padding: 8px;
+        border: none;
+      }
+
+      .top-left {
+        border-radius: 0 4px 4px 0;
+        left: 0;
+        top: 4px;
+      }
+
+      .top {
+        border-radius: 0 0 4px 4px;
+        left: 50%;
+        top: 0;
+        transform: translateX(-50%);
+      }
+
+      .top-right {
+        border-radius: 4px 0 0 4px;
+        right: 0;
+        top: 4px;
+      }
+
+      .left {
+        border-radius: 0 4px 4px 0;
+        left: 0;
+        top: 50%;
+        transform: translateY(-50%);
+      }
+
+      .right {
+        border-radius: 4px 0 0 4px;
+        right: 0;
+        top: 50%;
+        transform: translateY(-50%);
+      }
+
+      .bottom-left {
+        border-radius: 0 4px 4px 0;
+        left: 0;
+        bottom: 4px;
+      }
+
+      .bottom {
+        border-radius: 4px 4px 0 0;
+        left: 50%;
+        bottom: 0;
+        transform: translateX(-50%);
+      }
+
+      .bottom-right {
+        border-radius: 4px 0 0 4px;
+        right: 0;
+        bottom: 4px;
+      }
+
+      .hidden {
+        display: none;
+      }
+
+      .icon {
+        display: block;
+      }
+
+      .logo {
+        color: var(--primary);
+      }
+
+      dialog {
+        position: relative;
+        width: 430px;
+        max-width: 100vw;
+        background: var(--secondary);
+        color: var(--foreground);
+        border: 0 solid transparent;
+        border-top: 4px solid var(--primary);
+        border-radius: 20px;
+        padding: 24px;
+        text-align: center;
+      }
+
+      dialog::backdrop {
+        background: var(--backdrop);
+        backdrop-filter: blur(4px);
+      }
+
+      .dismiss {
+        position: absolute;
+        right: 20px;
+        top: 20px;
+        padding: 0;
+        border: 0;
+        border: 0;
+        background: transparent;
+        color: var(--foreground);
+        cursor: pointer;
+      }
+
+      .dismiss > svg {
+        display: block;
+        width: 32px;
+        height: 32px;
+      }
+
+      input[name='email'] {
+        box-sizing: border-box;
+        width: 100%;
+        border: 1px solid var(--input-border);
+        color: var(--input-foreground);
+        background: var(--input-background);
+        padding: 10px 16px;
+        border-radius: 5px;
+      }
+
+      input[name='email']::placeholder {
+        color: var(--input-foreground);
+      }
+
+      .restore {
+        width: 100%;
+        border: none;
+        color: var(--foreground);
+        background: var(--primary);
+        border-radius: 5px;
+        padding: 10px 16px;
+      }
+
+      .banner {
+        position: fixed;
+        z-index: var(--z-index);
+        bottom: 8px;
+        left: 50%;
+        padding: 12px 32px;
+        border-radius: 32px;
+        transform: translateX(-50%);
+        color: var(--foreground);
+        background: var(--secondary);
+        border: none;
+        border-bottom: 3px solid var(--primary);
+        display: flex;
+        gap: 8px;
+        align-items: center;
+        pointer-events: none;
+      }
+    `,
+];
+__decorate([
+    n$1({ type: String }),
+    __metadata("design:type", Object)
+], BlotoutWallet.prototype, "position", void 0);
+__decorate([
+    e$2('dialog'),
+    __metadata("design:type", HTMLDialogElement)
+], BlotoutWallet.prototype, "_dialog", void 0);
+__decorate([
+    e$2('button.cta'),
+    __metadata("design:type", HTMLButtonElement)
+], BlotoutWallet.prototype, "_button", void 0);
+__decorate([
+    e$2('input[name=email]'),
+    __metadata("design:type", HTMLInputElement)
+], BlotoutWallet.prototype, "_email", void 0);
+__decorate([
+    e$2('.banner'),
+    __metadata("design:type", HTMLDivElement)
+], BlotoutWallet.prototype, "_banner", void 0);
+__decorate([
+    r(),
+    __metadata("design:type", Boolean)
+], BlotoutWallet.prototype, "_buttonVisible", void 0);
+__decorate([
+    r(),
+    __metadata("design:type", Boolean)
+], BlotoutWallet.prototype, "_bannerVisible", void 0);
+__decorate([
+    r(),
+    __metadata("design:type", Boolean)
+], BlotoutWallet.prototype, "_hasItemsInWallet", void 0);
+__decorate([
+    r(),
+    __metadata("design:type", Boolean)
+], BlotoutWallet.prototype, "_hasEmail", void 0);
+BlotoutWallet = __decorate([
+    t$1('blotout-wallet')
+], BlotoutWallet);
+
 const init = (params) => {
-    var _a;
-    if (window && document && !getComponent()) {
-        const element = document.createElement('blotout-wallet');
-        element.setAttribute('tag-name', params.manifest.tagName);
-        setComponent(element);
-        const api = new WalletAPI({
+    var _a, _b;
+    if (window && document && !window[registryKey].wallet) {
+        window[registryKey].walletAPI = new WalletAPI({
             baseUrl: params.baseUrl,
             userId: params.userId,
         });
-        setAPI(api);
-        const store = (_a = window[symbol]) === null || _a === void 0 ? void 0 : _a.call(window);
+        const store = (window[registryKey].storeAPI =
+            (_b = (_a = window[registryKey]).storeAPIFactory) === null || _b === void 0 ? void 0 : _b.call(_a));
         if (!store) {
             throw new Error('Implementation for store API missing!');
         }
+        const element = (window[registryKey].wallet =
+            document.createElement('blotout-wallet'));
+        element.setAttribute('tag-name', params.manifest.tagName);
         document.body.append(element);
-        syncCartItems(api, store);
     }
 };
 
+const canLog = () => {
+    try {
+        return localStorage.getItem('edgeTagDebug') === '1';
+    }
+    catch {
+        return false;
+    }
+};
+const logger = {
+    log: (...args) => {
+        if (canLog()) {
+            console.log(...args);
+        }
+    },
+    error: (...args) => {
+        if (canLog()) {
+            console.error(...args);
+        }
+    },
+    info: (...args) => {
+        if (canLog()) {
+            console.info(...args);
+        }
+    },
+    trace: (...args) => {
+        if (canLog()) {
+            console.trace(...args);
+        }
+    },
+    table: (...args) => {
+        if (canLog()) {
+            console.table(...args);
+        }
+    },
+    dir: (...args) => {
+        if (canLog()) {
+            console.dir(...args);
+        }
+    },
+};
+
 const transformItems = (data) => {
     var _a;
     return (_a = data.contents) === null || _a === void 0 ? void 0 : _a.map((item) => ({
         productId: item.id,
         variantId: item.variantId || null,
-        name: item.description || '',
+        name: item.title || item.description || '',
         amount: parseInt(item.quantity.toString()),
         value: parseFloat(item.item_price.toString()),
     }));
 };
 const tag = (params) => {
-    const api = getAPI();
+    const wallet = window[registryKey].walletAPI;
+    if (!wallet) {
+        return;
+    }
     switch (params.eventName) {
         case 'AddToCart': {
             const items = transformItems(params.data);
             if (items) {
-                api.addItems(items).catch(logger.error);
+                wallet.addItems(items).catch(logger.error);
             }
             return;
         }
         case 'InitiateCheckout': {
             const items = transformItems(params.data);
             if (items) {
-                api.setItems(items).catch(logger.error);
+                wallet.setItems(items).catch(logger.error);
             }
             return;
         }
         case 'Purchase': {
             const { orderId } = params.data;
-            api.purchase(orderId).catch(logger.error);
+            wallet.purchase(orderId).catch(logger.error);
             return;
         }
     }