@commercelayer/react-components 4.28.6-beta.1 → 4.28.6-beta.2

package/lib/cjs/components/payment_gateways/PaymentGateway.js

@@ -1,2 +1,2 @@
 "use client";
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.PaymentGateway=PaymentGateway;const tslib_1=require("tslib"),jsx_runtime_1=require("react/jsx-runtime"),react_1=require("react"),CustomerContext_1=tslib_1.__importDefault(require("../../context/CustomerContext")),OrderContext_1=tslib_1.__importDefault(require("../../context/OrderContext")),PaymentMethodChildrenContext_1=tslib_1.__importDefault(require("../../context/PaymentMethodChildrenContext")),PaymentMethodContext_1=tslib_1.__importDefault(require("../../context/PaymentMethodContext")),PlaceOrderContext_1=tslib_1.__importDefault(require("../../context/PlaceOrderContext")),getLoaderComponent_1=tslib_1.__importDefault(require("../../utils/getLoaderComponent")),getPaymentAttributes_1=require("../../utils/getPaymentAttributes"),AdyenGateway_1=tslib_1.__importDefault(require("./AdyenGateway")),BraintreeGateway_1=tslib_1.__importDefault(require("./BraintreeGateway")),CheckoutComGateway_1=tslib_1.__importDefault(require("./CheckoutComGateway")),ExternalGateway_1=tslib_1.__importDefault(require("./ExternalGateway")),KlarnaGateway_1=tslib_1.__importDefault(require("./KlarnaGateway")),PaypalGateway_1=tslib_1.__importDefault(require("./PaypalGateway")),StripeGateway_1=tslib_1.__importDefault(require("./StripeGateway")),WireTransferGateway_1=tslib_1.__importDefault(require("./WireTransferGateway"));function PaymentGateway({readonly,showCard,handleEditClick,children,templateCustomerCards,templateCustomerSaveToWallet,onClickCustomerCards,show,loader="Loading...",...p}){const loaderComponent=(0,getLoaderComponent_1.default)(loader),[loading,setLoading]=(0,react_1.useState)(!0),{payment,expressPayments}=(0,react_1.useContext)(PaymentMethodChildrenContext_1.default),{order}=(0,react_1.useContext)(OrderContext_1.default),{getCustomerPaymentSources}=(0,react_1.useContext)(CustomerContext_1.default),{status}=(0,react_1.useContext)(PlaceOrderContext_1.default),{currentPaymentMethodId,config,currentPaymentMethodType,setPaymentSource,paymentSource}=(0,react_1.useContext)(PaymentMethodContext_1.default),paymentResource=readonly?currentPaymentMethodType:payment?.payment_source_type;(0,react_1.useEffect)(()=>{if(payment?.id===currentPaymentMethodId&&paymentResource&&order?.payment_method?.payment_source_type===paymentResource&&!expressPayments){let attributes={};config!=null&&paymentResource==="paypal_payments"&&(attributes=(0,getPaymentAttributes_1.getPaypalAttributes)(paymentResource,config)),config!=null&&paymentResource==="external_payments"&&(attributes=(0,getPaymentAttributes_1.getExternalPaymentAttributes)(paymentResource,config)),config!=null&&paymentResource==="stripe_payments"&&(attributes=(0,getPaymentAttributes_1.getStripeAttributes)(paymentResource,config),attributes!=null&&attributes.return_url==null&&(attributes.return_url=window.location.href)),config!=null&&paymentResource==="checkout_com_payments"&&(attributes=(0,getPaymentAttributes_1.getCkoAttributes)(paymentResource,config));const setPaymentSources=async()=>{order!=null&&await setPaymentSource({paymentResource,order,attributes}),getCustomerPaymentSources&&getCustomerPaymentSources()};(!paymentSource&&order?.payment_method.id&&show&&!expressPayments||(!paymentSource&&!expressPayments||paymentSource?.type!==paymentResource)&&show)&&setPaymentSources(),paymentSource?.mismatched_amounts&&show&&setPaymentSources(),order?.payment_source?.id!=null&&setLoading(!1)}expressPayments&&show&&setLoading(!1),order?.status!=null&&!["draft","pending"].includes(order?.status)&&show&&order?.payment_source?.id!=null&&setLoading(!1)},[order?.payment_method?.id,show,paymentSource]),(0,react_1.useEffect)(()=>{status==="placing"&&setLoading(!0),status==="standby"&&loading&&setLoading(!1),order&&order.status==="placed"&&loading&&setLoading(!1)},[status,order?.status]);const gatewayConfig={readonly,showCard,handleEditClick,children,templateCustomerCards,show,loading,onClickCustomerCards,loaderComponent,templateCustomerSaveToWallet,...p};if(currentPaymentMethodType!==paymentResource)return null;if(loading)return loaderComponent;switch(paymentResource){case"adyen_payments":return(0,jsx_runtime_1.jsx)(AdyenGateway_1.default,{...gatewayConfig,children});case"braintree_payments":return(0,jsx_runtime_1.jsx)(BraintreeGateway_1.default,{...gatewayConfig,children});case"checkout_com_payments":return(0,jsx_runtime_1.jsx)(CheckoutComGateway_1.default,{...gatewayConfig,children});case"external_payments":return(0,jsx_runtime_1.jsx)(ExternalGateway_1.default,{...gatewayConfig,children});case"klarna_payments":return(0,jsx_runtime_1.jsx)(KlarnaGateway_1.default,{...gatewayConfig,children});case"stripe_payments":return(0,jsx_runtime_1.jsx)(StripeGateway_1.default,{...gatewayConfig,children});case"wire_transfers":return(0,jsx_runtime_1.jsx)(WireTransferGateway_1.default,{...gatewayConfig,children});case"paypal_payments":return(0,jsx_runtime_1.jsx)(PaypalGateway_1.default,{...gatewayConfig,children});default:return null}}exports.default=PaymentGateway;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.PaymentGateway=PaymentGateway;const tslib_1=require("tslib"),jsx_runtime_1=require("react/jsx-runtime"),react_1=require("react"),CustomerContext_1=tslib_1.__importDefault(require("../../context/CustomerContext")),OrderContext_1=tslib_1.__importDefault(require("../../context/OrderContext")),PaymentMethodChildrenContext_1=tslib_1.__importDefault(require("../../context/PaymentMethodChildrenContext")),PaymentMethodContext_1=tslib_1.__importDefault(require("../../context/PaymentMethodContext")),PlaceOrderContext_1=tslib_1.__importDefault(require("../../context/PlaceOrderContext")),getLoaderComponent_1=tslib_1.__importDefault(require("../../utils/getLoaderComponent")),getPaymentAttributes_1=require("../../utils/getPaymentAttributes"),AdyenGateway_1=tslib_1.__importDefault(require("./AdyenGateway")),BraintreeGateway_1=tslib_1.__importDefault(require("./BraintreeGateway")),CheckoutComGateway_1=tslib_1.__importDefault(require("./CheckoutComGateway")),ExternalGateway_1=tslib_1.__importDefault(require("./ExternalGateway")),KlarnaGateway_1=tslib_1.__importDefault(require("./KlarnaGateway")),PaypalGateway_1=tslib_1.__importDefault(require("./PaypalGateway")),StripeGateway_1=tslib_1.__importDefault(require("./StripeGateway")),WireTransferGateway_1=tslib_1.__importDefault(require("./WireTransferGateway"));function PaymentGateway({readonly,showCard,handleEditClick,children,templateCustomerCards,templateCustomerSaveToWallet,onClickCustomerCards,show,loader="Loading...",...p}){const loaderComponent=(0,getLoaderComponent_1.default)(loader),[loading,setLoading]=(0,react_1.useState)(!0),{payment,expressPayments}=(0,react_1.useContext)(PaymentMethodChildrenContext_1.default),{order}=(0,react_1.useContext)(OrderContext_1.default),{getCustomerPaymentSources}=(0,react_1.useContext)(CustomerContext_1.default),{status}=(0,react_1.useContext)(PlaceOrderContext_1.default),{currentPaymentMethodId,config,currentPaymentMethodType,setPaymentSource,paymentSource}=(0,react_1.useContext)(PaymentMethodContext_1.default),paymentResource=readonly?currentPaymentMethodType:payment?.payment_source_type;(0,react_1.useEffect)(()=>{if(payment?.id===currentPaymentMethodId&&paymentResource&&order?.payment_method?.payment_source_type===paymentResource&&!expressPayments){let attributes={};config!=null&&paymentResource==="paypal_payments"&&(attributes=(0,getPaymentAttributes_1.getPaypalAttributes)(paymentResource,config)),config!=null&&paymentResource==="external_payments"&&(attributes=(0,getPaymentAttributes_1.getExternalPaymentAttributes)(paymentResource,config)),config!=null&&paymentResource==="stripe_payments"&&(attributes=(0,getPaymentAttributes_1.getStripeAttributes)(paymentResource,config),attributes!=null&&attributes.return_url==null&&(attributes.return_url=window.location.href)),config!=null&&paymentResource==="checkout_com_payments"&&(attributes=(0,getPaymentAttributes_1.getCkoAttributes)(paymentResource,config));const setPaymentSources=async()=>{order!=null&&await setPaymentSource({paymentResource,order,attributes}),getCustomerPaymentSources&&getCustomerPaymentSources()};(!paymentSource&&order?.payment_method.id&&show&&!expressPayments||(!paymentSource&&!expressPayments||paymentSource?.type!==paymentResource)&&show)&&setPaymentSources(),paymentSource?.mismatched_amounts&&show&&setPaymentSources(),order?.payment_source?.id!=null&&setLoading(!1)}return expressPayments&&show&&setLoading(!1),order?.status!=null&&!["draft","pending"].includes(order?.status)&&show&&order?.payment_source?.id!=null&&setLoading(!1),()=>{setLoading(!0)}},[order?.payment_method?.id,show,paymentSource]),(0,react_1.useEffect)(()=>(status==="placing"&&setLoading(!0),status==="standby"&&loading&&setLoading(!1),order&&order.status==="placed"&&loading&&setLoading(!1),order&&["draft","pending"].includes(order?.status)&&order.payment_status==="unpaid"&&loading&&setLoading(!1),()=>{setLoading(!0)}),[status,order?.status,order?.payment_status]);const gatewayConfig={readonly,showCard,handleEditClick,children,templateCustomerCards,show,loading,onClickCustomerCards,loaderComponent,templateCustomerSaveToWallet,...p};if(currentPaymentMethodType!==paymentResource)return null;if(loading)return loaderComponent;switch(paymentResource){case"adyen_payments":return(0,jsx_runtime_1.jsx)(AdyenGateway_1.default,{...gatewayConfig,children});case"braintree_payments":return(0,jsx_runtime_1.jsx)(BraintreeGateway_1.default,{...gatewayConfig,children});case"checkout_com_payments":return(0,jsx_runtime_1.jsx)(CheckoutComGateway_1.default,{...gatewayConfig,children});case"external_payments":return(0,jsx_runtime_1.jsx)(ExternalGateway_1.default,{...gatewayConfig,children});case"klarna_payments":return(0,jsx_runtime_1.jsx)(KlarnaGateway_1.default,{...gatewayConfig,children});case"stripe_payments":return(0,jsx_runtime_1.jsx)(StripeGateway_1.default,{...gatewayConfig,children});case"wire_transfers":return(0,jsx_runtime_1.jsx)(WireTransferGateway_1.default,{...gatewayConfig,children});case"paypal_payments":return(0,jsx_runtime_1.jsx)(PaypalGateway_1.default,{...gatewayConfig,children});default:return null}}exports.default=PaymentGateway;

