@commercelayer/react-components 4.2.1-beta.5 → 4.2.1-beta.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/cjs/components/orders/PlaceOrderButton.js +1 -1
- package/lib/cjs/components/payment_source/AdyenPayment.js +1 -1
- package/lib/cjs/components/payment_source/PaymentSourceBrandName.js +1 -1
- package/lib/esm/components/orders/PlaceOrderButton.js +1 -1
- package/lib/esm/components/payment_source/AdyenPayment.js +1 -1
- package/lib/esm/components/payment_source/PaymentSourceBrandName.js +1 -1
- package/lib/tsconfig.prod.esm.tsbuildinfo +1 -1
- package/lib/tsconfig.prod.tsbuildinfo +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.PlaceOrderButton=void 0;const tslib_1=require("tslib"),jsx_runtime_1=require("react/jsx-runtime"),react_1=require("react"),Parent_1=tslib_1.__importDefault(require("../utils/Parent")),PlaceOrderContext_1=tslib_1.__importDefault(require("../../context/PlaceOrderContext")),isFunction_1=tslib_1.__importDefault(require("lodash/isFunction")),PaymentMethodContext_1=tslib_1.__importDefault(require("../../context/PaymentMethodContext")),OrderContext_1=tslib_1.__importDefault(require("../../context/OrderContext")),getCardDetails_1=tslib_1.__importDefault(require("../../utils/getCardDetails"));function PlaceOrderButton(props){const ref=(0,react_1.useRef)(null),{children,label="Place order",disabled,onClick,...p}=props,{isPermitted,setPlaceOrder,options,paymentType,setButtonRef}=(0,react_1.useContext)(PlaceOrderContext_1.default),[notPermitted,setNotPermitted]=(0,react_1.useState)(!0),[forceDisable,setForceDisable]=(0,react_1.useState)(disabled),{currentPaymentMethodRef,loading,currentPaymentMethodType,paymentSource,setPaymentSource,setPaymentMethodErrors}=(0,react_1.useContext)(PaymentMethodContext_1.default),{order}=(0,react_1.useContext)(OrderContext_1.default),isFree=order?.total_amount_with_taxes_cents===0;(0,react_1.useEffect)(()=>{if(loading)setNotPermitted(loading);else if(paymentType===currentPaymentMethodType&&paymentType){const card=(0,getCardDetails_1.default)({customerPayment:{payment_source:paymentSource},paymentType});(isFree&&isPermitted||currentPaymentMethodRef?.current?.onsubmit||card.brand)&&isPermitted&&setNotPermitted(!1)}else setNotPermitted(!(isFree&&isPermitted));return()=>{setNotPermitted(!0)}},[isPermitted,paymentType,currentPaymentMethodRef?.current?.onsubmit,loading,currentPaymentMethodType,order,paymentSource]),(0,react_1.useEffect)(()=>{paymentType==="paypal_payments"&&options?.paypalPayerId&&order?.status&&["draft","pending"].includes(order?.status)&&handleClick()},[options?.paypalPayerId,paymentType]),(0,react_1.useEffect)(()=>{if(
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.PlaceOrderButton=void 0;const tslib_1=require("tslib"),jsx_runtime_1=require("react/jsx-runtime"),react_1=require("react"),Parent_1=tslib_1.__importDefault(require("../utils/Parent")),PlaceOrderContext_1=tslib_1.__importDefault(require("../../context/PlaceOrderContext")),isFunction_1=tslib_1.__importDefault(require("lodash/isFunction")),PaymentMethodContext_1=tslib_1.__importDefault(require("../../context/PaymentMethodContext")),OrderContext_1=tslib_1.__importDefault(require("../../context/OrderContext")),getCardDetails_1=tslib_1.__importDefault(require("../../utils/getCardDetails"));function PlaceOrderButton(props){const ref=(0,react_1.useRef)(null),{children,label="Place order",disabled,onClick,...p}=props,{isPermitted,setPlaceOrder,options,paymentType,setButtonRef}=(0,react_1.useContext)(PlaceOrderContext_1.default),[notPermitted,setNotPermitted]=(0,react_1.useState)(!0),[forceDisable,setForceDisable]=(0,react_1.useState)(disabled),{currentPaymentMethodRef,loading,currentPaymentMethodType,paymentSource,setPaymentSource,setPaymentMethodErrors}=(0,react_1.useContext)(PaymentMethodContext_1.default),{order}=(0,react_1.useContext)(OrderContext_1.default),isFree=order?.total_amount_with_taxes_cents===0;(0,react_1.useEffect)(()=>{if(loading)setNotPermitted(loading);else if(paymentType===currentPaymentMethodType&&paymentType){const card=(0,getCardDetails_1.default)({customerPayment:{payment_source:paymentSource},paymentType});(isFree&&isPermitted||currentPaymentMethodRef?.current?.onsubmit||card.brand)&&isPermitted&&setNotPermitted(!1)}else setNotPermitted(!(isFree&&isPermitted));return()=>{setNotPermitted(!0)}},[isPermitted,paymentType,currentPaymentMethodRef?.current?.onsubmit,loading,currentPaymentMethodType,order,paymentSource]),(0,react_1.useEffect)(()=>{paymentType==="paypal_payments"&&options?.paypalPayerId&&order?.status&&["draft","pending"].includes(order?.status)&&handleClick()},[options?.paypalPayerId,paymentType]),(0,react_1.useEffect)(()=>{if(order?.status!=null&&["draft","pending"].includes(order?.status))if(paymentType==="adyen_payments"&&options?.adyen?.redirectResult&&paymentSource!=null){const attributes={payment_request_details:{details:{redirectResult:options?.adyen?.redirectResult}},_details:1};setPaymentSource({paymentSourceId:paymentSource?.id,paymentResource:"adyen_payments",attributes}).then(res=>{const resultCode=res?.payment_response?.resultCode,errorCode=res?.payment_response?.errorCode,message=res?.payment_response?.message;["Authorised","Pending","Received"].includes(resultCode)?handleClick():errorCode!=null&&setPaymentMethodErrors([{code:"PAYMENT_INTENT_AUTHENTICATION_FAILURE",resource:"payment_methods",field:currentPaymentMethodType,message}])})}else(paymentType==="adyen_payments"&&options?.adyen?.MD&&options?.adyen?.PaRes||paymentType==="adyen_payments"&&order?.payment_source?.payment_response?.resultCode==="Authorised")&&handleClick()},[options?.adyen,paymentType,order?.payment_source]),(0,react_1.useEffect)(()=>{paymentType==="checkout_com_payments"&&options?.checkoutCom?.session_id&&order?.status&&["draft","pending"].includes(order?.status)&&handleClick()},[options?.checkoutCom,paymentType]),(0,react_1.useEffect)(()=>{ref?.current!=null&&setButtonRef!=null&&setButtonRef(ref)},[ref]);const handleClick=async()=>{let isValid=!0;setForceDisable(!0);const checkPaymentSource=await setPaymentSource({paymentResource:paymentType,paymentSourceId:paymentSource?.id}),card=paymentType&&(0,getCardDetails_1.default)({paymentType,customerPayment:{payment_source:checkPaymentSource}});currentPaymentMethodRef?.current?.onsubmit&&[!options?.paypalPayerId,!options?.adyen?.MD,!options?.checkoutCom?.session_id].every(Boolean)?(isValid=await currentPaymentMethodRef.current?.onsubmit(checkPaymentSource),!isValid&&checkPaymentSource.payment_response?.resultCode==="Authorised"&&(isValid=!0)):card?.brand&&(isValid=!0);const placed=isValid&&setPlaceOrder&&(checkPaymentSource||isFree)&&await setPlaceOrder({paymentSource:checkPaymentSource});setForceDisable(!1),onClick&&placed&&onClick(placed)},disabledButton=disabled!==void 0?disabled:notPermitted,parentProps={...p,label,disabled:disabledButton,handleClick,ref};return children?(0,jsx_runtime_1.jsx)(Parent_1.default,{...parentProps,children}):(0,jsx_runtime_1.jsx)("button",{ref,type:"button",disabled:disabledButton||forceDisable,onClick:()=>{handleClick()},...p,children:(0,isFunction_1.default)(label)?label():label})}exports.PlaceOrderButton=PlaceOrderButton,exports.default=PlaceOrderButton;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.AdyenPayment=void 0;const tslib_1=require("tslib"),jsx_runtime_1=require("react/jsx-runtime"),react_1=require("react"),PaymentMethodContext_1=tslib_1.__importDefault(require("../../context/PaymentMethodContext")),localStorage_1=require("../../utils/localStorage"),Parent_1=tslib_1.__importDefault(require("../utils/Parent")),browserInfo_1=tslib_1.__importStar(require("../../utils/browserInfo")),PlaceOrderContext_1=tslib_1.__importDefault(require("../../context/PlaceOrderContext")),OrderContext_1=tslib_1.__importDefault(require("../../context/OrderContext")),threeDSConfiguration={challengeWindowSize:"05"},defaultConfig={};function AdyenPayment({clientKey,config,templateCustomerSaveToWallet,environment="test",locale="en_US"}){const{cardContainerClassName,threeDSecureContainerClassName,styles}={...defaultConfig,...config},[loadAdyen,setLoadAdyen]=(0,react_1.useState)(!1),[checkout,setCheckout]=(0,react_1.useState)(null),{setPaymentSource,paymentSource,setPaymentMethodErrors,currentPaymentMethodType,setPaymentRef}=(0,react_1.useContext)(PaymentMethodContext_1.default),{order}=(0,react_1.useContext)(OrderContext_1.default),{placeOrderButtonRef}=(0,react_1.useContext)(PlaceOrderContext_1.default),ref=(0,react_1.useRef)(null),handleSubmit=async(e,component)=>{const savePaymentSourceToCustomerWallet=e?.elements?.save_payment_source_to_customer_wallet?.checked;return savePaymentSourceToCustomerWallet&&(0,localStorage_1.setCustomerOrderParam)("_save_payment_source_to_customer_wallet",savePaymentSourceToCustomerWallet),component?.submit&&component.submit(),!1},handleChange=async(state,checkout2)=>{if(state.isValid){ref.current&&(ref.current.onsubmit=async()=>await handleSubmit(ref.current,checkout2),setPaymentRef({ref}));const browserInfo=(0,browserInfo_1.default)(),attributes={payment_request_data:{payment_method:state.data.paymentMethod,shopperInteraction:"Ecommerce",recurringProcessingModel:"CardOnFile",origin:window.location.origin,return_url:window.location.href,redirect_from_issuer_method:"GET",browser_info:{acceptHeader:"text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8",...browserInfo}}};paymentSource&&await setPaymentSource({paymentSourceId:paymentSource.id,paymentResource:"adyen_payments",attributes})}},handleOnAdditionalDetails=async(state,component)=>{const attributes={payment_request_details:state.data,_details:1};try{const pSource=paymentSource&&await setPaymentSource({paymentSourceId:paymentSource.id,paymentResource:"adyen_payments",attributes}),adyenAction=pSource?.payment_response?.action,resultCode=pSource?.payment_response?.resultCode;if(adyenAction&&component)return component.handleAction(adyenAction),!1;if(["Authorised","Pending","Received"].includes(resultCode))return placeOrderButtonRef?.current!=null&&(placeOrderButtonRef.current.disabled&&(placeOrderButtonRef.current.disabled=!1),placeOrderButtonRef.current
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.AdyenPayment=void 0;const tslib_1=require("tslib"),jsx_runtime_1=require("react/jsx-runtime"),react_1=require("react"),PaymentMethodContext_1=tslib_1.__importDefault(require("../../context/PaymentMethodContext")),localStorage_1=require("../../utils/localStorage"),Parent_1=tslib_1.__importDefault(require("../utils/Parent")),browserInfo_1=tslib_1.__importStar(require("../../utils/browserInfo")),PlaceOrderContext_1=tslib_1.__importDefault(require("../../context/PlaceOrderContext")),OrderContext_1=tslib_1.__importDefault(require("../../context/OrderContext")),threeDSConfiguration={challengeWindowSize:"05"},defaultConfig={};function AdyenPayment({clientKey,config,templateCustomerSaveToWallet,environment="test",locale="en_US"}){const{cardContainerClassName,threeDSecureContainerClassName,styles}={...defaultConfig,...config},[loadAdyen,setLoadAdyen]=(0,react_1.useState)(!1),[checkout,setCheckout]=(0,react_1.useState)(null),{setPaymentSource,paymentSource,setPaymentMethodErrors,currentPaymentMethodType,setPaymentRef}=(0,react_1.useContext)(PaymentMethodContext_1.default),{order}=(0,react_1.useContext)(OrderContext_1.default),{placeOrderButtonRef}=(0,react_1.useContext)(PlaceOrderContext_1.default),ref=(0,react_1.useRef)(null),handleSubmit=async(e,component)=>{const savePaymentSourceToCustomerWallet=e?.elements?.save_payment_source_to_customer_wallet?.checked;return savePaymentSourceToCustomerWallet&&(0,localStorage_1.setCustomerOrderParam)("_save_payment_source_to_customer_wallet",savePaymentSourceToCustomerWallet),component?.submit&&component.submit(),!1},handleChange=async(state,checkout2)=>{if(state.isValid){ref.current&&(ref.current.onsubmit=async()=>await handleSubmit(ref.current,checkout2),setPaymentRef({ref}));const browserInfo=(0,browserInfo_1.default)(),attributes={payment_request_data:{payment_method:state.data.paymentMethod,shopperInteraction:"Ecommerce",recurringProcessingModel:"CardOnFile",origin:window.location.origin,return_url:window.location.href,redirect_from_issuer_method:"GET",browser_info:{acceptHeader:"text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8",...browserInfo}}};paymentSource&&await setPaymentSource({paymentSourceId:paymentSource.id,paymentResource:"adyen_payments",attributes})}},handleOnAdditionalDetails=async(state,component)=>{const attributes={payment_request_details:state.data,_details:1};try{const pSource=paymentSource&&await setPaymentSource({paymentSourceId:paymentSource.id,paymentResource:"adyen_payments",attributes}),adyenAction=pSource?.payment_response?.action,resultCode=pSource?.payment_response?.resultCode;if(adyenAction&&component)return component.handleAction(adyenAction),!1;if(["Authorised","Pending","Received"].includes(resultCode))return placeOrderButtonRef?.current!=null&&(placeOrderButtonRef.current.disabled&&(placeOrderButtonRef.current.disabled=!1),placeOrderButtonRef.current.click()),!0;if(["Cancelled","Refused"].includes(resultCode)){const message=pSource?.payment_response?.refusalReason;setPaymentMethodErrors([{code:"PAYMENT_INTENT_AUTHENTICATION_FAILURE",resource:"payment_methods",field:currentPaymentMethodType,message}]),component&&component.mount("#adyen-dropin")}return!1}catch(error){return console.error("Adyen additional details error:",error),!1}},onSubmit=async(state,component)=>{const browserInfo=(0,browserInfo_1.default)(),url=(0,browserInfo_1.cleanUrlBy)();let control=await setPaymentSource({paymentSourceId:paymentSource?.id,paymentResource:"adyen_payments"});if(control?.payment_response?.resultCode==="Authorised")return!0;const paymentDataAvailable=Object.keys(control?.payment_request_data).length>0,paymentMethodSelected=control?.payment_request_data?.payment_method?.type;(!paymentDataAvailable||paymentMethodSelected!==state.data.paymentMethod.type)&&(control=await setPaymentSource({paymentSourceId:paymentSource?.id,paymentResource:"adyen_payments",attributes:{payment_request_data:{...state.data,payment_method:state.data.paymentMethod,return_url:url,origin:window.location.origin,redirect_from_issuer_method:"GET",browser_info:{acceptHeader:"text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8",...browserInfo}}}}));const attributes={payment_request_data:{...state.data,payment_method:state.data.paymentMethod,return_url:url,origin:window.location.origin,redirect_from_issuer_method:"GET",browser_info:{acceptHeader:"text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8",...browserInfo}},_authorize:1};delete attributes.payment_request_data.paymentMethod;try{const res=await setPaymentSource({paymentSourceId:paymentSource?.id,paymentResource:"adyen_payments",attributes}),action=res?.payment_response?.action;if(component&&action)return component.handleAction(action),!1;const resultCode=res?.payment_response?.resultCode;if(["Authorised","Pending","Received"].includes(resultCode))return placeOrderButtonRef?.current!=null&&(placeOrderButtonRef.current.disabled&&(placeOrderButtonRef.current.disabled=!1),placeOrderButtonRef.current.click()),!0;if(["Cancelled"].includes(resultCode)){const message=res?.payment_response?.refusalReason;setPaymentMethodErrors([{code:"PAYMENT_INTENT_AUTHENTICATION_FAILURE",resource:"payment_methods",field:currentPaymentMethodType,message}])}if(res?.payment_response?.errorType)if(res?.payment_response?.errorCode==="14_006")onSubmit(state,component);else{const message=res?.payment_response?.message;setPaymentMethodErrors([{code:"PAYMENT_INTENT_AUTHENTICATION_FAILURE",resource:"payment_methods",field:currentPaymentMethodType,message}])}return!1}catch(error){return setPaymentMethodErrors([{code:"PAYMENT_INTENT_AUTHENTICATION_FAILURE",resource:"payment_methods",field:currentPaymentMethodType,message:error.message}]),!1}};return(0,react_1.useEffect)(()=>{const paymentMethodsResponse=paymentSource?.payment_methods?.paymentMethods?paymentSource?.payment_methods.paymentMethods:[],[firstPaymentMethod]=paymentMethodsResponse,isOnlyCard=paymentMethodsResponse?.length===1&&firstPaymentMethod.type==="scheme";paymentMethodsResponse.length===0&&console.error("Payment methods are not available. Please, check your Adyen configuration.");const options={locale,environment,clientKey,amount:{currency:order?.currency_code||"",value:order?.total_amount_with_taxes_cents||0},countryCode:order?.country_code||"",paymentMethodsResponse:{paymentMethods:paymentMethodsResponse},showPayButton:!1,paymentMethodsConfiguration:{threeDS2:threeDSConfiguration,paypal:{showPayButton:!0,style:styles?.paypal},card:{styles:styles?.card,holderNameRequired:!1}},onAdditionalDetails:handleOnAdditionalDetails,onChange:handleChange,onSubmit};return!ref&&clientKey&&(0,localStorage_1.setCustomerOrderParam)("_save_payment_source_to_customer_wallet","false"),clientKey&&!loadAdyen&&window&&!checkout&&Promise.resolve().then(()=>tslib_1.__importStar(require("@adyen/adyen-web"))).then(({default:AdyenCheckout})=>{const type=isOnlyCard?"card":"dropin";AdyenCheckout(options).then(adyenCheckout=>{const component=adyenCheckout.create(type,{onSelect:component2=>{const id=component2._id;id.search("scheme")===-1&&ref.current&&(id.search("paypal")===-1?ref.current.onsubmit=async()=>await handleSubmit(ref.current,component2):ref.current.onsubmit=null,setPaymentRef({ref}))}}).mount("#adyen-dropin");component&&(setCheckout(component),setLoadAdyen(!0))})}),()=>{setPaymentRef({ref:{current:null}}),setLoadAdyen(!1)}},[clientKey,ref]),!clientKey&&!loadAdyen&&!checkout?null:(0,jsx_runtime_1.jsxs)("form",{ref,onSubmit:e=>{handleSubmit(e,checkout)},children:[(0,jsx_runtime_1.jsx)("div",{className:cardContainerClassName,id:"adyen-dropin"}),templateCustomerSaveToWallet&&(0,jsx_runtime_1.jsx)(Parent_1.default,{name:"save_payment_source_to_customer_wallet",children:templateCustomerSaveToWallet}),(0,jsx_runtime_1.jsx)("div",{className:threeDSecureContainerClassName,id:"adyen-action"})]})}exports.AdyenPayment=AdyenPayment,exports.default=AdyenPayment;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.PaymentSourceBrandName=void 0;const tslib_1=require("tslib"),jsx_runtime_1=require("react/jsx-runtime"),PaymentSourceContext_1=tslib_1.__importDefault(require("../../context/PaymentSourceContext")),lodash_1=require("lodash"),react_1=require("react"),Parent_1=tslib_1.__importDefault(require("../utils/Parent"));function PaymentSourceBrandName({children,label,...props}){const{brand}=(0,react_1.useContext)(PaymentSourceContext_1.default),brandName=brand&&(0,lodash_1.capitalize)(brand.
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.PaymentSourceBrandName=void 0;const tslib_1=require("tslib"),jsx_runtime_1=require("react/jsx-runtime"),PaymentSourceContext_1=tslib_1.__importDefault(require("../../context/PaymentSourceContext")),lodash_1=require("lodash"),react_1=require("react"),Parent_1=tslib_1.__importDefault(require("../utils/Parent"));function PaymentSourceBrandName({children,label,...props}){const{brand}=(0,react_1.useContext)(PaymentSourceContext_1.default),brandName=brand&&(0,lodash_1.capitalize)(brand.replaceAll(/_|-/gm," ")),parentProps={brand:brandName,label,...props};return children?(0,jsx_runtime_1.jsx)(Parent_1.default,{...parentProps,children}):(0,jsx_runtime_1.jsx)("span",{...props,children:label||(0,lodash_1.capitalize)(brandName)})}exports.PaymentSourceBrandName=PaymentSourceBrandName,exports.default=PaymentSourceBrandName;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as _jsx}from"react/jsx-runtime";import{useContext,useEffect,useRef,useState}from"react";import Parent from"../utils/Parent";import PlaceOrderContext from"../../context/PlaceOrderContext";import isFunction from"lodash/isFunction";import PaymentMethodContext from"../../context/PaymentMethodContext";import OrderContext from"../../context/OrderContext";import getCardDetails from"../../utils/getCardDetails";export function PlaceOrderButton(props){const ref=useRef(null),{children,label="Place order",disabled,onClick,...p}=props,{isPermitted,setPlaceOrder,options,paymentType,setButtonRef}=useContext(PlaceOrderContext),[notPermitted,setNotPermitted]=useState(!0),[forceDisable,setForceDisable]=useState(disabled),{currentPaymentMethodRef,loading,currentPaymentMethodType,paymentSource,setPaymentSource,setPaymentMethodErrors}=useContext(PaymentMethodContext),{order}=useContext(OrderContext),isFree=order?.total_amount_with_taxes_cents===0;useEffect(()=>{if(loading)setNotPermitted(loading);else if(paymentType===currentPaymentMethodType&&paymentType){const card=getCardDetails({customerPayment:{payment_source:paymentSource},paymentType});(isFree&&isPermitted||currentPaymentMethodRef?.current?.onsubmit||card.brand)&&isPermitted&&setNotPermitted(!1)}else setNotPermitted(!(isFree&&isPermitted));return()=>{setNotPermitted(!0)}},[isPermitted,paymentType,currentPaymentMethodRef?.current?.onsubmit,loading,currentPaymentMethodType,order,paymentSource]),useEffect(()=>{paymentType==="paypal_payments"&&options?.paypalPayerId&&order?.status&&["draft","pending"].includes(order?.status)&&handleClick()},[options?.paypalPayerId,paymentType]),useEffect(()=>{if(
|
|
1
|
+
import{jsx as _jsx}from"react/jsx-runtime";import{useContext,useEffect,useRef,useState}from"react";import Parent from"../utils/Parent";import PlaceOrderContext from"../../context/PlaceOrderContext";import isFunction from"lodash/isFunction";import PaymentMethodContext from"../../context/PaymentMethodContext";import OrderContext from"../../context/OrderContext";import getCardDetails from"../../utils/getCardDetails";export function PlaceOrderButton(props){const ref=useRef(null),{children,label="Place order",disabled,onClick,...p}=props,{isPermitted,setPlaceOrder,options,paymentType,setButtonRef}=useContext(PlaceOrderContext),[notPermitted,setNotPermitted]=useState(!0),[forceDisable,setForceDisable]=useState(disabled),{currentPaymentMethodRef,loading,currentPaymentMethodType,paymentSource,setPaymentSource,setPaymentMethodErrors}=useContext(PaymentMethodContext),{order}=useContext(OrderContext),isFree=order?.total_amount_with_taxes_cents===0;useEffect(()=>{if(loading)setNotPermitted(loading);else if(paymentType===currentPaymentMethodType&&paymentType){const card=getCardDetails({customerPayment:{payment_source:paymentSource},paymentType});(isFree&&isPermitted||currentPaymentMethodRef?.current?.onsubmit||card.brand)&&isPermitted&&setNotPermitted(!1)}else setNotPermitted(!(isFree&&isPermitted));return()=>{setNotPermitted(!0)}},[isPermitted,paymentType,currentPaymentMethodRef?.current?.onsubmit,loading,currentPaymentMethodType,order,paymentSource]),useEffect(()=>{paymentType==="paypal_payments"&&options?.paypalPayerId&&order?.status&&["draft","pending"].includes(order?.status)&&handleClick()},[options?.paypalPayerId,paymentType]),useEffect(()=>{if(order?.status!=null&&["draft","pending"].includes(order?.status))if(paymentType==="adyen_payments"&&options?.adyen?.redirectResult&&paymentSource!=null){const attributes={payment_request_details:{details:{redirectResult:options?.adyen?.redirectResult}},_details:1};setPaymentSource({paymentSourceId:paymentSource?.id,paymentResource:"adyen_payments",attributes}).then(res=>{const resultCode=res?.payment_response?.resultCode,errorCode=res?.payment_response?.errorCode,message=res?.payment_response?.message;["Authorised","Pending","Received"].includes(resultCode)?handleClick():errorCode!=null&&setPaymentMethodErrors([{code:"PAYMENT_INTENT_AUTHENTICATION_FAILURE",resource:"payment_methods",field:currentPaymentMethodType,message}])})}else(paymentType==="adyen_payments"&&options?.adyen?.MD&&options?.adyen?.PaRes||paymentType==="adyen_payments"&&order?.payment_source?.payment_response?.resultCode==="Authorised")&&handleClick()},[options?.adyen,paymentType,order?.payment_source]),useEffect(()=>{paymentType==="checkout_com_payments"&&options?.checkoutCom?.session_id&&order?.status&&["draft","pending"].includes(order?.status)&&handleClick()},[options?.checkoutCom,paymentType]),useEffect(()=>{ref?.current!=null&&setButtonRef!=null&&setButtonRef(ref)},[ref]);const handleClick=async()=>{let isValid=!0;setForceDisable(!0);const checkPaymentSource=await setPaymentSource({paymentResource:paymentType,paymentSourceId:paymentSource?.id}),card=paymentType&&getCardDetails({paymentType,customerPayment:{payment_source:checkPaymentSource}});currentPaymentMethodRef?.current?.onsubmit&&[!options?.paypalPayerId,!options?.adyen?.MD,!options?.checkoutCom?.session_id].every(Boolean)?(isValid=await currentPaymentMethodRef.current?.onsubmit(checkPaymentSource),!isValid&&checkPaymentSource.payment_response?.resultCode==="Authorised"&&(isValid=!0)):card?.brand&&(isValid=!0);const placed=isValid&&setPlaceOrder&&(checkPaymentSource||isFree)&&await setPlaceOrder({paymentSource:checkPaymentSource});setForceDisable(!1),onClick&&placed&&onClick(placed)},disabledButton=disabled!==void 0?disabled:notPermitted,parentProps={...p,label,disabled:disabledButton,handleClick,ref};return children?_jsx(Parent,{...parentProps,children}):_jsx("button",{ref,type:"button",disabled:disabledButton||forceDisable,onClick:()=>{handleClick()},...p,children:isFunction(label)?label():label})}export default PlaceOrderButton;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";import{useContext,useEffect,useRef,useState}from"react";import PaymentMethodContext from"../../context/PaymentMethodContext";import{setCustomerOrderParam}from"../../utils/localStorage";import Parent from"../utils/Parent";import getBrowserInfo,{cleanUrlBy}from"../../utils/browserInfo";import PlaceOrderContext from"../../context/PlaceOrderContext";import OrderContext from"../../context/OrderContext";const threeDSConfiguration={challengeWindowSize:"05"},defaultConfig={};export function AdyenPayment({clientKey,config,templateCustomerSaveToWallet,environment="test",locale="en_US"}){const{cardContainerClassName,threeDSecureContainerClassName,styles}={...defaultConfig,...config},[loadAdyen,setLoadAdyen]=useState(!1),[checkout,setCheckout]=useState(null),{setPaymentSource,paymentSource,setPaymentMethodErrors,currentPaymentMethodType,setPaymentRef}=useContext(PaymentMethodContext),{order}=useContext(OrderContext),{placeOrderButtonRef}=useContext(PlaceOrderContext),ref=useRef(null),handleSubmit=async(e,component)=>{const savePaymentSourceToCustomerWallet=e?.elements?.save_payment_source_to_customer_wallet?.checked;return savePaymentSourceToCustomerWallet&&setCustomerOrderParam("_save_payment_source_to_customer_wallet",savePaymentSourceToCustomerWallet),component?.submit&&component.submit(),!1},handleChange=async(state,checkout2)=>{if(state.isValid){ref.current&&(ref.current.onsubmit=async()=>await handleSubmit(ref.current,checkout2),setPaymentRef({ref}));const browserInfo=getBrowserInfo(),attributes={payment_request_data:{payment_method:state.data.paymentMethod,shopperInteraction:"Ecommerce",recurringProcessingModel:"CardOnFile",origin:window.location.origin,return_url:window.location.href,redirect_from_issuer_method:"GET",browser_info:{acceptHeader:"text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8",...browserInfo}}};paymentSource&&await setPaymentSource({paymentSourceId:paymentSource.id,paymentResource:"adyen_payments",attributes})}},handleOnAdditionalDetails=async(state,component)=>{const attributes={payment_request_details:state.data,_details:1};try{const pSource=paymentSource&&await setPaymentSource({paymentSourceId:paymentSource.id,paymentResource:"adyen_payments",attributes}),adyenAction=pSource?.payment_response?.action,resultCode=pSource?.payment_response?.resultCode;if(adyenAction&&component)return component.handleAction(adyenAction),!1;if(["Authorised","Pending","Received"].includes(resultCode))return placeOrderButtonRef?.current!=null&&(placeOrderButtonRef.current.disabled&&(placeOrderButtonRef.current.disabled=!1),placeOrderButtonRef.current
|
|
1
|
+
import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";import{useContext,useEffect,useRef,useState}from"react";import PaymentMethodContext from"../../context/PaymentMethodContext";import{setCustomerOrderParam}from"../../utils/localStorage";import Parent from"../utils/Parent";import getBrowserInfo,{cleanUrlBy}from"../../utils/browserInfo";import PlaceOrderContext from"../../context/PlaceOrderContext";import OrderContext from"../../context/OrderContext";const threeDSConfiguration={challengeWindowSize:"05"},defaultConfig={};export function AdyenPayment({clientKey,config,templateCustomerSaveToWallet,environment="test",locale="en_US"}){const{cardContainerClassName,threeDSecureContainerClassName,styles}={...defaultConfig,...config},[loadAdyen,setLoadAdyen]=useState(!1),[checkout,setCheckout]=useState(null),{setPaymentSource,paymentSource,setPaymentMethodErrors,currentPaymentMethodType,setPaymentRef}=useContext(PaymentMethodContext),{order}=useContext(OrderContext),{placeOrderButtonRef}=useContext(PlaceOrderContext),ref=useRef(null),handleSubmit=async(e,component)=>{const savePaymentSourceToCustomerWallet=e?.elements?.save_payment_source_to_customer_wallet?.checked;return savePaymentSourceToCustomerWallet&&setCustomerOrderParam("_save_payment_source_to_customer_wallet",savePaymentSourceToCustomerWallet),component?.submit&&component.submit(),!1},handleChange=async(state,checkout2)=>{if(state.isValid){ref.current&&(ref.current.onsubmit=async()=>await handleSubmit(ref.current,checkout2),setPaymentRef({ref}));const browserInfo=getBrowserInfo(),attributes={payment_request_data:{payment_method:state.data.paymentMethod,shopperInteraction:"Ecommerce",recurringProcessingModel:"CardOnFile",origin:window.location.origin,return_url:window.location.href,redirect_from_issuer_method:"GET",browser_info:{acceptHeader:"text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8",...browserInfo}}};paymentSource&&await setPaymentSource({paymentSourceId:paymentSource.id,paymentResource:"adyen_payments",attributes})}},handleOnAdditionalDetails=async(state,component)=>{const attributes={payment_request_details:state.data,_details:1};try{const pSource=paymentSource&&await setPaymentSource({paymentSourceId:paymentSource.id,paymentResource:"adyen_payments",attributes}),adyenAction=pSource?.payment_response?.action,resultCode=pSource?.payment_response?.resultCode;if(adyenAction&&component)return component.handleAction(adyenAction),!1;if(["Authorised","Pending","Received"].includes(resultCode))return placeOrderButtonRef?.current!=null&&(placeOrderButtonRef.current.disabled&&(placeOrderButtonRef.current.disabled=!1),placeOrderButtonRef.current.click()),!0;if(["Cancelled","Refused"].includes(resultCode)){const message=pSource?.payment_response?.refusalReason;setPaymentMethodErrors([{code:"PAYMENT_INTENT_AUTHENTICATION_FAILURE",resource:"payment_methods",field:currentPaymentMethodType,message}]),component&&component.mount("#adyen-dropin")}return!1}catch(error){return console.error("Adyen additional details error:",error),!1}},onSubmit=async(state,component)=>{const browserInfo=getBrowserInfo(),url=cleanUrlBy();let control=await setPaymentSource({paymentSourceId:paymentSource?.id,paymentResource:"adyen_payments"});if(control?.payment_response?.resultCode==="Authorised")return!0;const paymentDataAvailable=Object.keys(control?.payment_request_data).length>0,paymentMethodSelected=control?.payment_request_data?.payment_method?.type;(!paymentDataAvailable||paymentMethodSelected!==state.data.paymentMethod.type)&&(control=await setPaymentSource({paymentSourceId:paymentSource?.id,paymentResource:"adyen_payments",attributes:{payment_request_data:{...state.data,payment_method:state.data.paymentMethod,return_url:url,origin:window.location.origin,redirect_from_issuer_method:"GET",browser_info:{acceptHeader:"text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8",...browserInfo}}}}));const attributes={payment_request_data:{...state.data,payment_method:state.data.paymentMethod,return_url:url,origin:window.location.origin,redirect_from_issuer_method:"GET",browser_info:{acceptHeader:"text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8",...browserInfo}},_authorize:1};delete attributes.payment_request_data.paymentMethod;try{const res=await setPaymentSource({paymentSourceId:paymentSource?.id,paymentResource:"adyen_payments",attributes}),action=res?.payment_response?.action;if(component&&action)return component.handleAction(action),!1;const resultCode=res?.payment_response?.resultCode;if(["Authorised","Pending","Received"].includes(resultCode))return placeOrderButtonRef?.current!=null&&(placeOrderButtonRef.current.disabled&&(placeOrderButtonRef.current.disabled=!1),placeOrderButtonRef.current.click()),!0;if(["Cancelled"].includes(resultCode)){const message=res?.payment_response?.refusalReason;setPaymentMethodErrors([{code:"PAYMENT_INTENT_AUTHENTICATION_FAILURE",resource:"payment_methods",field:currentPaymentMethodType,message}])}if(res?.payment_response?.errorType)if(res?.payment_response?.errorCode==="14_006")onSubmit(state,component);else{const message=res?.payment_response?.message;setPaymentMethodErrors([{code:"PAYMENT_INTENT_AUTHENTICATION_FAILURE",resource:"payment_methods",field:currentPaymentMethodType,message}])}return!1}catch(error){return setPaymentMethodErrors([{code:"PAYMENT_INTENT_AUTHENTICATION_FAILURE",resource:"payment_methods",field:currentPaymentMethodType,message:error.message}]),!1}};return useEffect(()=>{const paymentMethodsResponse=paymentSource?.payment_methods?.paymentMethods?paymentSource?.payment_methods.paymentMethods:[],[firstPaymentMethod]=paymentMethodsResponse,isOnlyCard=paymentMethodsResponse?.length===1&&firstPaymentMethod.type==="scheme";paymentMethodsResponse.length===0&&console.error("Payment methods are not available. Please, check your Adyen configuration.");const options={locale,environment,clientKey,amount:{currency:order?.currency_code||"",value:order?.total_amount_with_taxes_cents||0},countryCode:order?.country_code||"",paymentMethodsResponse:{paymentMethods:paymentMethodsResponse},showPayButton:!1,paymentMethodsConfiguration:{threeDS2:threeDSConfiguration,paypal:{showPayButton:!0,style:styles?.paypal},card:{styles:styles?.card,holderNameRequired:!1}},onAdditionalDetails:handleOnAdditionalDetails,onChange:handleChange,onSubmit};return!ref&&clientKey&&setCustomerOrderParam("_save_payment_source_to_customer_wallet","false"),clientKey&&!loadAdyen&&window&&!checkout&&import("@adyen/adyen-web").then(({default:AdyenCheckout})=>{const type=isOnlyCard?"card":"dropin";AdyenCheckout(options).then(adyenCheckout=>{const component=adyenCheckout.create(type,{onSelect:component2=>{const id=component2._id;id.search("scheme")===-1&&ref.current&&(id.search("paypal")===-1?ref.current.onsubmit=async()=>await handleSubmit(ref.current,component2):ref.current.onsubmit=null,setPaymentRef({ref}))}}).mount("#adyen-dropin");component&&(setCheckout(component),setLoadAdyen(!0))})}),()=>{setPaymentRef({ref:{current:null}}),setLoadAdyen(!1)}},[clientKey,ref]),!clientKey&&!loadAdyen&&!checkout?null:_jsxs("form",{ref,onSubmit:e=>{handleSubmit(e,checkout)},children:[_jsx("div",{className:cardContainerClassName,id:"adyen-dropin"}),templateCustomerSaveToWallet&&_jsx(Parent,{name:"save_payment_source_to_customer_wallet",children:templateCustomerSaveToWallet}),_jsx("div",{className:threeDSecureContainerClassName,id:"adyen-action"})]})}export default AdyenPayment;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as _jsx}from"react/jsx-runtime";import PaymentSourceContext from"../../context/PaymentSourceContext";import{capitalize}from"lodash";import{useContext}from"react";import Parent from"../utils/Parent";export function PaymentSourceBrandName({children,label,...props}){const{brand}=useContext(PaymentSourceContext),brandName=brand&&capitalize(brand.
|
|
1
|
+
import{jsx as _jsx}from"react/jsx-runtime";import PaymentSourceContext from"../../context/PaymentSourceContext";import{capitalize}from"lodash";import{useContext}from"react";import Parent from"../utils/Parent";export function PaymentSourceBrandName({children,label,...props}){const{brand}=useContext(PaymentSourceContext),brandName=brand&&capitalize(brand.replaceAll(/_|-/gm," ")),parentProps={brand:brandName,label,...props};return children?_jsx(Parent,{...parentProps,children}):_jsx("span",{...props,children:label||capitalize(brandName)})}export default PaymentSourceBrandName;
|