@bloque/payments-react 0.0.4 → 0.0.5

package/dist/bloque-checkout.d.ts

@@ -1,5 +1,5 @@
 import '@bloque/payments-elements';
-import type { AppearanceConfig, CheckoutConfig, PaymentMethodType, PaymentSubmitPayload } from '@bloque/payments-elements';
+import type { AppearanceConfig, CheckoutConfig, PaymentMethodType, PaymentResponse, PaymentSubmitPayload } from '@bloque/payments-elements';
 declare global {
     namespace JSX {
         interface IntrinsicElements {
@@ -14,11 +14,13 @@ export interface BloqueCheckoutProps {
     availableMethods?: PaymentMethodType[];
     requireEmail?: boolean;
     showMethodSelector?: boolean;
-    onSubmit?: (payload: PaymentSubmitPayload) => Promise<void>;
-    onSuccess?: (event: CustomEvent<PaymentSubmitPayload>) => void;
-    onError?: (event: CustomEvent<PaymentSubmitPayload & {
-        error: string;
-    }>) => void;
+    onSubmit?: (payload: PaymentSubmitPayload) => Promise<PaymentResponse | undefined>;
+    onSuccess?: (response: PaymentResponse) => void;
+    onError?: (error: {
+        message: string;
+        data: unknown;
+        type: string;
+    }) => void;
     className?: string;
     style?: React.CSSProperties;
 }

package/dist/bloque-checkout.js

@@ -13,6 +13,8 @@ function BloqueCheckout({ config, appearance, amount, availableMethods, requireE
         element.requireEmail = requireEmail;
         element.showMethodSelector = showMethodSelector;
         if (onSubmit) element.onSubmit = onSubmit;
+        if (onSuccess) element.onSuccess = onSuccess;
+        if (onError) element.onError = onError;
     }, [
         config,
         appearance,
@@ -20,24 +22,7 @@ function BloqueCheckout({ config, appearance, amount, availableMethods, requireE
         availableMethods,
         requireEmail,
         showMethodSelector,
-        onSubmit
-    ]);
-    useEffect(()=>{
-        const element = checkoutRef.current;
-        if (!element) return;
-        const handleSuccess = (event)=>{
-            if (onSuccess) onSuccess(event);
-        };
-        const handleError = (event)=>{
-            if (onError) onError(event);
-        };
-        element.addEventListener('payment-success', handleSuccess);
-        element.addEventListener('payment-error', handleError);
-        return ()=>{
-            element.removeEventListener('payment-success', handleSuccess);
-            element.removeEventListener('payment-error', handleError);
-        };
-    }, [
+        onSubmit,
         onSuccess,
         onError
     ]);

package/dist/index.d.ts

@@ -1,3 +1,4 @@
-export type { AppearanceConfig, CheckoutConfig, PaymentSubmitPayload, } from '@bloque/payments-elements';
+export type { AppearanceConfig, CheckoutConfig, PaymentResponse, PaymentSubmitPayload, SDKInitOptions, } from '@bloque/payments-elements';
+export { init } from '@bloque/payments-elements';
 export type { BloqueCheckoutProps } from './bloque-checkout';
 export { BloqueCheckout } from './bloque-checkout';

package/dist/index.js

@@ -1,2 +1,3 @@
+import { init } from "@bloque/payments-elements";
 import { BloqueCheckout } from "./bloque-checkout.js";
-export { BloqueCheckout };
+export { BloqueCheckout, init };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bloque/payments-react",
-  "version": "0.0.4",
+  "version": "0.0.5",
   "description": "React wrapper for Bloque payments web components",
   "type": "module",
   "main": "./dist/index.js",
@@ -34,7 +34,7 @@
     "provenance": true
   },
   "dependencies": {
-    "@bloque/payments-elements": "0.0.4"
+    "@bloque/payments-elements": "0.0.5"
   },
   "peerDependencies": {
     "react": ">=16.9.0",