@automattic/newspack-blocks 2.0.0 → 2.1.0-alpha.1

package/dist/modal.asset.php

@@ -1 +1 @@
-<?php return array('dependencies' => array('wp-polyfill'), 'version' => '9d3099a89de627e950e7627d00dad08e');
+<?php return array('dependencies' => array('wp-polyfill'), 'version' => 'e544d521f12b6cc305696d5eb8522bff');

package/dist/modal.js

@@ -1 +1 @@
-(()=>{"use strict";var e={r:e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})}},t={};function n(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,o=new Array(t);n<t;n++)o[n]=e[n];return o}function o(e){return function(e){if(Array.isArray(e))return n(e)}(e)||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(e)||function(e,t){if(e){if("string"==typeof e)return n(e,t);var o=Object.prototype.toString.call(e).slice(8,-1);return"Object"===o&&e.constructor&&(o=e.constructor.name),"Map"===o||"Set"===o?Array.from(e):"Arguments"===o||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(o)?n(e,t):void 0}}(e)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}e.r(t);var r;function a(){var e=document.querySelector('iframe[name="newspack_modal_checkout"]');e&&(e.src="about:blank"),document.body.classList.remove("newspack-modal-checkout-open"),r&&r.disconnect(),Array.from(document.querySelectorAll(".newspack-blocks-modal")).forEach((function(e){var t,n;(e.style.display="none",e.overlayId&&null!==(t=window.newspackReaderActivation)&&void 0!==t&&t.overlays)&&(null===(n=window.newspackReaderActivation)||void 0===n||n.overlays.remove(e.overlayId))}))}window.newspackCloseModalCheckout=a;var c,l=".newspack-blocks-modal";c=function(){var e=document.querySelector(".newspack-blocks-checkout-modal");if(e){var t=document.querySelector("".concat(l,"__spinner")),n="newspack_modal_checkout",c=document.createElement("input");c.type="hidden",c.name="modal_checkout",c.value="1";var i=e.querySelector("".concat(l,"__content")),d=i.clientHeight+"px",u=document.createElement("iframe");u.name=n,i.appendChild(u),e.addEventListener("click",(function(t){t.target===e&&a()})),e.querySelectorAll("".concat(l,"__close")).forEach((function(e){e.addEventListener("click",(function(e){e.preventDefault(),i.style.height=d,t.style.display="flex",a()}))}));var s=document.querySelectorAll(".newspack-blocks-variation-modal");s.forEach((function(e){e.addEventListener("click",(function(t){t.target===e&&a()})),e.querySelectorAll(".newspack-blocks-modal__close").forEach((function(e){e.addEventListener("click",(function(e){e.preventDefault(),a()}))}))})),document.querySelectorAll(".wpbnbd.wpbnbd--platform-wc,.wp-block-newspack-blocks-checkout-button,.newspack-blocks-variation-modal").forEach((function(a){a.querySelectorAll("form").forEach((function(a){a.appendChild(c.cloneNode()),a.target=n;var l=a.querySelector('input[name="after_success_url"]'),d=a.querySelector('input[name="after_success_behavior"]');d&&l&&"referrer"===d.getAttribute("value")&&l.setAttribute("value",document.referrer||window.location.href),a.addEventListener("submit",(function(n){var c,l,d=new FormData(a);if(s.forEach((function(e){return e.style.display="none"})),d.get("is_variable")&&!d.get("variation_id")){var f=o(s).find((function(e){return e.dataset.productId===d.get("product_id")}));if(f)return n.preventDefault(),document.body.classList.add("newspack-modal-checkout-open"),void(f.style.display="block")}t.style.display="flex",e.style.display="block",document.body.classList.add("newspack-modal-checkout-open"),null!==(c=window.newspackReaderActivation)&&void 0!==c&&c.overlays&&(e.overlayId=null===(l=window.newspackReaderActivation)||void 0===l?void 0:l.overlays.add()),r=new ResizeObserver((function(e){if(e&&e.length){var n=e[0].contentRect;n&&(i.style.height=n.top+n.bottom+"px",t.style.display="none")}})),u.addEventListener("load",(function(){var e=u.contentWindow.location;if(window.newspackReaderActivation&&e.href.indexOf("order-received")>-1){var n=window.newspackReaderActivation,a=new Proxy(new URLSearchParams(e.search),{get:function(e,t){return e.get(t)}});a.email&&(n.setReaderEmail(a.email),n.setAuthenticated(!0))}var c=u.contentDocument.querySelector("#newspack_modal_checkout");c&&r.observe(c),o(u.contentDocument.querySelectorAll(".modal-continue, .edit-billing-link")).forEach((function(e){e.addEventListener("click",(function(){return t.style.display="flex"}))}));var l=u.contentDocument.querySelector(".checkout");l&&o(l.querySelectorAll(".woocommerce-billing-fields input")).forEach((function(e){e.addEventListener("keyup",(function(e){"Enter"===e.key&&(t.style.display="flex",l.submit())}))}))}))}))}))}))}},"undefined"!=typeof document&&("complete"!==document.readyState&&"interactive"!==document.readyState?document.addEventListener("DOMContentLoaded",c):c());var i=window;for(var d in t)i[d]=t[d];t.__esModule&&Object.defineProperty(i,"__esModule",{value:!0})})();
+(()=>{"use strict";var e={r:e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})}},t={};function n(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,o=new Array(t);n<t;n++)o[n]=e[n];return o}function o(e){return function(e){if(Array.isArray(e))return n(e)}(e)||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(e)||function(e,t){if(e){if("string"==typeof e)return n(e,t);var o=Object.prototype.toString.call(e).slice(8,-1);return"Object"===o&&e.constructor&&(o=e.constructor.name),"Map"===o||"Set"===o?Array.from(e):"Arguments"===o||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(o)?n(e,t):void 0}}(e)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}e.r(t);var r;function c(){var e=document.querySelector('iframe[name="newspack_modal_checkout"]');e&&(e.src="about:blank"),document.body.classList.remove("newspack-modal-checkout-open"),r&&r.disconnect(),Array.from(document.querySelectorAll(".newspack-blocks-modal")).forEach((function(e){var t,n;(e.style.display="none",e.overlayId&&null!==(t=window.newspackReaderActivation)&&void 0!==t&&t.overlays)&&(null===(n=window.newspackReaderActivation)||void 0===n||n.overlays.remove(e.overlayId))}))}window.newspackCloseModalCheckout=c;var a,l=".newspack-blocks-modal";a=function(){var e=document.querySelector(".newspack-blocks-checkout-modal");if(e){var t=document.querySelector("".concat(l,"__spinner")),n="newspack_modal_checkout",a=document.createElement("input");a.type="hidden",a.name="modal_checkout",a.value="1";var i=e.querySelector("".concat(l,"__content")),d=i.clientHeight+"px",u=document.createElement("iframe");u.name=n,i.appendChild(u),e.addEventListener("click",(function(t){t.target===e&&c()})),e.querySelectorAll("".concat(l,"__close")).forEach((function(e){e.addEventListener("click",(function(e){e.preventDefault(),i.style.height=d,t.style.display="flex",c()}))}));var s=document.querySelectorAll(".newspack-blocks-variation-modal");s.forEach((function(e){e.addEventListener("click",(function(t){t.target===e&&c()})),e.querySelectorAll(".newspack-blocks-modal__close").forEach((function(e){e.addEventListener("click",(function(e){e.preventDefault(),c()}))}))})),document.querySelectorAll(".wpbnbd.wpbnbd--platform-wc,.wp-block-newspack-blocks-checkout-button,.newspack-blocks-variation-modal").forEach((function(c){c.querySelectorAll("form").forEach((function(c){c.appendChild(a.cloneNode()),c.target=n;var l=c.querySelector('input[name="after_success_url"]'),d=c.querySelector('input[name="after_success_behavior"]');d&&l&&"referrer"===d.getAttribute("value")&&l.setAttribute("value",document.referrer||window.location.href),c.addEventListener("submit",(function(n){var a,l,d=new FormData(c);if(s.forEach((function(e){return e.style.display="none"})),d.get("is_variable")&&!d.get("variation_id")){var f=o(s).find((function(e){return e.dataset.productId===d.get("product_id")}));if(f)return f.querySelectorAll('form[target="newspack_modal_checkout"]').forEach((function(e){["after_success_behavior","after_success_url","after_success_button_label"].forEach((function(t){var n=document.createElement("input");n.type="hidden",n.name=t,n.value=d.get(t),e.appendChild(n)}))})),n.preventDefault(),document.body.classList.add("newspack-modal-checkout-open"),void(f.style.display="block")}t.style.display="flex",e.style.display="block",document.body.classList.add("newspack-modal-checkout-open"),null!==(a=window.newspackReaderActivation)&&void 0!==a&&a.overlays&&(e.overlayId=null===(l=window.newspackReaderActivation)||void 0===l?void 0:l.overlays.add()),r=new ResizeObserver((function(e){if(e&&e.length){var n=e[0].contentRect;n&&(i.style.height=n.top+n.bottom+"px",t.style.display="none")}})),u.addEventListener("load",(function(){var e=u.contentWindow.location;if(window.newspackReaderActivation&&e.href.indexOf("order-received")>-1){var n=window.newspackReaderActivation,c=new Proxy(new URLSearchParams(e.search),{get:function(e,t){return e.get(t)}});c.email&&(n.setReaderEmail(c.email),n.setAuthenticated(!0))}var a=u.contentDocument.querySelector("#newspack_modal_checkout");a&&r.observe(a),o(u.contentDocument.querySelectorAll(".modal-continue, .edit-billing-link")).forEach((function(e){e.addEventListener("click",(function(){return t.style.display="flex"}))}));var l=u.contentDocument.querySelector(".checkout");l&&o(l.querySelectorAll(".woocommerce-billing-fields input")).forEach((function(e){e.addEventListener("keyup",(function(e){"Enter"===e.key&&(t.style.display="flex",l.submit())}))}))}))}))}))}))}},"undefined"!=typeof document&&("complete"!==document.readyState&&"interactive"!==document.readyState?document.addEventListener("DOMContentLoaded",a):a());var i=window;for(var d in t)i[d]=t[d];t.__esModule&&Object.defineProperty(i,"__esModule",{value:!0})})();