package/lib/cjs/components/payment_methods/PaymentMethod.js

@@ -1,2 +1,2 @@
 "use client";
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.PaymentMethod=PaymentMethod;const tslib_1=require("tslib"),jsx_runtime_1=require("react/jsx-runtime"),react_1=require("react"),CustomerContext_1=tslib_1.__importDefault(require("../../context/CustomerContext")),OrderContext_1=tslib_1.__importDefault(require("../../context/OrderContext")),PaymentMethodChildrenContext_1=tslib_1.__importDefault(require("../../context/PaymentMethodChildrenContext")),PaymentMethodContext_1=tslib_1.__importDefault(require("../../context/PaymentMethodContext")),PlaceOrderContext_1=tslib_1.__importDefault(require("../../context/PlaceOrderContext")),expressPaymentHelper_1=require("../../utils/expressPaymentHelper"),getLoaderComponent_1=tslib_1.__importDefault(require("../../utils/getLoaderComponent")),getPaymentAttributes_1=require("../../utils/getPaymentAttributes"),useCustomContext_1=tslib_1.__importDefault(require("../../utils/hooks/useCustomContext")),isEmpty_1=require("../../utils/isEmpty"),sortPaymentMethods_1=require("../../utils/payment-methods/sortPaymentMethods");let loadingResource=!1;function PaymentMethod({children,className,activeClass,loader="Loading...",clickableContainer,autoSelectSinglePaymentMethod,expressPayments,showLoader,hide,onClick,sortBy,...p}){const[loading,setLoading]=(0,react_1.useState)(!0),[paymentSelected,setPaymentSelected]=(0,react_1.useState)(""),[paymentSourceCreated,setPaymentSourceCreated]=(0,react_1.useState)(!1),{paymentMethods,currentPaymentMethodId,setPaymentMethod,setLoading:setLoadingPlaceOrder,paymentSource,setPaymentSource,config,errors}=(0,useCustomContext_1.default)({context:PaymentMethodContext_1.default,contextComponentName:"PaymentMethodsContainer",currentComponentName:"PaymentMethod",key:"paymentMethods"}),{order}=(0,react_1.useContext)(OrderContext_1.default),{getCustomerPaymentSources}=(0,react_1.useContext)(CustomerContext_1.default),{status}=(0,react_1.useContext)(PlaceOrderContext_1.default);(0,react_1.useEffect)(()=>{if(paymentMethods!=null&&!(0,isEmpty_1.isEmpty)(paymentMethods)&&expressPayments){const[paymentMethod]=(0,expressPaymentHelper_1.getAvailableExpressPayments)(paymentMethods);!paymentSource&&paymentMethod!=null&&(async()=>{setLoadingPlaceOrder({loading:!0}),setPaymentSelected(paymentMethod.id);const paymentMethodId=paymentMethod?.id,paymentResource=paymentMethod?.payment_source_type;await setPaymentMethod({paymentResource,paymentMethodId});const ps=await setPaymentSource({paymentResource,order});ps&&paymentMethod&&onClick!=null&&(onClick({payment:paymentMethod,order,paymentSource:ps}),setTimeout(()=>{showLoader&&errors?.length===0?setLoading(showLoader):setLoading(!1)},200)),setLoadingPlaceOrder({loading:!1})})()}},[!(0,isEmpty_1.isEmpty)(paymentMethods),expressPayments,errors?.length]),(0,react_1.useEffect)(()=>{paymentMethods!=null&&!paymentSourceCreated&&!loadingResource&&!(0,isEmpty_1.isEmpty)(paymentMethods)&&(loadingResource=!0,autoSelectSinglePaymentMethod!=null&&!expressPayments&&(async()=>{if(paymentMethods.length===1){const[paymentMethod]=paymentMethods??[];if(paymentMethod&&!paymentSource){setLoadingPlaceOrder({loading:!0}),setPaymentSelected(paymentMethod.id);const paymentMethodId=paymentMethod?.id,paymentResource=paymentMethod?.payment_source_type;await setPaymentMethod({paymentResource,paymentMethodId});let attributes={};config!=null&&paymentResource==="paypal_payments"&&(attributes=(0,getPaymentAttributes_1.getPaypalAttributes)(paymentResource,config)),config!=null&&paymentResource==="external_payments"&&(attributes=(0,getPaymentAttributes_1.getExternalPaymentAttributes)(paymentResource,config)),config!=null&&paymentResource==="checkout_com_payments"&&(attributes=(0,getPaymentAttributes_1.getCkoAttributes)(paymentResource,config));const ps=await setPaymentSource({paymentResource,order,attributes});ps&&paymentMethod&&onClick!=null&&(setPaymentSourceCreated(!0),onClick({payment:paymentMethod,order,paymentSource:ps}),setTimeout(()=>{showLoader&&errors?.length===0?setLoading(showLoader):setLoading(!1)},200)),getCustomerPaymentSources&&getCustomerPaymentSources(),setLoadingPlaceOrder({loading:!1})}typeof autoSelectSinglePaymentMethod=="function"&&autoSelectSinglePaymentMethod()}else setTimeout(()=>{showLoader&&errors?.length===0?setLoading(showLoader):setLoading(!1)},200)})())},[!(0,isEmpty_1.isEmpty)(paymentMethods),order?.payment_source!=null,errors?.length]),(0,react_1.useEffect)(()=>(paymentMethods&&(paymentMethods.length===1&&autoSelectSinglePaymentMethod?paymentSource&&setTimeout(()=>{showLoader&&errors?.length===0?setLoading(showLoader):setLoading(!1)},200):showLoader&&errors?.length===0?setLoading(showLoader):setLoading(!1)),currentPaymentMethodId&&setPaymentSelected(currentPaymentMethodId),()=>{setLoading(!0),setPaymentSelected("")}),[paymentMethods,currentPaymentMethodId,errors?.length]),(0,react_1.useEffect)(()=>{const status2=order?.payment_source?.payment_response?.status;showLoader!==void 0&&(showLoader&&status2?status2.toLowerCase()==="declined"?setLoading(!1):setLoading(!0):setLoading(!1))},[showLoader,order?.payment_source]);const components=(paymentMethods!=null&&sortBy!=null?(0,sortPaymentMethods_1.sortPaymentMethods)(paymentMethods,sortBy):paymentMethods)?.filter(payment=>{if(Array.isArray(hide)){const source=payment?.payment_source_type;return!hide?.includes(source)}return typeof hide=="function"?hide(payment):!0}).map(payment=>{const isActive=currentPaymentMethodId===payment?.id,paymentMethodProps={payment,clickableContainer,paymentSelected,setPaymentSelected,expressPayments},paymentResource=payment?.payment_source_type,onClickable=clickableContainer?async e=>{e.stopPropagation();const paymentMethodId=payment?.id,currentPaymentMethodId2=order?.payment_method?.id;if(paymentMethodId===currentPaymentMethodId2||status==="placing")return;setLoadingPlaceOrder({loading:!0}),setPaymentSelected(payment.id);const{order:updatedOrder}=await setPaymentMethod({paymentResource,paymentMethodId});onClick&&onClick({payment,order:updatedOrder}),setLoadingPlaceOrder({loading:!1})}:void 0;return(0,jsx_runtime_1.jsx)("div",{"data-testid":paymentResource,className:`${className??""} ${isActive&&activeClass!=null?activeClass:""}`,onClick:e=>{onClickable?.(e)},...p,children:(0,jsx_runtime_1.jsx)(PaymentMethodChildrenContext_1.default.Provider,{value:paymentMethodProps,children})},paymentResource)});return loading?(0,getLoaderComponent_1.default)(loader):(0,jsx_runtime_1.jsx)(jsx_runtime_1.Fragment,{children:components})}exports.default=PaymentMethod;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.PaymentMethod=PaymentMethod;const tslib_1=require("tslib"),jsx_runtime_1=require("react/jsx-runtime"),react_1=require("react"),CustomerContext_1=tslib_1.__importDefault(require("../../context/CustomerContext")),OrderContext_1=tslib_1.__importDefault(require("../../context/OrderContext")),PaymentMethodChildrenContext_1=tslib_1.__importDefault(require("../../context/PaymentMethodChildrenContext")),PaymentMethodContext_1=tslib_1.__importDefault(require("../../context/PaymentMethodContext")),PlaceOrderContext_1=tslib_1.__importDefault(require("../../context/PlaceOrderContext")),expressPaymentHelper_1=require("../../utils/expressPaymentHelper"),getLoaderComponent_1=tslib_1.__importDefault(require("../../utils/getLoaderComponent")),getPaymentAttributes_1=require("../../utils/getPaymentAttributes"),useCustomContext_1=tslib_1.__importDefault(require("../../utils/hooks/useCustomContext")),isEmpty_1=require("../../utils/isEmpty"),sortPaymentMethods_1=require("../../utils/payment-methods/sortPaymentMethods");let loadingResource=!1;function PaymentMethod({children,className,activeClass,loader="Loading...",clickableContainer,autoSelectSinglePaymentMethod,expressPayments,showLoader,hide,onClick,sortBy,...p}){const[loading,setLoading]=(0,react_1.useState)(!0),[paymentSelected,setPaymentSelected]=(0,react_1.useState)(""),[paymentSourceCreated,setPaymentSourceCreated]=(0,react_1.useState)(!1),{paymentMethods,currentPaymentMethodId,setPaymentMethod,setLoading:setLoadingPlaceOrder,paymentSource,setPaymentSource,config,errors}=(0,useCustomContext_1.default)({context:PaymentMethodContext_1.default,contextComponentName:"PaymentMethodsContainer",currentComponentName:"PaymentMethod",key:"paymentMethods"}),{order}=(0,react_1.useContext)(OrderContext_1.default),{getCustomerPaymentSources}=(0,react_1.useContext)(CustomerContext_1.default),{status}=(0,react_1.useContext)(PlaceOrderContext_1.default);(0,react_1.useEffect)(()=>{if(paymentMethods!=null&&!(0,isEmpty_1.isEmpty)(paymentMethods)&&expressPayments){const[paymentMethod]=(0,expressPaymentHelper_1.getAvailableExpressPayments)(paymentMethods);!paymentSource&&paymentMethod!=null&&(async()=>{setLoadingPlaceOrder({loading:!0}),setPaymentSelected(paymentMethod.id);const paymentMethodId=paymentMethod?.id,paymentResource=paymentMethod?.payment_source_type;await setPaymentMethod({paymentResource,paymentMethodId});const ps=await setPaymentSource({paymentResource,order});ps&&paymentMethod&&onClick!=null&&(onClick({payment:paymentMethod,order,paymentSource:ps}),setTimeout(()=>{showLoader&&errors?.length===0?setLoading(showLoader):setLoading(!1)},200)),setLoadingPlaceOrder({loading:!1})})()}},[!(0,isEmpty_1.isEmpty)(paymentMethods),expressPayments,errors?.length]),(0,react_1.useEffect)(()=>{paymentMethods!=null&&!paymentSourceCreated&&!loadingResource&&!(0,isEmpty_1.isEmpty)(paymentMethods)&&(loadingResource=!0,autoSelectSinglePaymentMethod!=null&&!expressPayments&&(async()=>{if(paymentMethods.length===1){const[paymentMethod]=paymentMethods??[];if(paymentMethod&&!paymentSource){setLoadingPlaceOrder({loading:!0}),setPaymentSelected(paymentMethod.id);const paymentMethodId=paymentMethod?.id,paymentResource=paymentMethod?.payment_source_type;await setPaymentMethod({paymentResource,paymentMethodId});let attributes={};config!=null&&paymentResource==="paypal_payments"&&(attributes=(0,getPaymentAttributes_1.getPaypalAttributes)(paymentResource,config)),config!=null&&paymentResource==="external_payments"&&(attributes=(0,getPaymentAttributes_1.getExternalPaymentAttributes)(paymentResource,config)),config!=null&&paymentResource==="checkout_com_payments"&&(attributes=(0,getPaymentAttributes_1.getCkoAttributes)(paymentResource,config));const ps=await setPaymentSource({paymentResource,order,attributes});ps&&paymentMethod&&onClick!=null&&(setPaymentSourceCreated(!0),onClick({payment:paymentMethod,order,paymentSource:ps}),setTimeout(()=>{showLoader&&errors?.length===0?setLoading(showLoader):setLoading(!1)},200)),getCustomerPaymentSources&&getCustomerPaymentSources(),setLoadingPlaceOrder({loading:!1})}typeof autoSelectSinglePaymentMethod=="function"&&autoSelectSinglePaymentMethod()}else setTimeout(()=>{showLoader&&errors?.length===0?setLoading(showLoader):setLoading(!1)},200)})())},[!(0,isEmpty_1.isEmpty)(paymentMethods),order?.payment_source!=null,errors?.length]),(0,react_1.useEffect)(()=>(paymentMethods&&(paymentMethods.length===1&&autoSelectSinglePaymentMethod?paymentSource&&setTimeout(()=>{showLoader&&errors?.length===0?setLoading(showLoader):setLoading(!1)},200):showLoader&&errors?.length===0?setLoading(showLoader):setLoading(!1)),currentPaymentMethodId&&setPaymentSelected(currentPaymentMethodId),()=>{setLoading(!0),setPaymentSelected("")}),[paymentMethods,currentPaymentMethodId,errors?.length]),(0,react_1.useEffect)(()=>{const status2=order?.payment_source?.payment_response?.status,orderStatus=order?.status;showLoader!==void 0&&(showLoader&&status2&&loading?status2.toLowerCase()==="declined"&&orderStatus!=="placed"?setLoading(!1):setLoading(!0):setLoading(!1))},[showLoader,order?.payment_source?.payment_response?.status,order?.status,loading]);const components=(paymentMethods!=null&&sortBy!=null?(0,sortPaymentMethods_1.sortPaymentMethods)(paymentMethods,sortBy):paymentMethods)?.filter(payment=>{if(Array.isArray(hide)){const source=payment?.payment_source_type;return!hide?.includes(source)}return typeof hide=="function"?hide(payment):!0}).map(payment=>{const isActive=currentPaymentMethodId===payment?.id,paymentMethodProps={payment,clickableContainer,paymentSelected,setPaymentSelected,expressPayments},paymentResource=payment?.payment_source_type,onClickable=clickableContainer?async e=>{e.stopPropagation();const paymentMethodId=payment?.id,currentPaymentMethodId2=order?.payment_method?.id;if(paymentMethodId===currentPaymentMethodId2||status==="placing")return;setLoadingPlaceOrder({loading:!0}),setPaymentSelected(payment.id);const{order:updatedOrder}=await setPaymentMethod({paymentResource,paymentMethodId});onClick&&onClick({payment,order:updatedOrder}),setLoadingPlaceOrder({loading:!1})}:void 0;return(0,jsx_runtime_1.jsx)("div",{"data-testid":paymentResource,className:`${className??""} ${isActive&&activeClass!=null?activeClass:""}`,onClick:e=>{onClickable?.(e)},...p,children:(0,jsx_runtime_1.jsx)(PaymentMethodChildrenContext_1.default.Provider,{value:paymentMethodProps,children})},paymentResource)});return loading?(0,getLoaderComponent_1.default)(loader):(0,jsx_runtime_1.jsx)(jsx_runtime_1.Fragment,{children:components})}exports.default=PaymentMethod;

