@adyen/adyen-web/dist/es/components/Card/Card.js

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

import{createElement as t}from"../../external/preact/dist/preact.js";import e from"./components/CardInput/CardInput.js";import o from"../../utils/browserInfo.js";import s from"../internal/SecuredFields/binLookup/triggerBinLookUp.js";import{fieldTypeToSnakeCase as n,isSecuredField as i}from"../internal/SecuredFields/utils.js";import{reject as r}from"../../utils/commonUtils.js";import{shouldIncludeInstallmentsInPaymentData as a}from"./components/CardInput/utils.js";import p from"../internal/ClickToPay/services/create-clicktopay-service.js";import c from"./components/ClickToPayWrapper.js";import{TxVariants as u}from"../tx-variants.js";import{UIElement as d}from"../internal/UIElement/UIElement.js";import l from"../internal/PayButton/PayButton.js";import h,{IMPLEMENTATION_ERROR as m}from"../../core/Errors/AdyenCheckoutError.js";import y from"./components/CardInput/defaultProps.js";import{AnalyticsInfoEvent as f,InfoEventType as g}from"../../core/Analytics/events/AnalyticsInfoEvent.js";function b(t,e,o){return e in t?Object.defineProperty(t,e,{value:o,enumerable:!0,configurable:!0,writable:!0}):t[e]=o,t}class P extends d{setStatus(t,e){return this.componentRef?.setStatus&&this.componentRef.setStatus(t,e),this.clickToPayRef?.setStatus&&this.clickToPayRef.setStatus(t,e),this}getPaymentMethodConfigFromResponse(t){return t?.fundingSource?this.core.paymentMethodsResponse?.findByFundingSource(t.type,t.fundingSource):super.getPaymentMethodConfigFromResponse(t)}formatProps(t){const e=t.session?.configuration?.enableStoreDetails??t.enableStoreDetails,o=!(0===t.amount?.value)&&e,s=t.storedPaymentMethodId||t.id,n=s&&t?.supportedShopperInteractions?.includes("Ecommerce");if(s&&!n)throw new h(m,"You are trying to create a storedCard from a stored PM that does not support Ecommerce interactions");return{...t,holderNameRequired:!!t.hasHolderName&&t.holderNameRequired,hasCVC:!(t.brand&&"bcmc"===t.brand||t.hideCVC),billingAddressRequired:!t.storedPaymentMethodId&&t.billingAddressRequired,billingAddressMode:t.onAddressLookup?y.billingAddressMode:t.billingAddressMode,brand:t.brand??u.card,countryCode:t.countryCode?t.countryCode.toLowerCase():null,configuration:{...t.configuration,socialSecurityNumberMode:t.configuration?.socialSecurityNumberMode??"auto"},brandsConfiguration:t.brandsConfiguration||t.configuration?.brandsConfiguration||{},icon:t.icon||t.configuration?.icon,installmentOptions:t.session?.configuration?.installmentOptions||t.installmentOptions,enableStoreDetails:e,showStoreDetailsCheckbox:o,clickToPayConfiguration:{...t.clickToPayConfiguration,disableOtpAutoFocus:t.clickToPayConfiguration?.disableOtpAutoFocus||!1,shopperEmail:t.clickToPayConfiguration?.shopperEmail||this.core.options?.session?.shopperEmail,telephoneNumber:t.clickToPayConfiguration?.telephoneNumber||this.core.options?.session?.telephoneNumber,locale:t.clickToPayConfiguration?.locale||t.i18n?.locale?.replace("-","_")},...s&&{storedPaymentMethodId:s}}}formatData(){const t=this.state.selectedBrandValue;return{paymentMethod:{type:P.type,...this.state.data,...this.props.storedPaymentMethodId&&{storedPaymentMethodId:this.props.storedPaymentMethodId,holderName:this.props.holderName??""},...t&&{brand:t},...this.props.fundingSource&&{fundingSource:this.props.fundingSource},...this.state.fastlaneData&&{fastlaneData:btoa(JSON.stringify(this.state.fastlaneData))}},...this.state.billingAddress&&{billingAddress:this.state.billingAddress},...this.state.socialSecurityNumber&&{socialSecurityNumber:this.state.socialSecurityNumber},...this.storePaymentMethodPayload,...a(this.state.installments)&&{installments:this.state.installments},browserInfo:this.browserInfo,origin:!!window&&window.location.origin}}beforeRender(t){if(t?.originalAction)return;const e=new f({type:g.rendered,component:this.type,configData:{...t,showPayButton:this.props.showPayButton},...t?.oneClick&&{isStoredPaymentMethod:!0,brand:t.brand}});this.analytics.sendAnalytics(e)}updateStyles(t){return this.componentRef?.updateStyles&&this.componentRef.updateStyles(t),this}setFocusOn(t){return this.componentRef?.setFocusOn&&this.componentRef.setFocusOn(t),this}processBinLookupResponse(t,e=!1){return this.componentRef?.processBinLookupResponse&&this.componentRef.processBinLookupResponse(t,e),this}handleUnsupportedCard(t){return this.componentRef?.handleUnsupportedCard&&this.componentRef.handleUnsupportedCard(t),this}onBinLookup(t){if(!t.isReset){const e=r("supportedBrandsRaw").from(t);this.props.onBinLookup?.(e)}}get storePaymentMethodPayload(){if(this.props.storedPaymentMethodId?.length>0)return{};if(0===this.props.amount?.value)return this.props.enableStoreDetails?{storePaymentMethod:!0}:{};return this.props.showStoreDetailsCheckbox&&void 0!==this.state.storePaymentMethod?{storePaymentMethod:Boolean(this.state.storePaymentMethod)}:{}}get isValid(){return!!this.state.isValid}get icon(){return this.props.icon??this.resources.getImage()(this.props.brand)}get brands(){const{brands:t,brandsConfiguration:e}=this.props;return t?t.map(t=>({icon:e[t]?.icon??this.props.modules.resources.getImage()(t),name:t})):[]}get displayName(){return this.props.storedPaymentMethodId?`•••• ${this.props.lastFour}`:this.props.name||P.type}get accessibleName(){return(this.props.name||P.type)+(this.props.storedPaymentMethodId?" "+this.props.i18n.get("creditCard.storedCard.description.ariaLabel").replace("%@",this.props.lastFour):"")}get browserInfo(){return o()}renderCardInput(o=!0){return t(e,{setComponentRef:this.setComponentRef,...this.props,...this.state,onSubmitAnalytics:this.submitAnalytics,onChange:this.setState,onSubmit:this.submit,handleKeyPress:this.handleKeyPress,payButton:this.payButton,onBrand:this.onBrand,onBinValue:this.onBinValue,brand:this.props.brand,brandsIcons:this.brands,isPayButtonPrimaryVariant:o,resources:this.resources,onFocus:this.onFocus,onBlur:this.onBlur,onConfigSuccess:this.onConfigSuccess})}componentToRender(){return t(c,{configuration:this.props.clickToPayConfiguration,clickToPayService:this.clickToPayService,isStandaloneComponent:!1,setClickToPayRef:this.setClickToPayRef,onSetStatus:this.setElementStatus,onSubmit:this.handleClickToPaySubmit,onError:this.handleError},t=>this.renderCardInput(t))}constructor(e,o){super(e,o),b(this,"clickToPayService",void 0),b(this,"clickToPayRef",null),b(this,"setClickToPayRef",t=>{this.clickToPayRef=t}),b(this,"onBrand",t=>{this.props.onBrand?.(t)}),b(this,"handleClickToPaySubmit",t=>{this.setState({data:{...t},valid:{},errors:{},isValid:!0}),this.submit()}),b(this,"onConfigSuccess",t=>{const e=new f({component:this.type,type:g.configured});this.submitAnalytics(e),this.props.onConfigSuccess?.(t)}),b(this,"onFocus",t=>{const e=new f({component:this.type,type:g.focus,target:n(t.fieldType)});this.submitAnalytics(e),i(t.fieldType)?this.props.onFocus?.(t.event):this.props.onFocus?.(t)}),b(this,"onBlur",t=>{const e=new f({component:this.type,type:g.unfocus,target:n(t.fieldType)});this.submitAnalytics(e),i(t.fieldType)?this.props.onBlur?.(t.event):this.props.onBlur?.(t)}),b(this,"onBinValue",s(this)),b(this,"payButton",e=>{const o=0===this.props.amount?.value,s=this.props.storedPaymentMethodId?.length>0;return t(l,{...e,label:o&&!s?this.props.i18n.get("payButton.saveDetails"):"",onClick:this.submit})}),o&&!o._disableClickToPay&&"prepaid"!==this.props.fundingSource&&(this.clickToPayService=p(this.props.configuration,this.props.clickToPayConfiguration,this.props.environment,this.analytics),this.clickToPayService?.initialize())}}b(P,"type",u.scheme),b(P,"defaultProps",{showFormInstruction:!0,_disableClickToPay:!1,doBinLookup:!0,...r(["type","setComponentRef"]).from(y)});export{P as CardElement,P as default};
//# sourceMappingURL=Card.js.map