package/dist/modalCheckout.asset.php

@@ -1 +1 @@
-<?php return array('dependencies' => array('wp-polyfill'), 'version' => 'b1f62d78326801157cf83d3b15ba6ff2');
+<?php return array('dependencies' => array('wp-polyfill'), 'version' => '92cca2d330580cefedef8f3e75b4e10d');

package/dist/modalCheckout.css

@@ -1 +1 @@
-#newspack_modal_checkout{padding:32px;font-size:1rem}#newspack_modal_checkout .order-details-summary{border:2px solid;border-radius:3px;padding:16px}#newspack_modal_checkout .order-details-summary h4{font-size:1rem;margin:0}#newspack_modal_checkout .order-details-summary h4>span{color:inherit;font-size:clamp(1.75rem,1.75rem + (1vw - .48rem)*.962,2.25rem);font-weight:700;line-height:1.434}#newspack_modal_checkout .order-details-summary h4 .subscription-details{font-size:1rem;font-weight:400}#newspack_modal_checkout #order-details-wrapper.hidden{display:none}#newspack_modal_checkout .woocommerce-checkout-review-order-table,#newspack_modal_checkout .woocommerce-NoticeGroup{margin-top:16px}#newspack_modal_checkout .woocommerce-checkout-review-order-table td,#newspack_modal_checkout .woocommerce-checkout-review-order-table th{font-size:.8rem}#newspack_modal_checkout .woocommerce-checkout-review-order-table.empty{display:none;margin:0;padding:0}#newspack_modal_checkout .woocommerce-billing-fields{margin-bottom:16px}#newspack_modal_checkout .checkout-billing-summary{border-bottom:1px solid #ccc;padding-bottom:32px}#newspack_modal_checkout .checkout-billing-summary__grid{align-items:baseline;display:flex;flex-wrap:wrap;gap:8px;justify-content:space-between}#newspack_modal_checkout .checkout-billing-summary p{font-size:clamp(.75rem,.75rem + (1vw - .48rem)*.481,1rem);margin:16px 0 0}#newspack_modal_checkout .checkout-billing-summary .edit-billing-link{color:#767676;font-size:clamp(.75rem,.75rem + (1vw - .48rem)*.481,1rem);display:inline-block;text-decoration:underline}#newspack_modal_checkout .checkout-billing-summary .edit-billing-link:focus,#newspack_modal_checkout .checkout-billing-summary .edit-billing-link:hover{color:inherit}#newspack_modal_checkout .woocommerce-account-fields .create-account{border-bottom:1px solid #ccc;padding-bottom:32px}#newspack_modal_checkout .woocommerce-account-fields .create-account .woocommerce-password-hint,#newspack_modal_checkout .woocommerce-account-fields .create-account .woocommerce-password-strength{color:#cc1818;margin-top:16px}#newspack_modal_checkout form,#newspack_modal_checkout form #wc-stripe-payment-request-button-separator{margin:0}#newspack_modal_checkout form .woocommerce-terms-and-conditions-wrapper{margin:16px 0}#newspack_modal_checkout form h3{font-size:1.37rem;margin:32px 0 0}#newspack_modal_checkout form p{margin:16px 0}#newspack_modal_checkout form .select2-container .select2-selection--single{margin:0}#newspack_modal_checkout form #payment button#place_order{margin-bottom:0}#newspack_modal_checkout form .checkout-billing button[type=submit],#newspack_modal_checkout form button.modal-continue{display:block;width:100%}#newspack_modal_checkout .form-row-first,#newspack_modal_checkout .form-row-last{width:calc(50% - 8px)}#newspack_modal_checkout .form-row-last+.form-row-first,#newspack_modal_checkout .form-row-wide+.form-row-first,#newspack_modal_checkout .form-row-wide+.form-row-first+.form-row-last{margin-top:0}#newspack_modal_checkout .select2-container--default .select2-selection--single{border-color:#ccc;border-radius:0;height:44px}#newspack_modal_checkout .select2-container--default .select2-selection--single .select2-selection__rendered{color:inherit;line-height:44px}#newspack_modal_checkout .select2-container--default .select2-selection--single .select2-selection__arrow{height:42px}#newspack_modal_checkout .wc_payment_method .payment_box{background:#f0f0f0;border-radius:3px;padding:16px}#newspack_modal_checkout .wc_payment_method .payment_box p{margin-top:0}#newspack_modal_checkout .wc-saved-payment-methods{padding:0}#newspack_modal_checkout .woocommerce-error{border-radius:3px;margin:0}#newspack_modal_checkout .woocommerce-notices-wrapper:not(:empty){margin-bottom:32px}#newspack_modal_checkout .woocommerce-privacy-policy-text{color:#767676}#newspack_modal_checkout .woocommerce-privacy-policy-text p{font-size:clamp(.75rem,.75rem + (1vw - .48rem)*.481,1rem);margin:0}#newspack_modal_checkout .woocommerce-thankyou-order-received{align-items:center;border-bottom:1px solid #ccc;display:flex;flex-direction:column;justify-content:center;margin:0 0 32px;padding:0 0 32px}#newspack_modal_checkout .woocommerce-thankyou-order-received:before{-webkit-animation:bounce .25s ease-in;animation:bounce .25s ease-in;-webkit-animation-delay:1s;animation-delay:1s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;background-color:#4ab866;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16.7 7.1l-6.3 8.5-3.3-2.5-.9 1.2 4.5 3.4L17.9 8z' fill='%23fff'/%3E%3C/svg%3E");background-position:50% 50%;background-repeat:no-repeat;background-size:24px;border-radius:50%;content:"";display:block;height:40px;margin-bottom:16px;padding:8px;transform:scale(0);width:40px}#newspack_modal_checkout .woocommerce-form-login-toggle,#newspack_modal_checkout .woocommerce-thankyou-order-received+.woocommerce-info{display:none}#newspack_modal_checkout .woocommerce-order-overview{color:#767676;list-style:none;margin:16px 0 0;padding:0}#newspack_modal_checkout .blockOverlay{align-items:center;display:flex;inset:0;justify-content:center;position:fixed!important}#newspack_modal_checkout .blockOverlay:after{-webkit-animation:spin 1s linear infinite;animation:spin 1s linear infinite;border:2px solid #fff;border-top-color:#767676;border-radius:50%;content:"";display:block;height:25px;width:25px}.newspack-modal-newsletters{margin-top:20px;padding-top:22px;border-top:1px solid #ccc}.newspack-modal-newsletters__info{margin-bottom:35px}.newspack-modal-newsletters__info span{color:#767676}.newspack-modal-newsletters__list-item{display:flex;margin-bottom:18px;border:1px solid #ccc;border-radius:6px}.newspack-modal-newsletters__list-item b{display:block;margin-bottom:2px}.newspack-modal-newsletters label{flex:1;padding:12px;cursor:pointer}.newspack-modal-newsletters input[type=checkbox]{padding:10px;margin-top:18px;margin-right:19px;margin-left:20px;border-radius:5px}.newspack-modal-newsletters__button,.newspack-modal-newsletters input[type=submit]{margin-top:25px;width:100%;padding:22px;font-size:1em}@-webkit-keyframes bounce{0%{transform:scale(0)}90%{transform:scale(1.4)}to{transform:scale(1)}}@keyframes bounce{0%{transform:scale(0)}90%{transform:scale(1.4)}to{transform:scale(1)}}
+#newspack_modal_checkout{padding:32px;font-size:1rem}#newspack_modal_checkout .order-details-summary{border:2px solid;border-radius:3px;padding:16px}#newspack_modal_checkout .order-details-summary h4{font-size:1rem;margin:0}#newspack_modal_checkout .order-details-summary h4>span{color:inherit;font-size:clamp(1.75rem,1.75rem + (1vw - .48rem)*.962,2.25rem);font-weight:700;line-height:1.434}#newspack_modal_checkout .order-details-summary h4 .subscription-details{font-size:1rem;font-weight:400}#newspack_modal_checkout #order-details-wrapper.hidden{display:none}#newspack_modal_checkout .woocommerce-checkout-review-order-table,#newspack_modal_checkout .woocommerce-NoticeGroup{margin-top:16px}#newspack_modal_checkout .woocommerce-checkout-review-order-table td,#newspack_modal_checkout .woocommerce-checkout-review-order-table th{font-size:.8rem}#newspack_modal_checkout .woocommerce-checkout-review-order-table.empty{display:none;margin:0;padding:0}#newspack_modal_checkout .woocommerce-billing-fields{margin-bottom:16px}#newspack_modal_checkout .checkout-billing-summary{border-bottom:1px solid #ccc;padding-bottom:32px}#newspack_modal_checkout .checkout-billing-summary__grid{align-items:baseline;display:flex;flex-wrap:wrap;gap:8px;justify-content:space-between}#newspack_modal_checkout .checkout-billing-summary p{font-size:clamp(.75rem,.75rem + (1vw - .48rem)*.481,1rem);margin:16px 0 0}#newspack_modal_checkout .checkout-billing-summary .edit-billing-link{color:#767676;font-size:clamp(.75rem,.75rem + (1vw - .48rem)*.481,1rem);display:inline-block;text-decoration:underline}#newspack_modal_checkout .checkout-billing-summary .edit-billing-link:focus,#newspack_modal_checkout .checkout-billing-summary .edit-billing-link:hover{color:inherit}#newspack_modal_checkout .woocommerce-account-fields .create-account{border-bottom:1px solid #ccc;padding-bottom:32px}#newspack_modal_checkout .woocommerce-account-fields .create-account .woocommerce-password-hint,#newspack_modal_checkout .woocommerce-account-fields .create-account .woocommerce-password-strength{color:#cc1818;margin-top:16px}#newspack_modal_checkout form,#newspack_modal_checkout form #wc-stripe-payment-request-button-separator{margin:0}#newspack_modal_checkout form .woocommerce-terms-and-conditions-wrapper{margin:16px 0}#newspack_modal_checkout form h3{font-size:1.37rem;margin:32px 0 0}#newspack_modal_checkout form p{margin:16px 0}#newspack_modal_checkout form .select2-container .select2-selection--single{margin:0}#newspack_modal_checkout form #payment button#place_order{margin-bottom:0}#newspack_modal_checkout form .checkout-billing button[type=submit],#newspack_modal_checkout form button.modal-continue{display:block;width:100%}#newspack_modal_checkout .form-row-first,#newspack_modal_checkout .form-row-last{width:calc(50% - 8px)}#newspack_modal_checkout .form-row-last+.form-row-first,#newspack_modal_checkout .form-row-wide+.form-row-first,#newspack_modal_checkout .form-row-wide+.form-row-first+.form-row-last{margin-top:0}#newspack_modal_checkout .select2-container--default .select2-selection--single{border-color:#ccc;border-radius:0;height:44px}#newspack_modal_checkout .select2-container--default .select2-selection--single .select2-selection__rendered{color:inherit;line-height:44px}#newspack_modal_checkout .select2-container--default .select2-selection--single .select2-selection__arrow{height:42px}#newspack_modal_checkout .wc_payment_method .payment_box{background:#f0f0f0;border-radius:3px;padding:16px}#newspack_modal_checkout .wc_payment_method .payment_box p{margin-top:0}#newspack_modal_checkout .wc-saved-payment-methods{padding:0}#newspack_modal_checkout .woocommerce-error{border-radius:3px;margin:0}#newspack_modal_checkout .woocommerce-notices-wrapper:not(:empty){margin-bottom:32px}#newspack_modal_checkout .woocommerce-privacy-policy-text{color:#767676}#newspack_modal_checkout .woocommerce-privacy-policy-text p{font-size:clamp(.75rem,.75rem + (1vw - .48rem)*.481,1rem);margin:0}#newspack_modal_checkout .woocommerce-thankyou-order-received{align-items:center;border-bottom:1px solid #ccc;display:flex;flex-direction:column;justify-content:center;margin:0 0 32px;padding:0 0 32px}#newspack_modal_checkout .woocommerce-thankyou-order-received:before{-webkit-animation:bounce .25s ease-in;animation:bounce .25s ease-in;-webkit-animation-delay:1s;animation-delay:1s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;background-color:#4ab866;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16.7 7.1l-6.3 8.5-3.3-2.5-.9 1.2 4.5 3.4L17.9 8z' fill='%23fff'/%3E%3C/svg%3E");background-position:50% 50%;background-repeat:no-repeat;background-size:24px;border-radius:50%;content:"";display:block;height:40px;margin-bottom:16px;padding:8px;transform:scale(0);width:40px}#newspack_modal_checkout .woocommerce-form-login-toggle,#newspack_modal_checkout .woocommerce-thankyou-order-received+.woocommerce-info{display:none}#newspack_modal_checkout .woocommerce-order-overview{color:#767676;list-style:none;margin:16px 0 0;padding:0}#newspack_modal_checkout .blockOverlay{align-items:center;display:flex;inset:0;justify-content:center;position:fixed!important}#newspack_modal_checkout .blockOverlay:after{-webkit-animation:spin 1s linear infinite;animation:spin 1s linear infinite;border:2px solid #fff;border-top-color:#767676;border-radius:50%;content:"";display:block;height:25px;width:25px}.newspack-modal-newsletters{margin-top:20px;padding-top:22px;border-top:1px solid #ccc}.newspack-modal-newsletters__info{margin-bottom:35px}.newspack-modal-newsletters__info span{color:#767676}.newspack-modal-newsletters__list-item{display:flex;margin-bottom:18px;border:1px solid #ccc;border-radius:6px}.newspack-modal-newsletters__list-item b{display:block;margin-bottom:2px}.newspack-modal-newsletters label{flex:1;padding:12px;cursor:pointer}.newspack-modal-newsletters input[type=checkbox]{padding:10px;margin-top:18px;margin-right:19px;margin-left:20px;border-radius:5px}.newspack-modal-newsletters__button,.newspack-modal-newsletters input[type=submit]{margin-top:25px;width:100%;padding:22px!important;font-size:1em!important}@-webkit-keyframes bounce{0%{transform:scale(0)}90%{transform:scale(1.4)}to{transform:scale(1)}}@keyframes bounce{0%{transform:scale(0)}90%{transform:scale(1.4)}to{transform:scale(1)}}