package/lib/esm/components/payment_gateways/PaymentGateway.js

@@ -1,2 +1,2 @@
 "use client";
-import{jsx as _jsx}from"react/jsx-runtime";import{useContext,useEffect,useState}from"react";import CustomerContext from"../../context/CustomerContext";import OrderContext from"../../context/OrderContext";import PaymentMethodChildrenContext from"../../context/PaymentMethodChildrenContext";import PaymentMethodContext from"../../context/PaymentMethodContext";import PlaceOrderContext from"../../context/PlaceOrderContext";import getLoaderComponent from"../../utils/getLoaderComponent";import{getCkoAttributes,getExternalPaymentAttributes,getPaypalAttributes,getStripeAttributes}from"../../utils/getPaymentAttributes";import AdyenGateway from"./AdyenGateway";import BraintreeGateway from"./BraintreeGateway";import CheckoutComGateway from"./CheckoutComGateway";import ExternalGateway from"./ExternalGateway";import KlarnaGateway from"./KlarnaGateway";import PaypalGateway from"./PaypalGateway";import StripeGateway from"./StripeGateway";import WireTransferGateway from"./WireTransferGateway";export function PaymentGateway({readonly,showCard,handleEditClick,children,templateCustomerCards,templateCustomerSaveToWallet,onClickCustomerCards,show,loader="Loading...",...p}){const loaderComponent=getLoaderComponent(loader),[loading,setLoading]=useState(!0),{payment,expressPayments}=useContext(PaymentMethodChildrenContext),{order}=useContext(OrderContext),{getCustomerPaymentSources}=useContext(CustomerContext),{status}=useContext(PlaceOrderContext),{currentPaymentMethodId,config,currentPaymentMethodType,setPaymentSource,paymentSource}=useContext(PaymentMethodContext),paymentResource=readonly?currentPaymentMethodType:payment?.payment_source_type;useEffect(()=>{if(payment?.id===currentPaymentMethodId&&paymentResource&&order?.payment_method?.payment_source_type===paymentResource&&!expressPayments){let attributes={};config!=null&&paymentResource==="paypal_payments"&&(attributes=getPaypalAttributes(paymentResource,config)),config!=null&&paymentResource==="external_payments"&&(attributes=getExternalPaymentAttributes(paymentResource,config)),config!=null&&paymentResource==="stripe_payments"&&(attributes=getStripeAttributes(paymentResource,config),attributes!=null&&attributes.return_url==null&&(attributes.return_url=window.location.href)),config!=null&&paymentResource==="checkout_com_payments"&&(attributes=getCkoAttributes(paymentResource,config));const setPaymentSources=async()=>{order!=null&&await setPaymentSource({paymentResource,order,attributes}),getCustomerPaymentSources&&getCustomerPaymentSources()};(!paymentSource&&order?.payment_method.id&&show&&!expressPayments||(!paymentSource&&!expressPayments||paymentSource?.type!==paymentResource)&&show)&&setPaymentSources(),paymentSource?.mismatched_amounts&&show&&setPaymentSources(),order?.payment_source?.id!=null&&setLoading(!1)}expressPayments&&show&&setLoading(!1),order?.status!=null&&!["draft","pending"].includes(order?.status)&&show&&order?.payment_source?.id!=null&&setLoading(!1)},[order?.payment_method?.id,show,paymentSource]),useEffect(()=>{status==="placing"&&setLoading(!0),status==="standby"&&loading&&setLoading(!1),order&&order.status==="placed"&&loading&&setLoading(!1)},[status,order?.status]);const gatewayConfig={readonly,showCard,handleEditClick,children,templateCustomerCards,show,loading,onClickCustomerCards,loaderComponent,templateCustomerSaveToWallet,...p};if(currentPaymentMethodType!==paymentResource)return null;if(loading)return loaderComponent;switch(paymentResource){case"adyen_payments":return _jsx(AdyenGateway,{...gatewayConfig,children});case"braintree_payments":return _jsx(BraintreeGateway,{...gatewayConfig,children});case"checkout_com_payments":return _jsx(CheckoutComGateway,{...gatewayConfig,children});case"external_payments":return _jsx(ExternalGateway,{...gatewayConfig,children});case"klarna_payments":return _jsx(KlarnaGateway,{...gatewayConfig,children});case"stripe_payments":return _jsx(StripeGateway,{...gatewayConfig,children});case"wire_transfers":return _jsx(WireTransferGateway,{...gatewayConfig,children});case"paypal_payments":return _jsx(PaypalGateway,{...gatewayConfig,children});default:return null}}export default PaymentGateway;
+import{jsx as _jsx}from"react/jsx-runtime";import{useContext,useEffect,useState}from"react";import CustomerContext from"../../context/CustomerContext";import OrderContext from"../../context/OrderContext";import PaymentMethodChildrenContext from"../../context/PaymentMethodChildrenContext";import PaymentMethodContext from"../../context/PaymentMethodContext";import PlaceOrderContext from"../../context/PlaceOrderContext";import getLoaderComponent from"../../utils/getLoaderComponent";import{getCkoAttributes,getExternalPaymentAttributes,getPaypalAttributes,getStripeAttributes}from"../../utils/getPaymentAttributes";import AdyenGateway from"./AdyenGateway";import BraintreeGateway from"./BraintreeGateway";import CheckoutComGateway from"./CheckoutComGateway";import ExternalGateway from"./ExternalGateway";import KlarnaGateway from"./KlarnaGateway";import PaypalGateway from"./PaypalGateway";import StripeGateway from"./StripeGateway";import WireTransferGateway from"./WireTransferGateway";export function PaymentGateway({readonly,showCard,handleEditClick,children,templateCustomerCards,templateCustomerSaveToWallet,onClickCustomerCards,show,loader="Loading...",...p}){const loaderComponent=getLoaderComponent(loader),[loading,setLoading]=useState(!0),{payment,expressPayments}=useContext(PaymentMethodChildrenContext),{order}=useContext(OrderContext),{getCustomerPaymentSources}=useContext(CustomerContext),{status}=useContext(PlaceOrderContext),{currentPaymentMethodId,config,currentPaymentMethodType,setPaymentSource,paymentSource}=useContext(PaymentMethodContext),paymentResource=readonly?currentPaymentMethodType:payment?.payment_source_type;useEffect(()=>{if(payment?.id===currentPaymentMethodId&&paymentResource&&order?.payment_method?.payment_source_type===paymentResource&&!expressPayments){let attributes={};config!=null&&paymentResource==="paypal_payments"&&(attributes=getPaypalAttributes(paymentResource,config)),config!=null&&paymentResource==="external_payments"&&(attributes=getExternalPaymentAttributes(paymentResource,config)),config!=null&&paymentResource==="stripe_payments"&&(attributes=getStripeAttributes(paymentResource,config),attributes!=null&&attributes.return_url==null&&(attributes.return_url=window.location.href)),config!=null&&paymentResource==="checkout_com_payments"&&(attributes=getCkoAttributes(paymentResource,config));const setPaymentSources=async()=>{order!=null&&await setPaymentSource({paymentResource,order,attributes}),getCustomerPaymentSources&&getCustomerPaymentSources()};(!paymentSource&&order?.payment_method.id&&show&&!expressPayments||(!paymentSource&&!expressPayments||paymentSource?.type!==paymentResource)&&show)&&setPaymentSources(),paymentSource?.mismatched_amounts&&show&&setPaymentSources(),order?.payment_source?.id!=null&&setLoading(!1)}return expressPayments&&show&&setLoading(!1),order?.status!=null&&!["draft","pending"].includes(order?.status)&&show&&order?.payment_source?.id!=null&&setLoading(!1),()=>{setLoading(!0)}},[order?.payment_method?.id,show,paymentSource]),useEffect(()=>(status==="placing"&&setLoading(!0),status==="standby"&&loading&&setLoading(!1),order&&order.status==="placed"&&loading&&setLoading(!1),order&&["draft","pending"].includes(order?.status)&&order.payment_status==="unpaid"&&loading&&setLoading(!1),()=>{setLoading(!0)}),[status,order?.status,order?.payment_status]);const gatewayConfig={readonly,showCard,handleEditClick,children,templateCustomerCards,show,loading,onClickCustomerCards,loaderComponent,templateCustomerSaveToWallet,...p};if(currentPaymentMethodType!==paymentResource)return null;if(loading)return loaderComponent;switch(paymentResource){case"adyen_payments":return _jsx(AdyenGateway,{...gatewayConfig,children});case"braintree_payments":return _jsx(BraintreeGateway,{...gatewayConfig,children});case"checkout_com_payments":return _jsx(CheckoutComGateway,{...gatewayConfig,children});case"external_payments":return _jsx(ExternalGateway,{...gatewayConfig,children});case"klarna_payments":return _jsx(KlarnaGateway,{...gatewayConfig,children});case"stripe_payments":return _jsx(StripeGateway,{...gatewayConfig,children});case"wire_transfers":return _jsx(WireTransferGateway,{...gatewayConfig,children});case"paypal_payments":return _jsx(PaypalGateway,{...gatewayConfig,children});default:return null}}export default PaymentGateway;

