@blotoutio/providers-blotout-wallet-sdk 0.61.0 → 0.62.0

package/index.cjs.js

@@ -34,6 +34,8 @@ new Set([
     ...expand('911,921,922,923,924,926,927,932,933,935,942,944,946,950,953,955,957-958,960-969,974,975,976,977,981-982,987,988,990-999'),
 ]);
 
+const delay = (n, resolvedValue) => new Promise((resolve) => setTimeout(() => resolve(resolvedValue), n));
+
 const customAttributes = {
     '--bw-primary': { type: 'color', defaultValue: '#000000' },
     '--bw-title-color': { type: 'color', defaultValue: '#000000' },
@@ -362,31 +364,43 @@ const cssVars = i$4 `
   }
 `;
 
+const isGecko = () => /\bGecko\/\d+/.test(navigator.userAgent);
+
 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 animations = [
+        element.animate([
+            { transform: 'translateY(-20px)', opacity: 0 },
+            { transform: 'translateY(0)', opacity: 1 },
+        ], { duration: 600, easing: spring, composite: 'add' }),
+    ];
+    // Gecko does not support animating ::backdrop pseudo elements
+    if (!isGecko()) {
+        animations.push(element.animate([{ opacity: 0 }, { opacity: 1 }], {
+            duration: 300,
+            easing: 'ease-out',
+            pseudoElement: '::backdrop',
+            fill: 'forwards',
+        }));
+    }
+    return Promise.all(animations.map((anim) => anim.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 animations = [
+        element.animate([
+            { transform: 'translateY(0)', opacity: 1 },
+            { transform: 'translateY(20px)', opacity: 0 },
+        ], { duration: 600, easing: spring }),
+    ];
+    // Gecko does not support animating ::backdrop pseudo elements
+    if (!isGecko()) {
+        animations.push(element.animate([{ opacity: 1 }, { opacity: 0 }], {
+            duration: 300,
+            easing: 'ease-out',
+            pseudoElement: '::backdrop',
+            fill: 'forwards',
+        }));
+    }
+    return Promise.all(animations.map((anim) => anim.finished));
 };
 const flipOut = (element) => {
     const animation = element.animate([
@@ -449,7 +463,6 @@ const formatString = (str) => {
     const parts = str.split(/<\s*br\s*\/?\s*>/);
     return o(parts, x `<br />`);
 };
-const delay = (n, resolvedValue) => new Promise((resolve) => setTimeout(() => resolve(resolvedValue), n));
 let BlotoutWallet = class BlotoutWallet extends s {
     constructor() {
         super(...arguments);
@@ -462,78 +475,76 @@ let BlotoutWallet = class BlotoutWallet extends s {
                 .then(() => (this.state = newState))
                 .then(() => flipIn(this.dialog));
         };
+        this.restoreCart = async () => {
+            if (!this.lastExpiredCart) {
+                return;
+            }
+            const email = this.email.value.trim().toLowerCase();
+            if (email) {
+                window.edgetag('user', 'email', email, {}, { destination: this.edgeURL });
+                const response = await fetch(this.getUrl('/user/email'), {
+                    method: 'POST',
+                    body: JSON.stringify({
+                        email: email,
+                    }),
+                    headers: this.getHeaders(true),
+                });
+                if (!response.ok) {
+                    throw new Error(`Could not save email ${response.status}: ${await response.text()}`);
+                }
+                this.email.value = '';
+                this.hasEmail = true;
+                this.dispatchEvent(new CustomEvent('blotout-wallet-email-saved', { bubbles: true }));
+                window.edgetag('tag', 'CartRecovery_KeepCartEmailSaved', {}, {}, { destination: this.edgeURL });
+            }
+            await this.storeApi.addItems(this.lastExpiredCart.items);
+            const expiredCartId = this.lastExpiredCart.cartId;
+            // this cookie will be cleared once the next event is processed
+            setCookie(cartTokenLinkCookie, expiredCartId, { path: '/' });
+            // We attempt to mark the cart as restored, but if the request fails,
+            // we log the error in the console and let the user continue. Since the
+            // problem is probably in the `/cart/restore` endpoint, further attempts
+            // would not resolve the problem, which would just increase the number
+            // of failed calls and not solve the problem.
+            const response = await fetch(this.getUrl(`/cart/restore/${expiredCartId}`), {
+                method: 'POST',
+                headers: this.getHeaders(),
+            });
+            if (!response.ok) {
+                throw new Error(`Could not update status in DB - ${response.status}: ${response.text}\n\n${await response.text()}`);
+            }
+            this.lastExpiredCart = undefined;
+            this.dispatchEvent(new CustomEvent('blotout-wallet-restored', {
+                bubbles: true,
+            }));
+            // Send the request as beacon as there could be a immediate redirect in the next step
+            window.edgetag('tag', 'CartRecovery_CartRestored', { isSilent: !!this.silentRestore }, {}, { method: 'beacon' });
+        };
         this.onSubmit = async (ev) => {
             ev.preventDefault();
             ev.stopPropagation();
-            const email = this.email.value.trim().toLowerCase();
             try {
                 await this.transitionTo('loading');
-                if (email) {
-                    window.edgetag('user', 'email', email, {}, { destination: this.edgeURL });
-                    const response = await fetch(this.getUrl('/user/email'), {
-                        method: 'POST',
-                        body: JSON.stringify({
-                            email: email,
-                        }),
-                        headers: this.getHeaders(true),
-                    });
-                    if (!response.ok) {
-                        throw new Error(`Could not save email ${response.status}: ${await response.text()}`);
-                    }
-                    this.email.value = '';
-                    this.hasEmail = true;
-                    this.dispatchEvent(new CustomEvent('blotout-wallet-email-saved', { bubbles: true }));
-                    window.edgetag('tag', 'CartRecovery_KeepCartEmailSaved', {}, {}, { destination: this.edgeURL });
-                }
-                if (this.lastExpiredCart) {
-                    await this.storeApi.addItems(this.lastExpiredCart.items);
-                    this.dispatchEvent(new CustomEvent('blotout-wallet-restored', {
-                        bubbles: true,
-                    }));
-                    const expiredCartId = this.lastExpiredCart.cartId;
-                    // this cookie will be cleared once the next event is processed
-                    setCookie(cartTokenLinkCookie, expiredCartId, { path: '/' });
-                    // We attempt to mark the cart as restored, but if the request fails,
-                    // we log the error in the console and let the user continue. Since the
-                    // problem is probably in the `/cart/restore` endpoint, further attempts
-                    // would not resolve the problem, which would just increase the number
-                    // of failed calls and not solve the problem.
-                    fetch(this.getUrl(`/cart/restore/${expiredCartId}`), {
-                        method: 'POST',
-                        headers: this.getHeaders(),
-                    })
-                        .then(async (response) => {
-                        if (!response.ok) {
-                            throw new Error(`Could not update status in DB - ${response.status}: ${response.text}\n\n${await response.text()}`);
-                        }
-                        // Send the request as beacon as there could be a immediate redirect in the next step
-                        window.edgetag('tag', 'CartRecovery_CartRestored', {}, {}, { method: 'beacon' });
-                        // Redirect to custom path
-                        if (this.restoreRedirect) {
-                            try {
-                                const redirect = new URL(this.restoreRedirect, window.location.origin);
-                                window.location.href = redirect.href;
-                            }
-                            catch (e) {
-                                console.error('Invalid redirect URL', e);
-                            }
-                        }
-                    })
-                        .catch((err) => {
-                        console.error(err);
-                    });
-                    this.lastExpiredCart = undefined;
-                }
+                await this.restoreCart();
                 await this.transitionTo('restored');
-                delay(2000).then(() => {
-                    if (this.state == 'restored') {
-                        this.hideModal('restore');
+                await delay(2000);
+                if (this.state == 'restored') {
+                    this.hideModal('restore');
+                }
+                // Redirect to custom path
+                if (this.restoreRedirect) {
+                    try {
+                        const redirect = new URL(this.restoreRedirect, window.location.origin);
+                        window.location.href = redirect.href;
                     }
-                });
+                    catch (e) {
+                        console.error('Invalid redirect URL', e);
+                    }
+                }
             }
             catch (e) {
-                await this.transitionTo('failed');
                 logger.error(e);
+                await this.transitionTo('failed');
             }
         };
         this.onDialogClick = () => {
@@ -643,6 +654,7 @@ let BlotoutWallet = class BlotoutWallet extends s {
         }
     }
     async initialize() {
+        var _a;
         if (!this.userId) {
             logger.error('No UserId set');
             return;
@@ -651,11 +663,11 @@ let BlotoutWallet = class BlotoutWallet extends s {
             return;
         }
         await delay(POPUP_IMPRESSION_DELAY);
-        fetch(this.getUrl('/cart/expired'), {
-            method: 'GET',
-            headers: this.getHeaders(),
-        })
-            .then(async (response) => {
+        try {
+            const response = await fetch(this.getUrl('/cart/expired'), {
+                method: 'GET',
+                headers: this.getHeaders(),
+            });
             if (!response.ok) {
                 throw new Error(`Unable to get Expired Cart ${response.status}: ${await response.text()}`);
             }
@@ -663,16 +675,27 @@ let BlotoutWallet = class BlotoutWallet extends s {
             const result = await response.json();
             this.hasEmail = result.email;
             this.lastExpiredCart = result.carts[0];
-            if (result.carts && result.carts.length && !this.isPopUpDismissed) {
-                this.showModal();
-                window.edgetag('tag', 'CartRecovery_CartExpiredOnVisit', {}, {}, { destination: this.edgeURL });
+            if ((_a = result.carts) === null || _a === void 0 ? void 0 : _a.length) {
+                if (this.silentRestore) {
+                    this.restoreCart().catch(logger.error);
+                }
+                else if (!this.isPopUpDismissed) {
+                    this.showModal();
+                }
+                if (result.hasJustExpired) {
+                    window.edgetag('tag', 'CartRecovery_CartExpiredOnVisit', {}, {}, { destination: this.edgeURL });
+                }
             }
-        })
-            .catch(logger.error);
+        }
+        catch (err) {
+            logger.error(err);
+        }
     }
     showModal() {
         this.dialog.showModal();
-        new Promise(requestAnimationFrame).then(() => fadeInDialog(this.dialog));
+        new Promise(requestAnimationFrame)
+            .catch(logger.error)
+            .finally(() => fadeInDialog(this.dialog));
         this.dispatchEvent(new CustomEvent('blotout-wallet-shown', { bubbles: true }));
         fetch(this.getUrl('/user/event'), {
             method: 'POST',
@@ -681,7 +704,9 @@ let BlotoutWallet = class BlotoutWallet extends s {
         }).catch(logger.error);
     }
     hideModal(action) {
-        fadeOutToBottom(this.dialog).then(() => { var _a; return (_a = this.dialog) === null || _a === void 0 ? void 0 : _a.close(action); });
+        fadeOutToBottom(this.dialog)
+            .catch(logger.error)
+            .finally(() => { var _a; return (_a = this.dialog) === null || _a === void 0 ? void 0 : _a.close(action); });
         this.dispatchEvent(new CustomEvent('blotout-wallet-hidden', { bubbles: true }));
     }
     getHeaders(json = false) {
@@ -703,18 +728,20 @@ let BlotoutWallet = class BlotoutWallet extends s {
     }
     async skipCarts() {
         this.hideModal('skip');
-        await fetch(this.getUrl('/cart/skip'), {
-            method: 'POST',
-            headers: this.getHeaders(),
-        })
-            .then(async (response) => {
+        try {
+            const response = await fetch(this.getUrl('/cart/skip'), {
+                method: 'POST',
+                headers: this.getHeaders(),
+            });
             if (!response.ok) {
                 throw new Error(`Could not mark cart as skipped - ${response.status}: ${await response.text()}`);
             }
             window.edgetag('tag', 'CartRecovery_CartDeclined', {}, {}, { destination: this.edgeURL });
             this.lastExpiredCart = undefined;
-        })
-            .catch(logger.error);
+        }
+        catch (e) {
+            logger.error(e);
+        }
     }
     render() {
         if (this.isPopUpDismissed) {
@@ -893,7 +920,7 @@ BlotoutWallet = __decorate([
 ], BlotoutWallet);
 
 const init = (params) => {
-    var _a, _b, _c, _d, _e;
+    var _a, _b, _c, _d, _e, _f;
     if (
     // if loaded in non-browser SDKs
     !window ||
@@ -928,6 +955,7 @@ const init = (params) => {
         element.edgeURL = params.baseUrl;
         element.userId = params.userId;
         element.restoreRedirect = (_e = params.manifest.variables) === null || _e === void 0 ? void 0 : _e['restoreRedirect'];
+        element.silentRestore = ((_f = params.manifest.variables) === null || _f === void 0 ? void 0 : _f['silentRestore']) === '1';
         document.body.append(element);
     }
 };

package/index.js

@@ -35,6 +35,8 @@ var ProvidersBlotoutWalletSdk = (function () {
         ...expand('911,921,922,923,924,926,927,932,933,935,942,944,946,950,953,955,957-958,960-969,974,975,976,977,981-982,987,988,990-999'),
     ]);
 
+    const delay = (n, resolvedValue) => new Promise((resolve) => setTimeout(() => resolve(resolvedValue), n));
+
     const customAttributes = {
         '--bw-primary': { type: 'color', defaultValue: '#000000' },
         '--bw-title-color': { type: 'color', defaultValue: '#000000' },
@@ -363,31 +365,43 @@ var ProvidersBlotoutWalletSdk = (function () {
   }
 `;
 
+    const isGecko = () => /\bGecko\/\d+/.test(navigator.userAgent);
+
     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 animations = [
+            element.animate([
+                { transform: 'translateY(-20px)', opacity: 0 },
+                { transform: 'translateY(0)', opacity: 1 },
+            ], { duration: 600, easing: spring, composite: 'add' }),
+        ];
+        // Gecko does not support animating ::backdrop pseudo elements
+        if (!isGecko()) {
+            animations.push(element.animate([{ opacity: 0 }, { opacity: 1 }], {
+                duration: 300,
+                easing: 'ease-out',
+                pseudoElement: '::backdrop',
+                fill: 'forwards',
+            }));
+        }
+        return Promise.all(animations.map((anim) => anim.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 animations = [
+            element.animate([
+                { transform: 'translateY(0)', opacity: 1 },
+                { transform: 'translateY(20px)', opacity: 0 },
+            ], { duration: 600, easing: spring }),
+        ];
+        // Gecko does not support animating ::backdrop pseudo elements
+        if (!isGecko()) {
+            animations.push(element.animate([{ opacity: 1 }, { opacity: 0 }], {
+                duration: 300,
+                easing: 'ease-out',
+                pseudoElement: '::backdrop',
+                fill: 'forwards',
+            }));
+        }
+        return Promise.all(animations.map((anim) => anim.finished));
     };
     const flipOut = (element) => {
         const animation = element.animate([
@@ -450,7 +464,6 @@ var ProvidersBlotoutWalletSdk = (function () {
         const parts = str.split(/<\s*br\s*\/?\s*>/);
         return o(parts, x `<br />`);
     };
-    const delay = (n, resolvedValue) => new Promise((resolve) => setTimeout(() => resolve(resolvedValue), n));
     let BlotoutWallet = class BlotoutWallet extends s {
         constructor() {
             super(...arguments);
@@ -463,78 +476,76 @@ var ProvidersBlotoutWalletSdk = (function () {
                     .then(() => (this.state = newState))
                     .then(() => flipIn(this.dialog));
             };
+            this.restoreCart = async () => {
+                if (!this.lastExpiredCart) {
+                    return;
+                }
+                const email = this.email.value.trim().toLowerCase();
+                if (email) {
+                    window.edgetag('user', 'email', email, {}, { destination: this.edgeURL });
+                    const response = await fetch(this.getUrl('/user/email'), {
+                        method: 'POST',
+                        body: JSON.stringify({
+                            email: email,
+                        }),
+                        headers: this.getHeaders(true),
+                    });
+                    if (!response.ok) {
+                        throw new Error(`Could not save email ${response.status}: ${await response.text()}`);
+                    }
+                    this.email.value = '';
+                    this.hasEmail = true;
+                    this.dispatchEvent(new CustomEvent('blotout-wallet-email-saved', { bubbles: true }));
+                    window.edgetag('tag', 'CartRecovery_KeepCartEmailSaved', {}, {}, { destination: this.edgeURL });
+                }
+                await this.storeApi.addItems(this.lastExpiredCart.items);
+                const expiredCartId = this.lastExpiredCart.cartId;
+                // this cookie will be cleared once the next event is processed
+                setCookie(cartTokenLinkCookie, expiredCartId, { path: '/' });
+                // We attempt to mark the cart as restored, but if the request fails,
+                // we log the error in the console and let the user continue. Since the
+                // problem is probably in the `/cart/restore` endpoint, further attempts
+                // would not resolve the problem, which would just increase the number
+                // of failed calls and not solve the problem.
+                const response = await fetch(this.getUrl(`/cart/restore/${expiredCartId}`), {
+                    method: 'POST',
+                    headers: this.getHeaders(),
+                });
+                if (!response.ok) {
+                    throw new Error(`Could not update status in DB - ${response.status}: ${response.text}\n\n${await response.text()}`);
+                }
+                this.lastExpiredCart = undefined;
+                this.dispatchEvent(new CustomEvent('blotout-wallet-restored', {
+                    bubbles: true,
+                }));
+                // Send the request as beacon as there could be a immediate redirect in the next step
+                window.edgetag('tag', 'CartRecovery_CartRestored', { isSilent: !!this.silentRestore }, {}, { method: 'beacon' });
+            };
             this.onSubmit = async (ev) => {
                 ev.preventDefault();
                 ev.stopPropagation();
-                const email = this.email.value.trim().toLowerCase();
                 try {
                     await this.transitionTo('loading');
-                    if (email) {
-                        window.edgetag('user', 'email', email, {}, { destination: this.edgeURL });
-                        const response = await fetch(this.getUrl('/user/email'), {
-                            method: 'POST',
-                            body: JSON.stringify({
-                                email: email,
-                            }),
-                            headers: this.getHeaders(true),
-                        });
-                        if (!response.ok) {
-                            throw new Error(`Could not save email ${response.status}: ${await response.text()}`);
-                        }
-                        this.email.value = '';
-                        this.hasEmail = true;
-                        this.dispatchEvent(new CustomEvent('blotout-wallet-email-saved', { bubbles: true }));
-                        window.edgetag('tag', 'CartRecovery_KeepCartEmailSaved', {}, {}, { destination: this.edgeURL });
-                    }
-                    if (this.lastExpiredCart) {
-                        await this.storeApi.addItems(this.lastExpiredCart.items);
-                        this.dispatchEvent(new CustomEvent('blotout-wallet-restored', {
-                            bubbles: true,
-                        }));
-                        const expiredCartId = this.lastExpiredCart.cartId;
-                        // this cookie will be cleared once the next event is processed
-                        setCookie(cartTokenLinkCookie, expiredCartId, { path: '/' });
-                        // We attempt to mark the cart as restored, but if the request fails,
-                        // we log the error in the console and let the user continue. Since the
-                        // problem is probably in the `/cart/restore` endpoint, further attempts
-                        // would not resolve the problem, which would just increase the number
-                        // of failed calls and not solve the problem.
-                        fetch(this.getUrl(`/cart/restore/${expiredCartId}`), {
-                            method: 'POST',
-                            headers: this.getHeaders(),
-                        })
-                            .then(async (response) => {
-                            if (!response.ok) {
-                                throw new Error(`Could not update status in DB - ${response.status}: ${response.text}\n\n${await response.text()}`);
-                            }
-                            // Send the request as beacon as there could be a immediate redirect in the next step
-                            window.edgetag('tag', 'CartRecovery_CartRestored', {}, {}, { method: 'beacon' });
-                            // Redirect to custom path
-                            if (this.restoreRedirect) {
-                                try {
-                                    const redirect = new URL(this.restoreRedirect, window.location.origin);
-                                    window.location.href = redirect.href;
-                                }
-                                catch (e) {
-                                    console.error('Invalid redirect URL', e);
-                                }
-                            }
-                        })
-                            .catch((err) => {
-                            console.error(err);
-                        });
-                        this.lastExpiredCart = undefined;
-                    }
+                    await this.restoreCart();
                     await this.transitionTo('restored');
-                    delay(2000).then(() => {
-                        if (this.state == 'restored') {
-                            this.hideModal('restore');
+                    await delay(2000);
+                    if (this.state == 'restored') {
+                        this.hideModal('restore');
+                    }
+                    // Redirect to custom path
+                    if (this.restoreRedirect) {
+                        try {
+                            const redirect = new URL(this.restoreRedirect, window.location.origin);
+                            window.location.href = redirect.href;
                         }
-                    });
+                        catch (e) {
+                            console.error('Invalid redirect URL', e);
+                        }
+                    }
                 }
                 catch (e) {
-                    await this.transitionTo('failed');
                     logger.error(e);
+                    await this.transitionTo('failed');
                 }
             };
             this.onDialogClick = () => {
@@ -644,6 +655,7 @@ var ProvidersBlotoutWalletSdk = (function () {
             }
         }
         async initialize() {
+            var _a;
             if (!this.userId) {
                 logger.error('No UserId set');
                 return;
@@ -652,11 +664,11 @@ var ProvidersBlotoutWalletSdk = (function () {
                 return;
             }
             await delay(POPUP_IMPRESSION_DELAY);
-            fetch(this.getUrl('/cart/expired'), {
-                method: 'GET',
-                headers: this.getHeaders(),
-            })
-                .then(async (response) => {
+            try {
+                const response = await fetch(this.getUrl('/cart/expired'), {
+                    method: 'GET',
+                    headers: this.getHeaders(),
+                });
                 if (!response.ok) {
                     throw new Error(`Unable to get Expired Cart ${response.status}: ${await response.text()}`);
                 }
@@ -664,16 +676,27 @@ var ProvidersBlotoutWalletSdk = (function () {
                 const result = await response.json();
                 this.hasEmail = result.email;
                 this.lastExpiredCart = result.carts[0];
-                if (result.carts && result.carts.length && !this.isPopUpDismissed) {
-                    this.showModal();
-                    window.edgetag('tag', 'CartRecovery_CartExpiredOnVisit', {}, {}, { destination: this.edgeURL });
+                if ((_a = result.carts) === null || _a === void 0 ? void 0 : _a.length) {
+                    if (this.silentRestore) {
+                        this.restoreCart().catch(logger.error);
+                    }
+                    else if (!this.isPopUpDismissed) {
+                        this.showModal();
+                    }
+                    if (result.hasJustExpired) {
+                        window.edgetag('tag', 'CartRecovery_CartExpiredOnVisit', {}, {}, { destination: this.edgeURL });
+                    }
                 }
-            })
-                .catch(logger.error);
+            }
+            catch (err) {
+                logger.error(err);
+            }
         }
         showModal() {
             this.dialog.showModal();
-            new Promise(requestAnimationFrame).then(() => fadeInDialog(this.dialog));
+            new Promise(requestAnimationFrame)
+                .catch(logger.error)
+                .finally(() => fadeInDialog(this.dialog));
             this.dispatchEvent(new CustomEvent('blotout-wallet-shown', { bubbles: true }));
             fetch(this.getUrl('/user/event'), {
                 method: 'POST',
@@ -682,7 +705,9 @@ var ProvidersBlotoutWalletSdk = (function () {
             }).catch(logger.error);
         }
         hideModal(action) {
-            fadeOutToBottom(this.dialog).then(() => { var _a; return (_a = this.dialog) === null || _a === void 0 ? void 0 : _a.close(action); });
+            fadeOutToBottom(this.dialog)
+                .catch(logger.error)
+                .finally(() => { var _a; return (_a = this.dialog) === null || _a === void 0 ? void 0 : _a.close(action); });
             this.dispatchEvent(new CustomEvent('blotout-wallet-hidden', { bubbles: true }));
         }
         getHeaders(json = false) {
@@ -704,18 +729,20 @@ var ProvidersBlotoutWalletSdk = (function () {
         }
         async skipCarts() {
             this.hideModal('skip');
-            await fetch(this.getUrl('/cart/skip'), {
-                method: 'POST',
-                headers: this.getHeaders(),
-            })
-                .then(async (response) => {
+            try {
+                const response = await fetch(this.getUrl('/cart/skip'), {
+                    method: 'POST',
+                    headers: this.getHeaders(),
+                });
                 if (!response.ok) {
                     throw new Error(`Could not mark cart as skipped - ${response.status}: ${await response.text()}`);
                 }
                 window.edgetag('tag', 'CartRecovery_CartDeclined', {}, {}, { destination: this.edgeURL });
                 this.lastExpiredCart = undefined;
-            })
-                .catch(logger.error);
+            }
+            catch (e) {
+                logger.error(e);
+            }
         }
         render() {
             if (this.isPopUpDismissed) {
@@ -894,7 +921,7 @@ var ProvidersBlotoutWalletSdk = (function () {
     ], BlotoutWallet);
 
     const init = (params) => {
-        var _a, _b, _c, _d, _e;
+        var _a, _b, _c, _d, _e, _f;
         if (
         // if loaded in non-browser SDKs
         !window ||
@@ -929,6 +956,7 @@ var ProvidersBlotoutWalletSdk = (function () {
             element.edgeURL = params.baseUrl;
             element.userId = params.userId;
             element.restoreRedirect = (_e = params.manifest.variables) === null || _e === void 0 ? void 0 : _e['restoreRedirect'];
+            element.silentRestore = ((_f = params.manifest.variables) === null || _f === void 0 ? void 0 : _f['silentRestore']) === '1';
             document.body.append(element);
         }
     };

package/index.mjs

@@ -32,6 +32,8 @@ new Set([
     ...expand('911,921,922,923,924,926,927,932,933,935,942,944,946,950,953,955,957-958,960-969,974,975,976,977,981-982,987,988,990-999'),
 ]);
 
+const delay = (n, resolvedValue) => new Promise((resolve) => setTimeout(() => resolve(resolvedValue), n));
+
 const customAttributes = {
     '--bw-primary': { type: 'color', defaultValue: '#000000' },
     '--bw-title-color': { type: 'color', defaultValue: '#000000' },
@@ -360,31 +362,43 @@ const cssVars = i$4 `
   }
 `;
 
+const isGecko = () => /\bGecko\/\d+/.test(navigator.userAgent);
+
 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 animations = [
+        element.animate([
+            { transform: 'translateY(-20px)', opacity: 0 },
+            { transform: 'translateY(0)', opacity: 1 },
+        ], { duration: 600, easing: spring, composite: 'add' }),
+    ];
+    // Gecko does not support animating ::backdrop pseudo elements
+    if (!isGecko()) {
+        animations.push(element.animate([{ opacity: 0 }, { opacity: 1 }], {
+            duration: 300,
+            easing: 'ease-out',
+            pseudoElement: '::backdrop',
+            fill: 'forwards',
+        }));
+    }
+    return Promise.all(animations.map((anim) => anim.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 animations = [
+        element.animate([
+            { transform: 'translateY(0)', opacity: 1 },
+            { transform: 'translateY(20px)', opacity: 0 },
+        ], { duration: 600, easing: spring }),
+    ];
+    // Gecko does not support animating ::backdrop pseudo elements
+    if (!isGecko()) {
+        animations.push(element.animate([{ opacity: 1 }, { opacity: 0 }], {
+            duration: 300,
+            easing: 'ease-out',
+            pseudoElement: '::backdrop',
+            fill: 'forwards',
+        }));
+    }
+    return Promise.all(animations.map((anim) => anim.finished));
 };
 const flipOut = (element) => {
     const animation = element.animate([
@@ -447,7 +461,6 @@ const formatString = (str) => {
     const parts = str.split(/<\s*br\s*\/?\s*>/);
     return o(parts, x `<br />`);
 };
-const delay = (n, resolvedValue) => new Promise((resolve) => setTimeout(() => resolve(resolvedValue), n));
 let BlotoutWallet = class BlotoutWallet extends s {
     constructor() {
         super(...arguments);
@@ -460,78 +473,76 @@ let BlotoutWallet = class BlotoutWallet extends s {
                 .then(() => (this.state = newState))
                 .then(() => flipIn(this.dialog));
         };
+        this.restoreCart = async () => {
+            if (!this.lastExpiredCart) {
+                return;
+            }
+            const email = this.email.value.trim().toLowerCase();
+            if (email) {
+                window.edgetag('user', 'email', email, {}, { destination: this.edgeURL });
+                const response = await fetch(this.getUrl('/user/email'), {
+                    method: 'POST',
+                    body: JSON.stringify({
+                        email: email,
+                    }),
+                    headers: this.getHeaders(true),
+                });
+                if (!response.ok) {
+                    throw new Error(`Could not save email ${response.status}: ${await response.text()}`);
+                }
+                this.email.value = '';
+                this.hasEmail = true;
+                this.dispatchEvent(new CustomEvent('blotout-wallet-email-saved', { bubbles: true }));
+                window.edgetag('tag', 'CartRecovery_KeepCartEmailSaved', {}, {}, { destination: this.edgeURL });
+            }
+            await this.storeApi.addItems(this.lastExpiredCart.items);
+            const expiredCartId = this.lastExpiredCart.cartId;
+            // this cookie will be cleared once the next event is processed
+            setCookie(cartTokenLinkCookie, expiredCartId, { path: '/' });
+            // We attempt to mark the cart as restored, but if the request fails,
+            // we log the error in the console and let the user continue. Since the
+            // problem is probably in the `/cart/restore` endpoint, further attempts
+            // would not resolve the problem, which would just increase the number
+            // of failed calls and not solve the problem.
+            const response = await fetch(this.getUrl(`/cart/restore/${expiredCartId}`), {
+                method: 'POST',
+                headers: this.getHeaders(),
+            });
+            if (!response.ok) {
+                throw new Error(`Could not update status in DB - ${response.status}: ${response.text}\n\n${await response.text()}`);
+            }
+            this.lastExpiredCart = undefined;
+            this.dispatchEvent(new CustomEvent('blotout-wallet-restored', {
+                bubbles: true,
+            }));
+            // Send the request as beacon as there could be a immediate redirect in the next step
+            window.edgetag('tag', 'CartRecovery_CartRestored', { isSilent: !!this.silentRestore }, {}, { method: 'beacon' });
+        };
         this.onSubmit = async (ev) => {
             ev.preventDefault();
             ev.stopPropagation();
-            const email = this.email.value.trim().toLowerCase();
             try {
                 await this.transitionTo('loading');
-                if (email) {
-                    window.edgetag('user', 'email', email, {}, { destination: this.edgeURL });
-                    const response = await fetch(this.getUrl('/user/email'), {
-                        method: 'POST',
-                        body: JSON.stringify({
-                            email: email,
-                        }),
-                        headers: this.getHeaders(true),
-                    });
-                    if (!response.ok) {
-                        throw new Error(`Could not save email ${response.status}: ${await response.text()}`);
-                    }
-                    this.email.value = '';
-                    this.hasEmail = true;
-                    this.dispatchEvent(new CustomEvent('blotout-wallet-email-saved', { bubbles: true }));
-                    window.edgetag('tag', 'CartRecovery_KeepCartEmailSaved', {}, {}, { destination: this.edgeURL });
-                }
-                if (this.lastExpiredCart) {
-                    await this.storeApi.addItems(this.lastExpiredCart.items);
-                    this.dispatchEvent(new CustomEvent('blotout-wallet-restored', {
-                        bubbles: true,
-                    }));
-                    const expiredCartId = this.lastExpiredCart.cartId;
-                    // this cookie will be cleared once the next event is processed
-                    setCookie(cartTokenLinkCookie, expiredCartId, { path: '/' });
-                    // We attempt to mark the cart as restored, but if the request fails,
-                    // we log the error in the console and let the user continue. Since the
-                    // problem is probably in the `/cart/restore` endpoint, further attempts
-                    // would not resolve the problem, which would just increase the number
-                    // of failed calls and not solve the problem.
-                    fetch(this.getUrl(`/cart/restore/${expiredCartId}`), {
-                        method: 'POST',
-                        headers: this.getHeaders(),
-                    })
-                        .then(async (response) => {
-                        if (!response.ok) {
-                            throw new Error(`Could not update status in DB - ${response.status}: ${response.text}\n\n${await response.text()}`);
-                        }
-                        // Send the request as beacon as there could be a immediate redirect in the next step
-                        window.edgetag('tag', 'CartRecovery_CartRestored', {}, {}, { method: 'beacon' });
-                        // Redirect to custom path
-                        if (this.restoreRedirect) {
-                            try {
-                                const redirect = new URL(this.restoreRedirect, window.location.origin);
-                                window.location.href = redirect.href;
-                            }
-                            catch (e) {
-                                console.error('Invalid redirect URL', e);
-                            }
-                        }
-                    })
-                        .catch((err) => {
-                        console.error(err);
-                    });
-                    this.lastExpiredCart = undefined;
-                }
+                await this.restoreCart();
                 await this.transitionTo('restored');
-                delay(2000).then(() => {
-                    if (this.state == 'restored') {
-                        this.hideModal('restore');
+                await delay(2000);
+                if (this.state == 'restored') {
+                    this.hideModal('restore');
+                }
+                // Redirect to custom path
+                if (this.restoreRedirect) {
+                    try {
+                        const redirect = new URL(this.restoreRedirect, window.location.origin);
+                        window.location.href = redirect.href;
                     }
-                });
+                    catch (e) {
+                        console.error('Invalid redirect URL', e);
+                    }
+                }
             }
             catch (e) {
-                await this.transitionTo('failed');
                 logger.error(e);
+                await this.transitionTo('failed');
             }
         };
         this.onDialogClick = () => {
@@ -641,6 +652,7 @@ let BlotoutWallet = class BlotoutWallet extends s {
         }
     }
     async initialize() {
+        var _a;
         if (!this.userId) {
             logger.error('No UserId set');
             return;
@@ -649,11 +661,11 @@ let BlotoutWallet = class BlotoutWallet extends s {
             return;
         }
         await delay(POPUP_IMPRESSION_DELAY);
-        fetch(this.getUrl('/cart/expired'), {
-            method: 'GET',
-            headers: this.getHeaders(),
-        })
-            .then(async (response) => {
+        try {
+            const response = await fetch(this.getUrl('/cart/expired'), {
+                method: 'GET',
+                headers: this.getHeaders(),
+            });
             if (!response.ok) {
                 throw new Error(`Unable to get Expired Cart ${response.status}: ${await response.text()}`);
             }
@@ -661,16 +673,27 @@ let BlotoutWallet = class BlotoutWallet extends s {
             const result = await response.json();
             this.hasEmail = result.email;
             this.lastExpiredCart = result.carts[0];
-            if (result.carts && result.carts.length && !this.isPopUpDismissed) {
-                this.showModal();
-                window.edgetag('tag', 'CartRecovery_CartExpiredOnVisit', {}, {}, { destination: this.edgeURL });
+            if ((_a = result.carts) === null || _a === void 0 ? void 0 : _a.length) {
+                if (this.silentRestore) {
+                    this.restoreCart().catch(logger.error);
+                }
+                else if (!this.isPopUpDismissed) {
+                    this.showModal();
+                }
+                if (result.hasJustExpired) {
+                    window.edgetag('tag', 'CartRecovery_CartExpiredOnVisit', {}, {}, { destination: this.edgeURL });
+                }
             }
-        })
-            .catch(logger.error);
+        }
+        catch (err) {
+            logger.error(err);
+        }
     }
     showModal() {
         this.dialog.showModal();
-        new Promise(requestAnimationFrame).then(() => fadeInDialog(this.dialog));
+        new Promise(requestAnimationFrame)
+            .catch(logger.error)
+            .finally(() => fadeInDialog(this.dialog));
         this.dispatchEvent(new CustomEvent('blotout-wallet-shown', { bubbles: true }));
         fetch(this.getUrl('/user/event'), {
             method: 'POST',
@@ -679,7 +702,9 @@ let BlotoutWallet = class BlotoutWallet extends s {
         }).catch(logger.error);
     }
     hideModal(action) {
-        fadeOutToBottom(this.dialog).then(() => { var _a; return (_a = this.dialog) === null || _a === void 0 ? void 0 : _a.close(action); });
+        fadeOutToBottom(this.dialog)
+            .catch(logger.error)
+            .finally(() => { var _a; return (_a = this.dialog) === null || _a === void 0 ? void 0 : _a.close(action); });
         this.dispatchEvent(new CustomEvent('blotout-wallet-hidden', { bubbles: true }));
     }
     getHeaders(json = false) {
@@ -701,18 +726,20 @@ let BlotoutWallet = class BlotoutWallet extends s {
     }
     async skipCarts() {
         this.hideModal('skip');
-        await fetch(this.getUrl('/cart/skip'), {
-            method: 'POST',
-            headers: this.getHeaders(),
-        })
-            .then(async (response) => {
+        try {
+            const response = await fetch(this.getUrl('/cart/skip'), {
+                method: 'POST',
+                headers: this.getHeaders(),
+            });
             if (!response.ok) {
                 throw new Error(`Could not mark cart as skipped - ${response.status}: ${await response.text()}`);
             }
             window.edgetag('tag', 'CartRecovery_CartDeclined', {}, {}, { destination: this.edgeURL });
             this.lastExpiredCart = undefined;
-        })
-            .catch(logger.error);
+        }
+        catch (e) {
+            logger.error(e);
+        }
     }
     render() {
         if (this.isPopUpDismissed) {
@@ -891,7 +918,7 @@ BlotoutWallet = __decorate([
 ], BlotoutWallet);
 
 const init = (params) => {
-    var _a, _b, _c, _d, _e;
+    var _a, _b, _c, _d, _e, _f;
     if (
     // if loaded in non-browser SDKs
     !window ||
@@ -926,6 +953,7 @@ const init = (params) => {
         element.edgeURL = params.baseUrl;
         element.userId = params.userId;
         element.restoreRedirect = (_e = params.manifest.variables) === null || _e === void 0 ? void 0 : _e['restoreRedirect'];
+        element.silentRestore = ((_f = params.manifest.variables) === null || _f === void 0 ? void 0 : _f['silentRestore']) === '1';
         document.body.append(element);
     }
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@blotoutio/providers-blotout-wallet-sdk",
-  "version": "0.61.0",
+  "version": "0.62.0",
   "description": "Blotout Wallet SDK for EdgeTag",
   "author": "Blotout",
   "license": "MIT",