package/dist/modalCheckout.rtl.css

@@ -1 +1 @@
-#newspack_modal_checkout{padding:32px;font-size:1rem}#newspack_modal_checkout .order-details-summary{border:2px solid;border-radius:3px;padding:16px}#newspack_modal_checkout .order-details-summary h4{font-size:1rem;margin:0}#newspack_modal_checkout .order-details-summary h4>span{color:inherit;font-size:clamp(1.75rem,1.75rem + (1vw - .48rem)*.962,2.25rem);font-weight:700;line-height:1.434}#newspack_modal_checkout .order-details-summary h4 .subscription-details{font-size:1rem;font-weight:400}#newspack_modal_checkout #order-details-wrapper.hidden{display:none}#newspack_modal_checkout .woocommerce-checkout-review-order-table,#newspack_modal_checkout .woocommerce-NoticeGroup{margin-top:16px}#newspack_modal_checkout .woocommerce-checkout-review-order-table td,#newspack_modal_checkout .woocommerce-checkout-review-order-table th{font-size:.8rem}#newspack_modal_checkout .woocommerce-checkout-review-order-table.empty{display:none;margin:0;padding:0}#newspack_modal_checkout .woocommerce-billing-fields{margin-bottom:16px}#newspack_modal_checkout .checkout-billing-summary{border-bottom:1px solid #ccc;padding-bottom:32px}#newspack_modal_checkout .checkout-billing-summary__grid{align-items:baseline;display:flex;flex-wrap:wrap;gap:8px;justify-content:space-between}#newspack_modal_checkout .checkout-billing-summary p{font-size:clamp(.75rem,.75rem + (1vw - .48rem)*.481,1rem);margin:16px 0 0}#newspack_modal_checkout .checkout-billing-summary .edit-billing-link{color:#767676;font-size:clamp(.75rem,.75rem + (1vw - .48rem)*.481,1rem);display:inline-block;text-decoration:underline}#newspack_modal_checkout .checkout-billing-summary .edit-billing-link:focus,#newspack_modal_checkout .checkout-billing-summary .edit-billing-link:hover{color:inherit}#newspack_modal_checkout .woocommerce-account-fields .create-account{border-bottom:1px solid #ccc;padding-bottom:32px}#newspack_modal_checkout .woocommerce-account-fields .create-account .woocommerce-password-hint,#newspack_modal_checkout .woocommerce-account-fields .create-account .woocommerce-password-strength{color:#cc1818;margin-top:16px}#newspack_modal_checkout form,#newspack_modal_checkout form #wc-stripe-payment-request-button-separator{margin:0}#newspack_modal_checkout form .woocommerce-terms-and-conditions-wrapper{margin:16px 0}#newspack_modal_checkout form h3{font-size:1.37rem;margin:32px 0 0}#newspack_modal_checkout form p{margin:16px 0}#newspack_modal_checkout form .select2-container .select2-selection--single{margin:0}#newspack_modal_checkout form #payment button#place_order{margin-bottom:0}#newspack_modal_checkout form .checkout-billing button[type=submit],#newspack_modal_checkout form button.modal-continue{display:block;width:100%}#newspack_modal_checkout .form-row-first,#newspack_modal_checkout .form-row-last{width:calc(50% - 8px)}#newspack_modal_checkout .form-row-last+.form-row-first,#newspack_modal_checkout .form-row-wide+.form-row-first,#newspack_modal_checkout .form-row-wide+.form-row-first+.form-row-last{margin-top:0}#newspack_modal_checkout .select2-container--default .select2-selection--single{border-color:#ccc;border-radius:0;height:44px}#newspack_modal_checkout .select2-container--default .select2-selection--single .select2-selection__rendered{color:inherit;line-height:44px}#newspack_modal_checkout .select2-container--default .select2-selection--single .select2-selection__arrow{height:42px}#newspack_modal_checkout .wc_payment_method .payment_box{background:#f0f0f0;border-radius:3px;padding:16px}#newspack_modal_checkout .wc_payment_method .payment_box p{margin-top:0}#newspack_modal_checkout .wc-saved-payment-methods{padding:0}#newspack_modal_checkout .woocommerce-error{border-radius:3px;margin:0}#newspack_modal_checkout .woocommerce-notices-wrapper:not(:empty){margin-bottom:32px}#newspack_modal_checkout .woocommerce-privacy-policy-text{color:#767676}#newspack_modal_checkout .woocommerce-privacy-policy-text p{font-size:clamp(.75rem,.75rem + (1vw - .48rem)*.481,1rem);margin:0}#newspack_modal_checkout .woocommerce-thankyou-order-received{align-items:center;border-bottom:1px solid #ccc;display:flex;flex-direction:column;justify-content:center;margin:0 0 32px;padding:0 0 32px}#newspack_modal_checkout .woocommerce-thankyou-order-received:before{-webkit-animation:bounce .25s ease-in;animation:bounce .25s ease-in;-webkit-animation-delay:1s;animation-delay:1s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;background-color:#4ab866;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16.7 7.1l-6.3 8.5-3.3-2.5-.9 1.2 4.5 3.4L17.9 8z' fill='%23fff'/%3E%3C/svg%3E");background-position:50% 50%;background-repeat:no-repeat;background-size:24px;border-radius:50%;content:"";display:block;height:40px;margin-bottom:16px;padding:8px;transform:scale(0);width:40px}#newspack_modal_checkout .woocommerce-form-login-toggle,#newspack_modal_checkout .woocommerce-thankyou-order-received+.woocommerce-info{display:none}#newspack_modal_checkout .woocommerce-order-overview{color:#767676;list-style:none;margin:16px 0 0;padding:0}#newspack_modal_checkout .blockOverlay{align-items:center;display:flex;inset:0;justify-content:center;position:fixed!important}#newspack_modal_checkout .blockOverlay:after{-webkit-animation:spin 1s linear infinite;animation:spin 1s linear infinite;border:2px solid #fff;border-top-color:#767676;border-radius:50%;content:"";display:block;height:25px;width:25px}.newspack-modal-newsletters{margin-top:20px;padding-top:22px;border-top:1px solid #ccc}.newspack-modal-newsletters__info{margin-bottom:35px}.newspack-modal-newsletters__info span{color:#767676}.newspack-modal-newsletters__list-item{display:flex;margin-bottom:18px;border:1px solid #ccc;border-radius:6px}.newspack-modal-newsletters__list-item b{display:block;margin-bottom:2px}.newspack-modal-newsletters label{flex:1;padding:12px;cursor:pointer}.newspack-modal-newsletters input[type=checkbox]{padding:10px;margin-top:18px;margin-left:19px;margin-right:20px;border-radius:5px}.newspack-modal-newsletters__button,.newspack-modal-newsletters input[type=submit]{margin-top:25px;width:100%;padding:22px;font-size:1em}@-webkit-keyframes bounce{0%{transform:scale(0)}90%{transform:scale(1.4)}to{transform:scale(1)}}@keyframes bounce{0%{transform:scale(0)}90%{transform:scale(1.4)}to{transform:scale(1)}}
+#newspack_modal_checkout{padding:32px;font-size:1rem}#newspack_modal_checkout .order-details-summary{border:2px solid;border-radius:3px;padding:16px}#newspack_modal_checkout .order-details-summary h4{font-size:1rem;margin:0}#newspack_modal_checkout .order-details-summary h4>span{color:inherit;font-size:clamp(1.75rem,1.75rem + (1vw - .48rem)*.962,2.25rem);font-weight:700;line-height:1.434}#newspack_modal_checkout .order-details-summary h4 .subscription-details{font-size:1rem;font-weight:400}#newspack_modal_checkout #order-details-wrapper.hidden{display:none}#newspack_modal_checkout .woocommerce-checkout-review-order-table,#newspack_modal_checkout .woocommerce-NoticeGroup{margin-top:16px}#newspack_modal_checkout .woocommerce-checkout-review-order-table td,#newspack_modal_checkout .woocommerce-checkout-review-order-table th{font-size:.8rem}#newspack_modal_checkout .woocommerce-checkout-review-order-table.empty{display:none;margin:0;padding:0}#newspack_modal_checkout .woocommerce-billing-fields{margin-bottom:16px}#newspack_modal_checkout .checkout-billing-summary{border-bottom:1px solid #ccc;padding-bottom:32px}#newspack_modal_checkout .checkout-billing-summary__grid{align-items:baseline;display:flex;flex-wrap:wrap;gap:8px;justify-content:space-between}#newspack_modal_checkout .checkout-billing-summary p{font-size:clamp(.75rem,.75rem + (1vw - .48rem)*.481,1rem);margin:16px 0 0}#newspack_modal_checkout .checkout-billing-summary .edit-billing-link{color:#767676;font-size:clamp(.75rem,.75rem + (1vw - .48rem)*.481,1rem);display:inline-block;text-decoration:underline}#newspack_modal_checkout .checkout-billing-summary .edit-billing-link:focus,#newspack_modal_checkout .checkout-billing-summary .edit-billing-link:hover{color:inherit}#newspack_modal_checkout .woocommerce-account-fields .create-account{border-bottom:1px solid #ccc;padding-bottom:32px}#newspack_modal_checkout .woocommerce-account-fields .create-account .woocommerce-password-hint,#newspack_modal_checkout .woocommerce-account-fields .create-account .woocommerce-password-strength{color:#cc1818;margin-top:16px}#newspack_modal_checkout form,#newspack_modal_checkout form #wc-stripe-payment-request-button-separator{margin:0}#newspack_modal_checkout form .woocommerce-terms-and-conditions-wrapper{margin:16px 0}#newspack_modal_checkout form h3{font-size:1.37rem;margin:32px 0 0}#newspack_modal_checkout form p{margin:16px 0}#newspack_modal_checkout form .select2-container .select2-selection--single{margin:0}#newspack_modal_checkout form #payment button#place_order{margin-bottom:0}#newspack_modal_checkout form .checkout-billing button[type=submit],#newspack_modal_checkout form button.modal-continue{display:block;width:100%}#newspack_modal_checkout .form-row-first,#newspack_modal_checkout .form-row-last{width:calc(50% - 8px)}#newspack_modal_checkout .form-row-last+.form-row-first,#newspack_modal_checkout .form-row-wide+.form-row-first,#newspack_modal_checkout .form-row-wide+.form-row-first+.form-row-last{margin-top:0}#newspack_modal_checkout .select2-container--default .select2-selection--single{border-color:#ccc;border-radius:0;height:44px}#newspack_modal_checkout .select2-container--default .select2-selection--single .select2-selection__rendered{color:inherit;line-height:44px}#newspack_modal_checkout .select2-container--default .select2-selection--single .select2-selection__arrow{height:42px}#newspack_modal_checkout .wc_payment_method .payment_box{background:#f0f0f0;border-radius:3px;padding:16px}#newspack_modal_checkout .wc_payment_method .payment_box p{margin-top:0}#newspack_modal_checkout .wc-saved-payment-methods{padding:0}#newspack_modal_checkout .woocommerce-error{border-radius:3px;margin:0}#newspack_modal_checkout .woocommerce-notices-wrapper:not(:empty){margin-bottom:32px}#newspack_modal_checkout .woocommerce-privacy-policy-text{color:#767676}#newspack_modal_checkout .woocommerce-privacy-policy-text p{font-size:clamp(.75rem,.75rem + (1vw - .48rem)*.481,1rem);margin:0}#newspack_modal_checkout .woocommerce-thankyou-order-received{align-items:center;border-bottom:1px solid #ccc;display:flex;flex-direction:column;justify-content:center;margin:0 0 32px;padding:0 0 32px}#newspack_modal_checkout .woocommerce-thankyou-order-received:before{-webkit-animation:bounce .25s ease-in;animation:bounce .25s ease-in;-webkit-animation-delay:1s;animation-delay:1s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;background-color:#4ab866;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16.7 7.1l-6.3 8.5-3.3-2.5-.9 1.2 4.5 3.4L17.9 8z' fill='%23fff'/%3E%3C/svg%3E");background-position:50% 50%;background-repeat:no-repeat;background-size:24px;border-radius:50%;content:"";display:block;height:40px;margin-bottom:16px;padding:8px;transform:scale(0);width:40px}#newspack_modal_checkout .woocommerce-form-login-toggle,#newspack_modal_checkout .woocommerce-thankyou-order-received+.woocommerce-info{display:none}#newspack_modal_checkout .woocommerce-order-overview{color:#767676;list-style:none;margin:16px 0 0;padding:0}#newspack_modal_checkout .blockOverlay{align-items:center;display:flex;inset:0;justify-content:center;position:fixed!important}#newspack_modal_checkout .blockOverlay:after{-webkit-animation:spin 1s linear infinite;animation:spin 1s linear infinite;border:2px solid #fff;border-top-color:#767676;border-radius:50%;content:"";display:block;height:25px;width:25px}.newspack-modal-newsletters{margin-top:20px;padding-top:22px;border-top:1px solid #ccc}.newspack-modal-newsletters__info{margin-bottom:35px}.newspack-modal-newsletters__info span{color:#767676}.newspack-modal-newsletters__list-item{display:flex;margin-bottom:18px;border:1px solid #ccc;border-radius:6px}.newspack-modal-newsletters__list-item b{display:block;margin-bottom:2px}.newspack-modal-newsletters label{flex:1;padding:12px;cursor:pointer}.newspack-modal-newsletters input[type=checkbox]{padding:10px;margin-top:18px;margin-left:19px;margin-right:20px;border-radius:5px}.newspack-modal-newsletters__button,.newspack-modal-newsletters input[type=submit]{margin-top:25px;width:100%;padding:22px!important;font-size:1em!important}@-webkit-keyframes bounce{0%{transform:scale(0)}90%{transform:scale(1.4)}to{transform:scale(1)}}@keyframes bounce{0%{transform:scale(0)}90%{transform:scale(1.4)}to{transform:scale(1)}}