package/lib/esm/components/payment_methods/PaymentMethod.js

@@ -1,2 +1,2 @@
 "use client";
-import{jsx as _jsx,Fragment as _Fragment}from"react/jsx-runtime";import{useContext,useEffect,useState}from"react";import CustomerContext from"../../context/CustomerContext";import OrderContext from"../../context/OrderContext";import PaymentMethodChildrenContext from"../../context/PaymentMethodChildrenContext";import PaymentMethodContext from"../../context/PaymentMethodContext";import PlaceOrderContext from"../../context/PlaceOrderContext";import{getAvailableExpressPayments}from"../../utils/expressPaymentHelper";import getLoaderComponent from"../../utils/getLoaderComponent";import{getCkoAttributes,getExternalPaymentAttributes,getPaypalAttributes}from"../../utils/getPaymentAttributes";import useCustomContext from"../../utils/hooks/useCustomContext";import{isEmpty}from"../../utils/isEmpty";import{sortPaymentMethods}from"../../utils/payment-methods/sortPaymentMethods";let loadingResource=!1;export function PaymentMethod({children,className,activeClass,loader="Loading...",clickableContainer,autoSelectSinglePaymentMethod,expressPayments,showLoader,hide,onClick,sortBy,...p}){const[loading,setLoading]=useState(!0),[paymentSelected,setPaymentSelected]=useState(""),[paymentSourceCreated,setPaymentSourceCreated]=useState(!1),{paymentMethods,currentPaymentMethodId,setPaymentMethod,setLoading:setLoadingPlaceOrder,paymentSource,setPaymentSource,config,errors}=useCustomContext({context:PaymentMethodContext,contextComponentName:"PaymentMethodsContainer",currentComponentName:"PaymentMethod",key:"paymentMethods"}),{order}=useContext(OrderContext),{getCustomerPaymentSources}=useContext(CustomerContext),{status}=useContext(PlaceOrderContext);useEffect(()=>{if(paymentMethods!=null&&!isEmpty(paymentMethods)&&expressPayments){const[paymentMethod]=getAvailableExpressPayments(paymentMethods);!paymentSource&&paymentMethod!=null&&(async()=>{setLoadingPlaceOrder({loading:!0}),setPaymentSelected(paymentMethod.id);const paymentMethodId=paymentMethod?.id,paymentResource=paymentMethod?.payment_source_type;await setPaymentMethod({paymentResource,paymentMethodId});const ps=await setPaymentSource({paymentResource,order});ps&&paymentMethod&&onClick!=null&&(onClick({payment:paymentMethod,order,paymentSource:ps}),setTimeout(()=>{showLoader&&errors?.length===0?setLoading(showLoader):setLoading(!1)},200)),setLoadingPlaceOrder({loading:!1})})()}},[!isEmpty(paymentMethods),expressPayments,errors?.length]),useEffect(()=>{paymentMethods!=null&&!paymentSourceCreated&&!loadingResource&&!isEmpty(paymentMethods)&&(loadingResource=!0,autoSelectSinglePaymentMethod!=null&&!expressPayments&&(async()=>{if(paymentMethods.length===1){const[paymentMethod]=paymentMethods??[];if(paymentMethod&&!paymentSource){setLoadingPlaceOrder({loading:!0}),setPaymentSelected(paymentMethod.id);const paymentMethodId=paymentMethod?.id,paymentResource=paymentMethod?.payment_source_type;await setPaymentMethod({paymentResource,paymentMethodId});let attributes={};config!=null&&paymentResource==="paypal_payments"&&(attributes=getPaypalAttributes(paymentResource,config)),config!=null&&paymentResource==="external_payments"&&(attributes=getExternalPaymentAttributes(paymentResource,config)),config!=null&&paymentResource==="checkout_com_payments"&&(attributes=getCkoAttributes(paymentResource,config));const ps=await setPaymentSource({paymentResource,order,attributes});ps&&paymentMethod&&onClick!=null&&(setPaymentSourceCreated(!0),onClick({payment:paymentMethod,order,paymentSource:ps}),setTimeout(()=>{showLoader&&errors?.length===0?setLoading(showLoader):setLoading(!1)},200)),getCustomerPaymentSources&&getCustomerPaymentSources(),setLoadingPlaceOrder({loading:!1})}typeof autoSelectSinglePaymentMethod=="function"&&autoSelectSinglePaymentMethod()}else setTimeout(()=>{showLoader&&errors?.length===0?setLoading(showLoader):setLoading(!1)},200)})())},[!isEmpty(paymentMethods),order?.payment_source!=null,errors?.length]),useEffect(()=>(paymentMethods&&(paymentMethods.length===1&&autoSelectSinglePaymentMethod?paymentSource&&setTimeout(()=>{showLoader&&errors?.length===0?setLoading(showLoader):setLoading(!1)},200):showLoader&&errors?.length===0?setLoading(showLoader):setLoading(!1)),currentPaymentMethodId&&setPaymentSelected(currentPaymentMethodId),()=>{setLoading(!0),setPaymentSelected("")}),[paymentMethods,currentPaymentMethodId,errors?.length]),useEffect(()=>{const status2=order?.payment_source?.payment_response?.status;showLoader!==void 0&&(showLoader&&status2?status2.toLowerCase()==="declined"?setLoading(!1):setLoading(!0):setLoading(!1))},[showLoader,order?.payment_source]);const components=(paymentMethods!=null&&sortBy!=null?sortPaymentMethods(paymentMethods,sortBy):paymentMethods)?.filter(payment=>{if(Array.isArray(hide)){const source=payment?.payment_source_type;return!hide?.includes(source)}return typeof hide=="function"?hide(payment):!0}).map(payment=>{const isActive=currentPaymentMethodId===payment?.id,paymentMethodProps={payment,clickableContainer,paymentSelected,setPaymentSelected,expressPayments},paymentResource=payment?.payment_source_type,onClickable=clickableContainer?async e=>{e.stopPropagation();const paymentMethodId=payment?.id,currentPaymentMethodId2=order?.payment_method?.id;if(paymentMethodId===currentPaymentMethodId2||status==="placing")return;setLoadingPlaceOrder({loading:!0}),setPaymentSelected(payment.id);const{order:updatedOrder}=await setPaymentMethod({paymentResource,paymentMethodId});onClick&&onClick({payment,order:updatedOrder}),setLoadingPlaceOrder({loading:!1})}:void 0;return _jsx("div",{"data-testid":paymentResource,className:`${className??""} ${isActive&&activeClass!=null?activeClass:""}`,onClick:e=>{onClickable?.(e)},...p,children:_jsx(PaymentMethodChildrenContext.Provider,{value:paymentMethodProps,children})},paymentResource)});return loading?getLoaderComponent(loader):_jsx(_Fragment,{children:components})}export default PaymentMethod;
+import{jsx as _jsx,Fragment as _Fragment}from"react/jsx-runtime";import{useContext,useEffect,useState}from"react";import CustomerContext from"../../context/CustomerContext";import OrderContext from"../../context/OrderContext";import PaymentMethodChildrenContext from"../../context/PaymentMethodChildrenContext";import PaymentMethodContext from"../../context/PaymentMethodContext";import PlaceOrderContext from"../../context/PlaceOrderContext";import{getAvailableExpressPayments}from"../../utils/expressPaymentHelper";import getLoaderComponent from"../../utils/getLoaderComponent";import{getCkoAttributes,getExternalPaymentAttributes,getPaypalAttributes}from"../../utils/getPaymentAttributes";import useCustomContext from"../../utils/hooks/useCustomContext";import{isEmpty}from"../../utils/isEmpty";import{sortPaymentMethods}from"../../utils/payment-methods/sortPaymentMethods";let loadingResource=!1;export function PaymentMethod({children,className,activeClass,loader="Loading...",clickableContainer,autoSelectSinglePaymentMethod,expressPayments,showLoader,hide,onClick,sortBy,...p}){const[loading,setLoading]=useState(!0),[paymentSelected,setPaymentSelected]=useState(""),[paymentSourceCreated,setPaymentSourceCreated]=useState(!1),{paymentMethods,currentPaymentMethodId,setPaymentMethod,setLoading:setLoadingPlaceOrder,paymentSource,setPaymentSource,config,errors}=useCustomContext({context:PaymentMethodContext,contextComponentName:"PaymentMethodsContainer",currentComponentName:"PaymentMethod",key:"paymentMethods"}),{order}=useContext(OrderContext),{getCustomerPaymentSources}=useContext(CustomerContext),{status}=useContext(PlaceOrderContext);useEffect(()=>{if(paymentMethods!=null&&!isEmpty(paymentMethods)&&expressPayments){const[paymentMethod]=getAvailableExpressPayments(paymentMethods);!paymentSource&&paymentMethod!=null&&(async()=>{setLoadingPlaceOrder({loading:!0}),setPaymentSelected(paymentMethod.id);const paymentMethodId=paymentMethod?.id,paymentResource=paymentMethod?.payment_source_type;await setPaymentMethod({paymentResource,paymentMethodId});const ps=await setPaymentSource({paymentResource,order});ps&&paymentMethod&&onClick!=null&&(onClick({payment:paymentMethod,order,paymentSource:ps}),setTimeout(()=>{showLoader&&errors?.length===0?setLoading(showLoader):setLoading(!1)},200)),setLoadingPlaceOrder({loading:!1})})()}},[!isEmpty(paymentMethods),expressPayments,errors?.length]),useEffect(()=>{paymentMethods!=null&&!paymentSourceCreated&&!loadingResource&&!isEmpty(paymentMethods)&&(loadingResource=!0,autoSelectSinglePaymentMethod!=null&&!expressPayments&&(async()=>{if(paymentMethods.length===1){const[paymentMethod]=paymentMethods??[];if(paymentMethod&&!paymentSource){setLoadingPlaceOrder({loading:!0}),setPaymentSelected(paymentMethod.id);const paymentMethodId=paymentMethod?.id,paymentResource=paymentMethod?.payment_source_type;await setPaymentMethod({paymentResource,paymentMethodId});let attributes={};config!=null&&paymentResource==="paypal_payments"&&(attributes=getPaypalAttributes(paymentResource,config)),config!=null&&paymentResource==="external_payments"&&(attributes=getExternalPaymentAttributes(paymentResource,config)),config!=null&&paymentResource==="checkout_com_payments"&&(attributes=getCkoAttributes(paymentResource,config));const ps=await setPaymentSource({paymentResource,order,attributes});ps&&paymentMethod&&onClick!=null&&(setPaymentSourceCreated(!0),onClick({payment:paymentMethod,order,paymentSource:ps}),setTimeout(()=>{showLoader&&errors?.length===0?setLoading(showLoader):setLoading(!1)},200)),getCustomerPaymentSources&&getCustomerPaymentSources(),setLoadingPlaceOrder({loading:!1})}typeof autoSelectSinglePaymentMethod=="function"&&autoSelectSinglePaymentMethod()}else setTimeout(()=>{showLoader&&errors?.length===0?setLoading(showLoader):setLoading(!1)},200)})())},[!isEmpty(paymentMethods),order?.payment_source!=null,errors?.length]),useEffect(()=>(paymentMethods&&(paymentMethods.length===1&&autoSelectSinglePaymentMethod?paymentSource&&setTimeout(()=>{showLoader&&errors?.length===0?setLoading(showLoader):setLoading(!1)},200):showLoader&&errors?.length===0?setLoading(showLoader):setLoading(!1)),currentPaymentMethodId&&setPaymentSelected(currentPaymentMethodId),()=>{setLoading(!0),setPaymentSelected("")}),[paymentMethods,currentPaymentMethodId,errors?.length]),useEffect(()=>{const status2=order?.payment_source?.payment_response?.status,orderStatus=order?.status;showLoader!==void 0&&(showLoader&&status2&&loading?status2.toLowerCase()==="declined"&&orderStatus!=="placed"?setLoading(!1):setLoading(!0):setLoading(!1))},[showLoader,order?.payment_source?.payment_response?.status,order?.status,loading]);const components=(paymentMethods!=null&&sortBy!=null?sortPaymentMethods(paymentMethods,sortBy):paymentMethods)?.filter(payment=>{if(Array.isArray(hide)){const source=payment?.payment_source_type;return!hide?.includes(source)}return typeof hide=="function"?hide(payment):!0}).map(payment=>{const isActive=currentPaymentMethodId===payment?.id,paymentMethodProps={payment,clickableContainer,paymentSelected,setPaymentSelected,expressPayments},paymentResource=payment?.payment_source_type,onClickable=clickableContainer?async e=>{e.stopPropagation();const paymentMethodId=payment?.id,currentPaymentMethodId2=order?.payment_method?.id;if(paymentMethodId===currentPaymentMethodId2||status==="placing")return;setLoadingPlaceOrder({loading:!0}),setPaymentSelected(payment.id);const{order:updatedOrder}=await setPaymentMethod({paymentResource,paymentMethodId});onClick&&onClick({payment,order:updatedOrder}),setLoadingPlaceOrder({loading:!1})}:void 0;return _jsx("div",{"data-testid":paymentResource,className:`${className??""} ${isActive&&activeClass!=null?activeClass:""}`,onClick:e=>{onClickable?.(e)},...p,children:_jsx(PaymentMethodChildrenContext.Provider,{value:paymentMethodProps,children})},paymentResource)});return loading?getLoaderComponent(loader):_jsx(_Fragment,{children:components})}export default PaymentMethod;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@commercelayer/react-components",
-  "version": "4.28.6-beta.1",
+  "version": "4.28.6-beta.2",
   "description": "The Official Commerce Layer React Components",
   "main": "lib/cjs/index.js",
   "module": "lib/esm/index.js",