@adyen/adyen-web/dist/es/components/internal/UIElement/UIElement.js

[](https://www.npmjs.com/package/@adyen/adyen-web)

import{createElement as e,createRef as t}from"../../../external/preact/dist/preact.js";import s,{NETWORK_ERROR as i}from"../../../core/Errors/AdyenCheckoutError.js";import{hasOwnProperty as n}from"../../../utils/hasOwnProperty.js";import o from"../BaseElement/BaseElement.js";import r from"../PayButton/PayButton.js";import{assertIsDropin as a,getRegulatoryDefaults as h,sanitizeResponse as d,verifyPaymentDidNotFail as l,cleanupFinalResult as m}from"./utils.js";import{AnalyticsErrorEvent as p,ErrorEventType as c}from"../../../core/Analytics/events/AnalyticsErrorEvent.js";import{AnalyticsInfoEvent as u,InfoEventType as y}from"../../../core/Analytics/events/AnalyticsInfoEvent.js";import{AnalyticsLogEvent as f,LogEventType as R}from"../../../core/Analytics/events/AnalyticsLogEvent.js";import b from"../../../core/Errors/CancelError.js";import{CoreProvider as P}from"../../../core/Context/CoreProvider.js";import A from"../../../core/Errors/SRPanelProvider.js";import{AmountProvider as E}from"../../../core/Context/AmountProvider.js";function g(e,t,s){return t in e?Object.defineProperty(e,t,{value:s,enumerable:!0,configurable:!0,writable:!0}):e[t]=s,e}class v extends o{createBeforeRenderHook(e){const t=this.render;this.render=(...s)=>(this.beforeRender(e),t.apply(this,s))}beforeRender(e){if(e?.originalAction)return;const t=new u({type:y.rendered,component:this.type,configData:{...e,showPayButton:this.props.showPayButton},...e?.oneClick&&{isStoredPaymentMethod:!0}});this.analytics.sendAnalytics(t)}reportIntegrationFlavor(){this.analytics.sendFlavor("components")}get analytics(){return this.core.modules.analytics}get srPanel(){return this.core.modules.srPanel}getPaymentMethodConfigFromResponse(e){return e?.storedPaymentMethodId?this.getStoredPaymentMethodDetails(e.storedPaymentMethodId):this.getPaymentMethodFromPaymentMethodsResponse(e?.type,e?.paymentMethodId)}buildElementProps(e){const t={showPayButton:!0,...this.core.getCorePropsForComponent(),...this.getPaymentMethodConfigFromResponse(e),...e},s=a(this);this.props=this.formatProps({...this.constructor.defaultProps,...h(this.core.options.countryCode,s),...t})}getStoredPaymentMethodDetails(e){return this.core.paymentMethodsResponse.findStoredPaymentMethod(e)}getPaymentMethodFromPaymentMethodsResponse(e,t){return t?this.core.paymentMethodsResponse.findById(t):this.core.paymentMethodsResponse?.find(e||this.constructor.type)}storeElementRefOnCore(e){e?.isDropin||this.core.storeElementReference(this)}isAvailable(){return Promise.resolve()}setState(e){this.state={...this.state,...e},this.onChange()}showValidation(){return this.componentRef&&this.componentRef.showValidation&&this.componentRef.showValidation(),this}updateAmount(e,t){this.props={...this.props,...e&&{amount:e},...t&&{secondaryAmount:t}},this.amountProviderRef.current?.update(e,t)}setElementStatus(e,t){return this.elementRef?.setStatus(e,t),this}setStatus(e,t){return this.componentRef?.setStatus&&this.componentRef.setStatus(e,t),this}onChange(){this.props.onChange?.({data:this.data,isValid:this.isValid,errors:this.state.errors,valid:this.state.valid},this.elementRef)}submitAnalytics(e){this.analytics.sendAnalytics(e)}submit(){this.isValid?this.makePaymentsCall().then(d).then(l).then(this.handleResponse).catch(e=>{e instanceof b?this.setElementStatus("ready"):this.handleFailedResult(e)}):this.showValidation()}makePaymentsCall(){if(this.setElementStatus("loading"),this.props.onSubmit)return this.submitUsingAdvancedFlow();if(this.core.session){return(this.props.beforeSubmit?new Promise((e,t)=>{this.props.beforeSubmit(this.data,this.elementRef,{resolve:e,reject:()=>t(new b("beforeSubmitRejected"))})}):Promise.resolve(this.data)).then(this.submitUsingSessionsFlow)}this.handleError(new s("IMPLEMENTATION_ERROR",'It can not perform /payments call. Callback "onSubmit" is missing or Checkout session is not available'))}async submitUsingAdvancedFlow(){const e=new f({component:this.type,type:R.submit,message:"Shopper clicked pay"});return this.submitAnalytics(e),new Promise((e,t)=>{this.props.onSubmit({data:this.data,isValid:this.isValid},this.elementRef,{resolve:e,reject:t})})}async submitUsingSessionsFlow(e){const t=new f({component:this.type,type:R.submit,message:"Shopper clicked pay"});this.submitAnalytics(t);try{return await this.core.session.submitPayment(e)}catch(e){return e instanceof s?this.handleError(e):this.handleError(new s("ERROR","Error when making /payments call",{cause:e})),Promise.reject(e)}}onComplete(e){this.handleAdditionalDetails(e)}handleAdditionalDetails(e){this.makeAdditionalDetailsCall(e).then(d).then(l).then(this.handleResponse).catch(this.handleFailedResult)}makeAdditionalDetailsCall(e){return this.props.onAdditionalDetails?new Promise((t,s)=>{this.props.onAdditionalDetails(e,this.elementRef,{resolve:t,reject:s})}):this.core.session?this.submitAdditionalDetailsUsingSessionsFlow(e.data):void this.handleError(new s("IMPLEMENTATION_ERROR",'It can not perform /payments/details call. Callback "onAdditionalDetails" is missing or Checkout session is not available'))}async submitAdditionalDetailsUsingSessionsFlow(e){try{return await this.core.session.submitDetails(e)}catch(e){return e instanceof s?this.handleError(e):this.handleError(new s("ERROR","Error when making /details call",{cause:e})),Promise.reject(e)}}handleAction(e,t={}){if(!e||!e.type){if(n(e,"action")&&n(e,"resultCode"))throw new Error('handleAction::Invalid Action - the passed action object itself has an "action" property and a "resultCode": have you passed in the whole response object by mistake?');throw new Error('handleAction::Invalid Action - the passed action object does not have a "type" property')}const s=this.core.createFromAction(e,{...this.elementRef.props,...t});return s?(this.unmount(),s.mount(this._node)):null}onActionHandled(e){this.props?.onActionHandled?.({originalAction:this.props.originalAction,...e})}handleResponse(e){e.action?this.elementRef.handleAction(e.action):e.order?.remainingAmount?.value>0?this.handleOrder(e):this.handleSuccessResult(e)}handleKeyPress(e){"Enter"!==e.key&&"Enter"!==e.code||(e.preventDefault(),this.onEnterKeyPressed(document?.activeElement,this))}onEnterKeyPressed(e,t){this.props.onEnterKeyPressed?this.props.onEnterKeyPressed(e,t):(e.blur(),this.submit())}updateParent(e={}){return this.elementRef.core.update(e)}get isValid(){return!1}get icon(){const e=this.props.paymentMethodType||this.type;return this.props.icon??this.resources.getImage()(e)}get displayName(){const e=this.core.paymentMethodsResponse?.paymentMethods?.find(e=>e.type===this.type);return this.props.name||e?.name||this.type}get accessibleName(){return this.displayName}get additionalInfo(){return null}get type(){return this.props.type||this.constructor.type}async handleAdvanceFlowPaymentMethodsUpdate(e,t){return new Promise((t,s)=>{if(!this.props.onPaymentMethodsRequest)return t();this.props.onPaymentMethodsRequest({...e&&{order:{orderData:e.orderData,pspReference:e.pspReference}},locale:this.core.options.locale},{resolve:t,reject:s})}).catch(e=>{this.handleError(new s("IMPLEMENTATION_ERROR","Something failed during payment methods update or onPaymentMethodsRequest was not implemented",{cause:e}))}).then(s=>this.core.update({...s&&{paymentMethodsResponse:s},order:e,amount:e?e.remainingAmount:t}))}render(){return e(P,{i18n:this.props.i18n,loadingContext:this.props.loadingContext,resources:this.resources,analytics:this.analytics},e(A,{srPanel:this.srPanel},e(E,{amount:this.props.amount,secondaryAmount:this.props.secondaryAmount,providerRef:this.amountProviderRef},this.componentToRender())))}constructor(s,n){super(s,n),g(this,"componentRef",void 0),g(this,"resources",void 0),g(this,"elementRef",void 0),g(this,"amountProviderRef",t()),g(this,"handleError",e=>{if(this.setElementStatus("ready"),e.name===i&&e.options.code){const t=new p({component:this.type,errorType:c.apiError,code:e.options.code});this.submitAnalytics(t)}this.props.onError&&this.props.onError(e,this.elementRef)}),g(this,"handleOrder",e=>{const{order:t}=e;(this.core.session?this.core.update({order:t}):this.handleAdvanceFlowPaymentMethodsUpdate(t)).then(()=>{this.props.onOrderUpdated?.({order:t})})}),g(this,"handleFailedResult",e=>{a(this.elementRef)&&this.elementRef.displayFinalAnimation("error"),m(e),this.props.onPaymentFailed?.(e,this.elementRef)}),g(this,"handleSuccessResult",e=>{a(this.elementRef)&&this.elementRef.displayFinalAnimation("success"),m(e),this.props.onPaymentCompleted?.(e,this.elementRef)}),g(this,"setComponentRef",e=>{this.componentRef=e}),g(this,"payButton",t=>e(r,{...t,onClick:this.submit})),this.core.register(this.constructor),this.submit=this.submit.bind(this),this.setState=this.setState.bind(this),this.onComplete=this.onComplete.bind(this),this.handleAction=this.handleAction.bind(this),this.handleOrder=this.handleOrder.bind(this),this.handleAdditionalDetails=this.handleAdditionalDetails.bind(this),this.handleResponse=this.handleResponse.bind(this),this.setElementStatus=this.setElementStatus.bind(this),this.submitAnalytics=this.submitAnalytics.bind(this),this.makePaymentsCall=this.makePaymentsCall.bind(this),this.makeAdditionalDetailsCall=this.makeAdditionalDetailsCall.bind(this),this.submitUsingSessionsFlow=this.submitUsingSessionsFlow.bind(this),this.updateAmount=this.updateAmount.bind(this),this.elementRef=n&&n.elementRef||this,this.resources=this.props.modules?this.props.modules.resources:void 0,this.storeElementRefOnCore(this.props),this.onEnterKeyPressed=this.onEnterKeyPressed.bind(this),this.onActionHandled=this.onActionHandled.bind(this),this.createBeforeRenderHook(n),this.reportIntegrationFlavor()}}g(v,"type",void 0),g(v,"txVariants",[]);export{v as UIElement,v as default};
//# sourceMappingURL=UIElement.js.map