package/includes/class-modal-checkout.php

@@ -313,6 +313,29 @@ final class Modal_Checkout {
 		ob_end_flush();
 	}
 
+	/**
+	 * Get after success button params.
+	 */
+	private static function get_after_success_params() {
+		return array_filter(
+			[
+				'after_success_behavior'     => isset( $_REQUEST['after_success_behavior'] ) ? rawurlencode( sanitize_text_field( wp_unslash( $_REQUEST['after_success_behavior'] ) ) ) : '', // phpcs:ignore WordPress.Security.NonceVerification.Recommended
+				'after_success_url'          => isset( $_REQUEST['after_success_url'] ) ? rawurlencode( sanitize_text_field( wp_unslash( $_REQUEST['after_success_url'] ) ) ) : '', // phpcs:ignore WordPress.Security.NonceVerification.Recommended
+				'after_success_button_label' => isset( $_REQUEST['after_success_button_label'] ) ? rawurlencode( sanitize_text_field( wp_unslash( $_REQUEST['after_success_button_label'] ) ) ) : '', // phpcs:ignore WordPress.Security.NonceVerification.Recommended
+			]
+		);
+	}
+
+	/**
+	 * Render hidden inputs to pass some params along.
+	 */
+	private static function render_hidden_inputs() {
+		foreach ( self::get_after_success_params() as $key => $value ) {
+			?>
+				<input type="hidden" name="<?php echo esc_attr( $key ); ?>" value="<?php echo esc_attr( $value ); ?>" />
+			<?php
+		}
+	}
 
 	/**
 	 * Return URL for modal checkout "thank you" page.
@@ -327,13 +350,13 @@ final class Modal_Checkout {
 			return $url;
 		}
 
-		$args = [
-			'modal_checkout'             => '1',
-			'email'                      => isset( $_REQUEST['billing_email'] ) ? rawurlencode( \sanitize_email( \wp_unslash( $_REQUEST['billing_email'] ) ) ) : '', // phpcs:ignore WordPress.Security.NonceVerification.Recommended
-			'after_success_behavior'     => isset( $_REQUEST['after_success_behavior'] ) ? rawurlencode( sanitize_text_field( wp_unslash( $_REQUEST['after_success_behavior'] ) ) ) : '', // phpcs:ignore WordPress.Security.NonceVerification.Recommended
-			'after_success_url'          => isset( $_REQUEST['after_success_url'] ) ? rawurlencode( sanitize_text_field( wp_unslash( $_REQUEST['after_success_url'] ) ) ) : '', // phpcs:ignore WordPress.Security.NonceVerification.Recommended
-			'after_success_button_label' => isset( $_REQUEST['after_success_button_label'] ) ? rawurlencode( sanitize_text_field( wp_unslash( $_REQUEST['after_success_button_label'] ) ) ) : '', // phpcs:ignore WordPress.Security.NonceVerification.Recommended
-		];
+		$args = array_merge(
+			[
+				'modal_checkout' => '1',
+				'email'          => isset( $_REQUEST['billing_email'] ) ? rawurlencode( \sanitize_email( \wp_unslash( $_REQUEST['billing_email'] ) ) ) : '', // phpcs:ignore WordPress.Security.NonceVerification.Recommended
+			],
+			self::get_after_success_params()
+		);
 
 		// Pass order ID for modal checkout templates.
 		if ( $order && is_a( $order, 'WC_Order' ) ) {
@@ -562,28 +585,42 @@ final class Modal_Checkout {
 	}
 
 	/**
-	 * Adds an additional button to the Thank you page
+	 * Render markup at the end of the "thank you" view.
+	 *
+	 * @param WC_Order $order The order related to the transaction.
 	 *
 	 * @return void
 	 */
