*/
+li.wc_payment_method.payment_method_comfino {
+ display: none !important;
+}
+
+li.wc_payment_method.payment_method_comfino.comfino-payment-method-item--ready {
+ display: list-item !important;
+}
+
+/* WooCommerce Blocks checkout: with input[value="comfino"].
+ :has() is widely supported in modern evergreen browsers; older browsers will simply not hide the tile
+ (graceful degradation — the SDK still bootstraps, paywall iframe still renders). */
+.wc-block-checkout__payment-methods .wc-block-components-radio-control:has(input[value="comfino"]) {
+ display: none !important;
+}
+
+.wc-block-checkout__payment-methods .wc-block-components-radio-control.comfino-payment-method-item--ready:has(input[value="comfino"]) {
+ display: block !important;
+}
\ No newline at end of file
diff --git a/resources/js/front/comfino-blocks.js b/resources/js/front/comfino-blocks.js
new file mode 100644
index 00000000..0fd8fda0
--- /dev/null
+++ b/resources/js/front/comfino-blocks.js
@@ -0,0 +1,202 @@
+/* Comfino web frontend SDK — WooCommerce Blocks checkout init */
+(function () {
+ 'use strict';
+
+ // Resolve the Blocks payment-method registration API; bail if absent (this page is not a Blocks checkout).
+ const registerPaymentMethod = window.wc && window.wc.wcBlocksRegistry
+ ? window.wc.wcBlocksRegistry.registerPaymentMethod
+ : null;
+
+ if (!registerPaymentMethod) {
+ return;
+ }
+
+ const { createElement, Fragment, useEffect } = window.wp.element;
+
+ // Comfino payment method configuration
+ const config = window.wc.wcSettings.getSetting('comfino_data', {});
+
+ /* Content component for Blocks checkout. Registers onPaymentSetup so the selected loanType/loanTerm — written
+ into the hidden inputs by the SDK on every UPDATE_PAYMENT_STATE — are forwarded as paymentMethodData in the
+ /wc/store/checkout REST request, which is what populates $_POST for process_payment(). The handler body is
+ built by WooCommercePaywallController.createBlocksPaymentSetupHandler so input IDs and the response envelope
+ stay in the SDK; the wrapper here resolves the SDK lazily — useEffect can run before the SDK script is
+ loaded (Comfino not yet selected when checkout mounts). Prefer the cached promise on window over reading
+ window.Comfino directly so the ESM branch (which doesn't populate the global) still resolves. */
+ function resolveSdk() {
+ if (window.Comfino && typeof window.Comfino.WooCommercePaywallController === 'function') {
+ return Promise.resolve(window.Comfino);
+ }
+
+ if (window.__comfinoSdkPromise) {
+ return window.__comfinoSdkPromise;
+ }
+
+ return Promise.resolve(null);
+ }
+
+ function ComfinoContent(props) {
+ const eventRegistration = props.eventRegistration;
+ const emitResponse = props.emitResponse;
+
+ useEffect(function () {
+ return eventRegistration.onPaymentSetup(function () {
+ /* Resolve the SDK at fire-time. By the time onPaymentSetup runs (i.e., the user pressed
+ "Place order" with Comfino selected), the SDK script has been injected. If for any reason it
+ isn't, fall back to a SUCCESS response with empty payment-method data — WooCommerce will then
+ reject server-side via the API rather than crashing the checkout. */
+ return resolveSdk().then(function (sdk) {
+ if (sdk && typeof sdk.WooCommercePaywallController === 'function') {
+ return sdk.WooCommercePaywallController.createBlocksPaymentSetupHandler(emitResponse)();
+ }
+
+ return {
+ type: emitResponse.responseTypes.SUCCESS,
+ meta: {paymentMethodData: {comfino_loan_type: '', comfino_loan_term: '0'}}
+ };
+ });
+ });
+ }, [eventRegistration.onPaymentSetup, emitResponse.responseTypes.SUCCESS]);
+
+ return createElement(
+ Fragment,
+ null,
+ createElement('input', {id: 'comfino-loan-type', name: 'comfino_loan_type', type: 'hidden', defaultValue: ''}),
+ createElement('input', {id: 'comfino-loan-term', name: 'comfino_loan_term', type: 'hidden', defaultValue: ''}),
+ createElement('div', {id: 'comfino-paywall-container'})
+ );
+ }
+
+ /* WooCommerce Blocks requires `label` and `ariaLabel` on the registered payment method. The SDK's
+ DefaultPaymentMethodItemRenderer stamps the Comfino logo over this tile, so the literal strings here
+ only matter as accessibility fallback before the SDK boots — no need to plumb them through PHP. */
+ const ComfinoPaymentContent = {
+ name: 'comfino',
+ label: 'Comfino',
+ content: createElement(ComfinoContent),
+ edit: createElement('div', null, 'Comfino'),
+ canMakePayment: () => true,
+ ariaLabel: 'Comfino payment method',
+ supports: {features: config.supports || []},
+ paymentMethodId: 'comfino',
+ savedTokenComponent: null,
+ };
+
+ registerPaymentMethod(ComfinoPaymentContent);
+
+ /* Load the Comfino web frontend SDK. Two code paths based on config.sdkScriptKind:
+
+ - 'umd' (default today): the bundle is loaded as a classic
-