-	public static function render_checkout_after_success_markup() {
+	public static function render_checkout_after_success_markup( $order ) {
+		if ( self::is_newsletter_signup_available() ) {
+			self::render_newsletter_signup_form( $order );
+		} else {
+			self::render_after_success_button();
+		}
+	}
+
+	/**
+	 * Render markup at the end of the "thank you" view.
+	 *
+	 * @return void
+	 */
+	private static function render_after_success_button() {
 		// phpcs:disable WordPress.Security.NonceVerification.Recommended
-		if (
-			empty( $_REQUEST['modal_checkout'] ) ||
-			empty( $_REQUEST['after_success_behavior'] ) ||
-			empty( $_REQUEST['after_success_url'] )
-		) {
+		if ( empty( $_REQUEST['modal_checkout'] ) ) {
 			return;
 		}
 
-		$button_label = ! empty( $_REQUEST['after_success_button_label'] ) ? sanitize_text_field( wp_unslash( $_REQUEST['after_success_button_label'] ) ) : __( 'Continue browsing', 'newspack-blocks' );
-
+		$button_label = ! empty( $_REQUEST['after_success_button_label'] ) ? urldecode( wp_unslash( $_REQUEST['after_success_button_label'] ) ) : __( 'Continue browsing', 'newspack-blocks' ); // phpcs:ignore WordPress.Security.ValidatedSanitizedInput.InputNotSanitized
+		$url          = ! empty( $_REQUEST['after_success_url'] ) ? urldecode( wp_unslash( $_REQUEST['after_success_url'] ) ) : ''; // phpcs:ignore WordPress.Security.ValidatedSanitizedInput.InputNotSanitized
 		?>
 			<a
-				class="button"
-				href="<?php echo esc_url( sanitize_text_field( wp_unslash( $_REQUEST['after_success_url'] ) ) ); ?>"
-				target="_top"
-				style="display:block;margin:16px 0;"
+				<?php if ( empty( $url ) ) : ?>
+					onclick="parent.newspackCloseModalCheckout(this);"
+				<?php else : ?>
+					href="<?php echo esc_url( $url ); ?>"
+					target="_top"
+				<?php endif; ?>
+				class="button newspack-modal-newsletters__button"
 			>
 				<?php echo esc_html( $button_label ); ?>
 			</a>
@@ -596,10 +633,7 @@ final class Modal_Checkout {
 	 *
 	 * @param WC_Order $order The order related to the transaction.
 	 */
-	public static function render_newsletter_signup_form( $order ) {
-		if ( ! self::is_newsletter_signup_available() ) {
-			return false;
-		}
+	private static function render_newsletter_signup_form( $order ) {
 		$email_address = $order->get_billing_email();
 		if ( ! $email_address ) {
 			return;
@@ -646,6 +680,7 @@ final class Modal_Checkout {
 					<input type="hidden" name="modal_checkout" value="1" />
 					<input type="hidden" name="newsletter_signup_email" value="<?php echo esc_html( $email_address ); ?>" />
 					<?php
+					self::render_hidden_inputs();
 					foreach ( $newsletters_lists as $list ) {
 						$checkbox_id = sprintf( 'newspack-blocks-list-%s', $list['id'] );
 						?>
@@ -693,18 +728,22 @@ final class Modal_Checkout {
 		}
 		$signup_data = self::get_newsletter_signup_data();
 		if ( false !== $signup_data ) {
-			$result = \Newspack_Newsletters_Subscription::add_contact(
-				[
-					'email'    => $signup_data['email'],
-					'metadata' => [
-						'current_page_url'                => home_url( add_query_arg( array(), \wp_get_referer() ) ),
-						'newsletters_subscription_method' => 'post-checkout',
+			if ( empty( $signup_data['lists'] ) ) {
+				return new \WP_Error( 'newspack_no_lists_selected', __( 'No lists selected.', 'newspack-blocks' ) );
+			} else {
+				$result = \Newspack_Newsletters_Subscription::add_contact(
+					[
+						'email'    => $signup_data['email'],
+						'metadata' => [
+							'current_page_url' => home_url( add_query_arg( array(), \wp_get_referer() ) ),
+							'newsletters_subscription_method' => 'post-checkout',
+						],
 					],
-				],
-				$signup_data['lists']
-			);
-			if ( \is_wp_error( $result ) ) {
-				return $result;
+					$signup_data['lists']
+				);
+				if ( \is_wp_error( $result ) ) {
+					return $result;
+				}
 			}
 			return true;
 		}
@@ -718,22 +757,28 @@ final class Modal_Checkout {
 		$newsletter_signup_email = isset( $_GET['newsletter_signup_email'] ) ? \sanitize_text_field( \wp_unslash( $_GET['newsletter_signup_email'] ) ) : false; // phpcs:ignore WordPress.Security.NonceVerification.Recommended
 		if ( $newsletter_signup_email && isset( $_SERVER['REQUEST_URI'] ) ) {
 			parse_str( \wp_parse_url( \wp_unslash( $_SERVER['REQUEST_URI'] ) )['query'], $query ); // phpcs:ignore WordPress.Security.ValidatedSanitizedInput.InputNotSanitized
+			$signup_data = [
+				'email' => $newsletter_signup_email,
+				'lists' => [],
+			];
 			if ( isset( $query['lists'] ) && count( $query['lists'] ) ) {
-				return [
-					'email' => $newsletter_signup_email,
-					'lists' => $query['lists'],
-				];
+				$signup_data['lists'] = $query['lists'];
 			}
+			return $signup_data;
 		}
 		return false;
 	}
 
 	/**
 	 * Renders newsletter signup confirmation.
+	 *
+	 * @param bool $no_lists_selected Whether no lists were selected.
 	 */
-	public static function render_newsletter_confirmation() {
+	public static function render_newsletter_confirmation( $no_lists_selected = false ) {
 		?>
-			<h4><?php esc_html_e( 'Signup successful!', 'newspack-blocks' ); ?></h4>
+			<?php if ( ! $no_lists_selected ) : ?>
+				<h4><?php esc_html_e( 'Signup successful!', 'newspack-blocks' ); ?></h4>
+			<?php endif; ?>
 			<p>
 				<?php
 				echo esc_html(
@@ -745,10 +790,8 @@ final class Modal_Checkout {
 				);
 				?>
 			</p>
-			<button onclick="parent.newspackCloseModalCheckout(this);" class="newspack-modal-newsletters__button">
-				<?php esc_html_e( 'Close', 'newspack-blocks' ); ?>
-			</button>
 		<?php
+		self::render_after_success_button();
 	}
 }
 Modal_Checkout::init();

package/newspack-blocks.php

@@ -7,7 +7,7 @@
  * Author URI:      https://newspack.com/
  * Text Domain:     newspack-blocks
  * Domain Path:     /languages
- * Version:         2.0.0
+ * Version:         2.1.0-alpha.1
  *
  * @package         Newspack_Blocks
  */
@@ -15,7 +15,7 @@
 define( 'NEWSPACK_BLOCKS__PLUGIN_FILE', __FILE__ );
 define( 'NEWSPACK_BLOCKS__BLOCKS_DIRECTORY', 'dist/' );
 define( 'NEWSPACK_BLOCKS__PLUGIN_DIR', plugin_dir_path( NEWSPACK_BLOCKS__PLUGIN_FILE ) );
-define( 'NEWSPACK_BLOCKS__VERSION', '2.0.0' );
+define( 'NEWSPACK_BLOCKS__VERSION', '2.1.0-alpha.1' );
 
 require_once NEWSPACK_BLOCKS__PLUGIN_DIR . 'includes/class-newspack-blocks.php';
 require_once NEWSPACK_BLOCKS__PLUGIN_DIR . 'includes/class-newspack-blocks-api.php';

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@automattic/newspack-blocks",
-	"version": "2.0.0",
+	"version": "2.1.0-alpha.1",
 	"author": "Automattic",
 	"devDependencies": {
 		"@rushstack/eslint-patch": "^1.5.1",

package/src/blocks/checkout-button/block.json

@@ -40,7 +40,8 @@
 			"type": "string"
 		},
 		"afterSuccessButtonLabel": {
-			"type": "string"
+			"type": "string",
+			"default": "Continue browsing"
 		},
 		"afterSuccessURL": {
 			"type": "string"

package/src/blocks/checkout-button/edit.js

@@ -34,6 +34,7 @@ import apiFetch from '@wordpress/api-fetch';
  * Internal dependencies
  */
 import './edit.scss';
+import RedirectAfterSuccess from '../../components/redirect-after-success';
 
 function getVariationName( variation ) {
 	const attributes = [];
@@ -153,48 +154,6 @@ function ProductControl( props ) {
 	);
 }
 
-function RedirectAfterSuccess( props ) {
-	const { attributes, setAttributes } = props;
-	return (
-		<>
-			<SelectControl
-				label={ __( 'Post-Checkout Button', 'newspack-blocks' ) }
-				help={ __(
-					'Select whether the user should be presented with a button to navigate after a successful purchase.',
-					'newspack-blocks'
-				) }
-				value={ attributes.afterSuccessBehavior }
-				options={ [
-					{ label: __( 'Do not show a button', 'newspack-blocks' ), value: '' },
-					{ label: __( 'Go to a custom URL', 'newspack-blocks' ), value: 'custom' },
-					{ label: __( 'Go to the previous page', 'newspack-blocks' ), value: 'referrer' },
-				] }
-				onChange={ value => {
-					setAttributes( { afterSuccessBehavior: value.toString() } );
-				} }
-			/>
-			{ attributes.afterSuccessBehavior !== '' && (
-				<>
-					<TextControl
-						label={ __( 'Button Label', 'newspack-blocks' ) }
-						placeholder={ __( 'Continue browsing', 'newspack-blocks' ) }
-						value={ attributes.afterSuccessButtonLabel || '' }
-						onChange={ value => setAttributes( { afterSuccessButtonLabel: value } ) }
-					/>
-					{ attributes.afterSuccessBehavior === 'custom' && (
-						<TextControl
-							label={ __( 'Custom URL', 'newspack-blocks' ) }
-							placeholder={ __( 'https://example.com', 'newspack-blocks' ) }
-							value={ attributes.afterSuccessURL || '' }
-							onChange={ value => setAttributes( { afterSuccessURL: value } ) }
-						/>
-					) }
-				</>
-			) }
-		</>
-	);
-}
-
 function CheckoutButtonEdit( props ) {
 	const { attributes, setAttributes, className } = props;
 	const { placeholder, style, text, product, price, variation } = attributes;

package/src/blocks/donate/block.json

@@ -90,6 +90,16 @@
 		"additionalFields": {
 			"type": "array",
 			"default": []
+		},
+		"afterSuccessBehavior": {
+			"type": "string"
+		},
+		"afterSuccessButtonLabel": {
+			"type": "string",
+			"default": "Continue browsing"
+		},
+		"afterSuccessURL": {
+			"type": "string"
 		}
 	},
 	"supports": {

package/src/blocks/donate/edit/index.tsx

@@ -45,6 +45,7 @@ import {
 	LAYOUT_OPTIONS,
 	DISABLED_IN_TIERS_BASED_LAYOUT_TIER_INDEX,
 } from '../consts';
+import RedirectAfterSuccess from '../../../components/redirect-after-success';
 
 const TIER_LABELS = [
 	__( 'Low-tier', 'newspack-blocks' ),
@@ -421,6 +422,9 @@ const Edit = ( { attributes, setAttributes, className }: EditProps ) => {
 						</p>
 					</PanelBody>
 				) }
+				<PanelBody title={ __( 'After purchase', 'newspack-blocks' ) }>
+					<RedirectAfterSuccess setAttributes={ setAttributes } attributes={ attributes } />
+				</PanelBody>
 			</InspectorControls>
 		</>
 	);

package/src/blocks/donate/frontend/class-newspack-blocks-donate-renderer-base.php

@@ -290,9 +290,11 @@ abstract class Newspack_Blocks_Donate_Renderer_Base {
 	}
 
 	/**
-	 * Render hidden form input indentifying a donate form submission.
+	 * Render hidden form inputs.
+	 *
+	 * @param array $attributes The block attributes.
 	 */
-	protected static function render_donate_form_input() {
+	protected static function render_hidden_form_inputs( $attributes ) {
 		ob_start();
 		/**
 		 * Action to add custom fields before the form fields of the donation block.
@@ -302,6 +304,16 @@ abstract class Newspack_Blocks_Donate_Renderer_Base {
 		?>
 			<input type='hidden' name='newspack_donate' value='1' />
 		<?php
+
+		foreach ( [ [ 'afterSuccessBehavior', 'after_success_behavior' ], [ 'afterSuccessButtonLabel', 'after_success_button_label' ], [ 'afterSuccessURL', 'after_success_url' ] ] as $attribute ) {
+			$attribute_name = $attribute[0];
+			$param_name     = $attribute[1];
+			$value          = isset( $attributes[ $attribute_name ] ) ? $attributes[ $attribute_name ] : '';
+			?>
+				<input type='hidden' name='<?php echo esc_attr( $param_name ); ?>' value='<?php echo esc_attr( $value ); ?>' />
+			<?php
+		}
+
 		return ob_get_clean();
 	}
 

package/src/blocks/donate/frontend/class-newspack-blocks-donate-renderer-frequency-based.php

@@ -105,7 +105,7 @@ class Newspack_Blocks_Donate_Renderer_Frequency_Based extends Newspack_Blocks_Do
 			id="<?php echo esc_html( $configuration['uid'] ); ?>"
 		>
 			<form data-streamlined-config="<?php echo esc_html( htmlspecialchars( wp_json_encode( $configuration['configuration_for_streamlined'] ), ENT_QUOTES, 'UTF-8' ) ); ?>">
-				<?php echo self::render_donate_form_input(); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
+				<?php echo self::render_hidden_form_inputs( $attributes ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
 				<div class='wp-block-newspack-blocks-donate__options'>
 					<div class='wp-block-newspack-blocks-donate__frequencies frequencies'>
 						<?php foreach ( $configuration['frequencies'] as $frequency_slug => $frequency_name ) : ?>
@@ -154,7 +154,7 @@ class Newspack_Blocks_Donate_Renderer_Frequency_Based extends Newspack_Blocks_Do
 			id="<?php echo esc_html( $configuration['uid'] ); ?>"
 		>
 			<form data-streamlined-config="<?php echo esc_html( htmlspecialchars( wp_json_encode( $configuration['configuration_for_streamlined'] ), ENT_QUOTES, 'UTF-8' ) ); ?>">
-				<?php echo self::render_donate_form_input(); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
+				<?php echo self::render_hidden_form_inputs( $attributes ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
 				<div class='wp-block-newspack-blocks-donate__options'>
 					<div class='wp-block-newspack-blocks-donate__frequencies frequencies'>
 						<?php foreach ( $configuration['frequencies'] as $frequency_slug => $frequency_name ) : ?>

package/src/blocks/donate/frontend/class-newspack-blocks-donate-renderer-tiers-based.php

@@ -150,7 +150,7 @@ class Newspack_Blocks_Donate_Renderer_Tiers_Based extends Newspack_Blocks_Donate
 		>
 			<form data-is-init-form <?php echo 'stripe' === $configuration['platform'] ? 'onsubmit="return false;"' : ''; ?>>
 				<div class="wpbnbd__tiers__view">
-					<?php echo self::render_donate_form_input(); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
+					<?php echo self::render_hidden_form_inputs( $attributes ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
 					<input type="hidden" name="<?php echo esc_attr( self::FREQUENCY_PARAM ); ?>" value="<?php echo esc_attr( $intial_selected_frequency ); ?>">
 					<div class="wpbnbd__tiers">
 						<div class="wpbnbd__tiers__selection">

package/src/blocks/donate/types.ts

@@ -96,6 +96,10 @@ export type DonateBlockAttributes = OverridableConfiguration & {
 	tiersBasedOptions: [ TierBasedOptionValue, TierBasedOptionValue, TierBasedOptionValue ];
 	// Manual mode enables block-level overrides of the global Donate settings.
 	manual: boolean;
+	// Post-checkout button option.
+	afterSuccessBehavior: string;
+	afterSuccessButtonLabel: string;
+	afterSuccessURL: string;
 	// Legacy attributes.
 	suggestedAmounts?: [ number, number, number ];
 	suggestedAmountUntiered?: number;

package/src/components/redirect-after-success.tsx

@@ -0,0 +1,50 @@
+/**
+ * WordPress dependencies
+ */
+import { __ } from '@wordpress/i18n';
+import { TextControl, SelectControl } from '@wordpress/components';
+
+type Props = {
+	attributes: {
+		afterSuccessBehavior: string;
+		afterSuccessButtonLabel: string;
+		afterSuccessURL: string;
+	};
+	setAttributes: ( attributes: Partial< Props[ 'attributes' ] > ) => void;
+};
+
+const RedirectAfterSuccess = ( { attributes, setAttributes }: Props ) => (
+	<>
+		<SelectControl
+			label={ __( 'Post-Checkout Button', 'newspack-blocks' ) }
+			help={ __(
+				'After a successful purchase, a button will be presented to finish the process.',
+				'newspack-blocks'
+			) }
+			value={ attributes.afterSuccessBehavior }
+			options={ [
+				{ label: __( 'Close the modal', 'newspack-blocks' ), value: '' },
+				{ label: __( 'Go to a custom URL', 'newspack-blocks' ), value: 'custom' },
+				{ label: __( 'Go to the previous page', 'newspack-blocks' ), value: 'referrer' },
+			] }
+			onChange={ ( value: string ) => {
+				setAttributes( { afterSuccessBehavior: value.toString() } );
+			} }
+		/>
+		<TextControl
+			label={ __( 'Button Label', 'newspack-blocks' ) }
+			value={ attributes.afterSuccessButtonLabel || '' }
+			onChange={ ( value: string ) => setAttributes( { afterSuccessButtonLabel: value } ) }
+		/>
+		{ attributes.afterSuccessBehavior === 'custom' && (
+			<TextControl
+				label={ __( 'Custom URL', 'newspack-blocks' ) }
+				placeholder={ __( 'https://example.com', 'newspack-blocks' ) }
+				value={ attributes.afterSuccessURL || '' }
+				onChange={ ( value: string ) => setAttributes( { afterSuccessURL: value } ) }
+			/>
+		) }
+	</>
+);
+
+export default RedirectAfterSuccess;

package/src/modal-checkout/checkout.scss

@@ -249,8 +249,8 @@
 	&__button {
 		margin-top: 25px;
 		width: 100%;
-		padding: 22px;
-		font-size: 1em;
+		padding: 22px !important;
+		font-size: 1em !important;
 	}
 }
 

package/src/modal-checkout/modal.js

@@ -136,6 +136,23 @@ domReady( () => {
 						modal => modal.dataset.productId === formData.get( 'product_id' )
 					);
 					if ( variationModal ) {
+						// Fill in the after success variables in the variation modal.
+						variationModal
+							.querySelectorAll( 'form[target="newspack_modal_checkout"]' )
+							.forEach( singleVariationForm => {
+								[
+									'after_success_behavior',
+									'after_success_url',
+									'after_success_button_label',
+								].forEach( afterSuccessParam => {
+									const input = document.createElement( 'input' );
+									input.type = 'hidden';
+									input.name = afterSuccessParam;
+									input.value = formData.get( afterSuccessParam );
+									singleVariationForm.appendChild( input );
+								} );
+							} );
+						// Open the variations modal.
 						ev.preventDefault();
 						document.body.classList.add( 'newspack-modal-checkout-open' );
 						variationModal.style.display = 'block';