@payrails/web-sdk 2.0.0 → 2.1.1

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.
Files changed (4) hide show
  1. package/index.js +2 -2
  2. package/package.json +1 -1
  3. package/payrails-styles.css +8 -1
  4. package/payrails.d.ts +42 -1
package/index.js CHANGED
@@ -1,4 +1,4 @@
1
- !function(){"use strict";var t;exports.ElementType=void 0,(t=exports.ElementType||(exports.ElementType={})).CARD_NUMBER="CARD_NUMBER",t.CARDHOLDER_NAME="CARDHOLDER_NAME",t.CVV="CVV",t.EXPIRATION_MONTH="EXPIRATION_MONTH",t.EXPIRATION_YEAR="EXPIRATION_YEAR";class e{constructor(t,{id:e="",className:i=""}={}){this.subElements=[];const o=document.createElement(t);e&&(this.id=e,o.setAttribute("id",e)),i&&o.setAttribute("class",i),this.element=o}get parentElement(){return this.element.parentElement}get selector(){if(!this.id)throw new Error("Element id is not set");return`#${this.id}`}mount(t){const e=document.querySelector(t);if(!e)throw new Error(`Element with selector "${t}" not found in in the DOM`);e.appendChild(this.element),this.subElements.forEach((t=>{if(!this.id)throw new Error("Sub elements can not be rendered, please set id for the element");t.mount(this.selector)}))}unmount(){var t;this.subElements.forEach((t=>t.unmount())),null===(t=this.parentElement)||void 0===t||t.removeChild(this.element)}}const{CARD_NUMBER:i,CVV:o,CARDHOLDER_NAME:n,EXPIRATION_MONTH:s,EXPIRATION_YEAR:a}=exports.ElementType,r={base:{border:"none",padding:"10px 16px",color:"#1d1d1d",backgroundColor:"#fff"},invalid:{backgroundColor:"#f9e1e1",borderColor:"#f25226",border:"1px solid"}},l=[{type:n,placeholder:"Card holder",styles:Object.assign(Object.assign({},r),{base:Object.assign(Object.assign({},r.base),{border:"1px solid #eae8ee",padding:"10px 16px",borderTopLeftRadius:"4px",borderTopRightRadius:"4px"})})},{type:i,placeholder:"1234 1234 1234 1234",styles:Object.assign(Object.assign({},r),{base:Object.assign(Object.assign({},r.base),{border:"1px solid #eae8ee",padding:"10px 16px",borderTopLeftRadius:"4px",borderTopRightRadius:"4px",textIndent:"0"}),cardIcon:{position:"absolute",right:"8px",height:"24px",bottom:"calc(50% - 12px)"}})},{type:s,placeholder:"MM",styles:Object.assign(Object.assign({},r),{base:Object.assign(Object.assign({},r.base),{borderBottom:"1px solid #eae8ee",borderLeft:"1px solid #eae8ee",borderRight:"1px solid #eae8ee",borderBottomLeftRadius:"4px"})})},{type:a,placeholder:"YY",format:"YY",styles:Object.assign(Object.assign({},r),{base:Object.assign(Object.assign({},r.base),{borderBottom:"1px solid #eae8ee",borderRight:"1px solid #eae8ee"})})},{type:o,placeholder:"CVC",styles:Object.assign(Object.assign({},r),{base:Object.assign(Object.assign({},r.base),{borderBottom:"1px solid #eae8ee",borderRight:"1px solid #eae8ee",borderBottomRightRadius:"4px"})})}];class d extends e{constructor(t,e){var i,o,n,s,a;super("div",{id:"payrails-card-form"}),this.collectContainer=t,this.options=e,this.storeCardCheckbox=null,this.formFields=[],l.forEach((({type:t,styles:i,format:o,placeholder:n})=>{var s,a,r,l,d,u,h;if(!(null===(s=this.options)||void 0===s?void 0:s.showCardHolderName)&&t===exports.ElementType.CARDHOLDER_NAME)return;const v=new c(this.collectContainer,{type:t,label:null===(r=null===(a=null==e?void 0:e.translations)||void 0===a?void 0:a.labels)||void 0===r?void 0:r[t],placeholder:(null===(d=null===(l=null==e?void 0:e.translations)||void 0===l?void 0:l.placeholders)||void 0===d?void 0:d[t])||n,labelStyles:this.prepareLabelStyles(t),inputStyles:this.prepareInputStyles(i,t),format:o,events:{onFocus:null===(h=null===(u=this.options)||void 0===u?void 0:u.events)||void 0===h?void 0:h.onFocus,onChange:this.onChange.bind(this)}});this.formFields.push(v)})),this.subElements.push(this.collectContainer),(null===(i=this.options)||void 0===i?void 0:i.showStoreInstrumentCheckbox)&&(this.storeCardCheckbox=new u({label:null===(n=null===(o=this.options.translations)||void 0===o?void 0:o.labels)||void 0===n?void 0:n.saveCreditCard,styles:null===(s=this.options.styles)||void 0===s?void 0:s.storeCardCheckbox,events:{onSaveInstrumentCheckboxChanged:null===(a=this.options.events)||void 0===a?void 0:a.onSaveInstrumentCheckboxChanged}}),this.subElements.push(this.storeCardCheckbox))}show(){this.element.style.display="flex"}hide(){this.element.style.display="none"}prepareLabelStyles(t){return["base"].reduce(((e,i)=>{var o,n,s,a,r,l,d,u;return e[i]=Object.assign(Object.assign(Object.assign({},null===(n=null===(o=this.options)||void 0===o?void 0:o.styles)||void 0===n?void 0:n.base),null===(r=null===(a=null===(s=this.options)||void 0===s?void 0:s.styles)||void 0===a?void 0:a.labels)||void 0===r?void 0:r.all),null===(u=null===(d=null===(l=this.options)||void 0===l?void 0:l.styles)||void 0===d?void 0:d.labels)||void 0===u?void 0:u[t]),e}),{})}prepareInputStyles(t,e){var i;let o=JSON.parse(JSON.stringify(t));return(null===(i=this.options)||void 0===i?void 0:i.showCardHolderName)&&e===exports.ElementType.CARD_NUMBER&&(this.element.setAttribute("class","with-card-holder"),o=Object.assign(Object.assign({},t),{base:Object.assign(Object.assign({},r.base),{border:"1px solid #eae8ee",borderTop:"none",padding:"10px 16px",textIndent:"0"})})),["base","complete","empty","focus","invalid","cardIcon","copyIcon"].forEach((t=>{var i,n,s,a,r,l,d,u;o[t]=Object.assign(Object.assign(Object.assign({},o[t]),null===(a=null===(s=null===(n=null===(i=this.options)||void 0===i?void 0:i.styles)||void 0===n?void 0:n.inputFields)||void 0===s?void 0:s.all)||void 0===a?void 0:a[t]),null===(u=null===(d=null===(l=null===(r=this.options)||void 0===r?void 0:r.styles)||void 0===l?void 0:l.inputFields)||void 0===d?void 0:d[e])||void 0===u?void 0:u[t])})),o}get isValid(){return this.formFields.reduce(((t,e)=>t&&e.isValid),!0)}onChange(){var t,e,i,o;(null===(e=null===(t=this.options)||void 0===t?void 0:t.events)||void 0===e?void 0:e.onChange)&&(null===(o=null===(i=this.options)||void 0===i?void 0:i.events)||void 0===o||o.onChange({isValid:this.isValid}))}async collectValues(){var t,e;return{tokenizedCardData:await this.collectContainer.collect(),storeInstrument:(null===(t=this.storeCardCheckbox)||void 0===t?void 0:t.isChecked)||(null===(e=this.options)||void 0===e?void 0:e.alwaysStoreInstrument)}}}class u extends e{constructor(t){super("span",{id:"payrails-store-card"});const e="payrails-store-card-checkbox",i=(null==t?void 0:t.label)||"Save credit card for future payments";this.element.innerHTML=`<label for="${e}"}"><input type="checkbox" id="${e}" name="${e}">${i}</label>`,Object.keys((null==t?void 0:t.styles)||{}).forEach((e=>{var i;this.element.style[e]=null===(i=null==t?void 0:t.styles)||void 0===i?void 0:i[e]})),this.element.addEventListener("change",(e=>{var i,o;(null===(i=null==t?void 0:t.events)||void 0===i?void 0:i.onSaveInstrumentCheckboxChanged)&&(null===(o=null==t?void 0:t.events)||void 0===o||o.onSaveInstrumentCheckboxChanged({checked:this.element.checked})),e.stopPropagation(),e.stopImmediatePropagation()}))}get isChecked(){var t;return null===(t=this.element.querySelector("input"))||void 0===t?void 0:t.checked}}class c{constructor(t,e){this.isValid=!1;const{events:i}=e,o=t.createCollectElement(e);(null==i?void 0:i.onFocus)&&o.on("FOCUS",i.onFocus),o.on("CHANGE",(t=>{const{isEmpty:e,isValid:o}=t;this.isValid=!e&&o,(null==i?void 0:i.onChange)&&i.onChange(this)}))}}class h extends e{constructor(t,e){super("div",{id:"payrails-card-list"}),this.workflowExecution=t,this.listItems=[],this.workflowExecution.savedCreditCards.forEach((t=>{const i=new v((()=>{(null==e?void 0:e.onCardChange)&&e.onCardChange(t)}),t);this.listItems.push(i),this.subElements.push(i)}))}reset(){this.element.querySelectorAll("input").forEach((t=>t.checked=!1))}}class v extends e{constructor(t,e){super("div",{className:"payrails-card-list-item",id:`payrails-card-list-item-${e.id}`});const{id:i}=e,o=this.createCardLabel(e),n=document.createElement("label");n.setAttribute("for",i),n.addEventListener("click",t);const s=document.createElement("input");s.setAttribute("type","radio"),s.setAttribute("name","payment-option"),s.setAttribute("id",i),s.setAttribute("value",i),n.appendChild(s);const a=document.createElement("span");a.innerText=o,n.appendChild(a),this.element.appendChild(n)}createCardLabel({data:{suffix:t}}){return`****${t}`}}let p;const m=new Uint8Array(16);function y(){if(!p&&(p="undefined"!=typeof crypto&&crypto.getRandomValues&&crypto.getRandomValues.bind(crypto),!p))throw new Error("crypto.getRandomValues() not supported. See https://github.com/uuidjs/uuid#getrandomvalues-not-supported");return p(m)}const g=[];for(let t=0;t<256;++t)g.push((t+256).toString(16).slice(1));var b,f={randomUUID:"undefined"!=typeof crypto&&crypto.randomUUID&&crypto.randomUUID.bind(crypto)};function C(t,e,i){if(f.randomUUID&&!e&&!t)return f.randomUUID();const o=(t=t||{}).random||(t.rng||y)();if(o[6]=15&o[6]|64,o[8]=63&o[8]|128,e){i=i||0;for(let t=0;t<16;++t)e[i+t]=o[t];return e}return function(t,e=0){return(g[t[e+0]]+g[t[e+1]]+g[t[e+2]]+g[t[e+3]]+"-"+g[t[e+4]]+g[t[e+5]]+"-"+g[t[e+6]]+g[t[e+7]]+"-"+g[t[e+8]]+g[t[e+9]]+"-"+g[t[e+10]]+g[t[e+11]]+g[t[e+12]]+g[t[e+13]]+g[t[e+14]]+g[t[e+15]]).toLowerCase()}(o)}!function(t){t.GET="GET",t.POST="POST"}(b||(b={}));const w=async({url:t,method:e=b.GET,token:i,body:o})=>{const n={method:e,headers:Object.assign(Object.assign({},k()),A(i))};e===b.POST&&(n.body=JSON.stringify(o||{}));const s=await fetch(t,n),a=await s.json();if([401,403].includes(s.status))throw new E(t,e);if(!s.ok)throw new x(t,e,a);return{ok:s.ok,req:Object.assign({url:t},n),res:a}};class E extends Error{constructor(t,e){super(`[${e}] ${t} unauthorized`)}}class x extends Error{constructor(t,e,i){super(`[${e}] ${t} unsuccessful`),this.res=i}}const A=t=>({authorization:`Bearer ${t}`}),k=()=>({"x-idempotency-key":C()});class P{constructor(t,e){this.sdkConfig=t,this.execution=e}async pay(t){const e=(await this.authorize(t)).res.links.execution;return await this.pollForAuthorizationResult(e)}async authorize(t){if(!this.execution.authorizeLink||!this.sdkConfig.amount)throw new Error("SDK was not initialized with workflow execution");return w({url:this.execution.authorizeLink,method:b.POST,token:this.sdkConfig.token,body:{amount:this.sdkConfig.amount,paymentComposition:t,returnInfo:{success:"https://www.bootstrap.payrails.io/success",cancel:"https://www.bootstrap.payrails.io/cancel",error:"https://www.bootstrap.payrails.io/error"}}})}async confirm(t,e={}){const i=await w({url:t,method:b.POST,token:this.sdkConfig.token,body:{data:e}});return this.pollForAuthorizationResult(i.res.links.execution)}async pollForAuthorizationResult(t,e=0){const i=(await this.getExecution(t)).res,o=i.status,n=["authorizePending","authorizeSuccessful","authorizeFailed"],s=o.find((({code:t})=>"authorizeRequested"===t));if(!s&&e<10)return await new Promise((t=>setTimeout(t,300))),this.pollForAuthorizationResult(t,e+1);if(!s)throw new Error("Authorization was not requested");const a=o.find((({code:t,time:e})=>"confirmRequested"===t&&new Date(e)>new Date(s.time))),r=a?a.time:s.time;let l=o.find((({code:t,time:e})=>n.includes(t)&&new Date(e)>new Date(r)));if(!l){const{res:e}=await this.getExecution(t,void 0,r);return l=e.status.find((({code:t,time:e})=>n.includes(t)&&new Date(e)>new Date(r))),{finalState:l,response:e}}return{finalState:l,response:i}}async getExecution(t,e,i){const o=new URLSearchParams;e&&e.length>0&&o.append("waitWhile[status]",`[${e.map((t=>`"${t}"`)).join(",")}]`),i&&o.append("waitWhile[lastStatusTime]",i);const n=`${t}${o.toString()?"?":""}${o.toString()}`;return w({url:n,token:this.sdkConfig.token})}}var _,S;!function(t){t.CARD="card",t.GOOGLE_PAY="googlePay",t.PAYPAL="payPal"}(_||(_={})),function(t){t.ENABLED="enabled",t.CREATED="created"}(S||(S={}));class O{constructor(t){this.executionResponse=t}get lookup(){return this.executionResponse.initialResults.find((({body:{name:t}})=>"lookup"===t))}get holderReference(){return this.executionResponse.holderReference}get savedCreditCards(){const t=this.availablePaymentMethods.find((({paymentMethodCode:t})=>t===_.CARD));return(null==t?void 0:t.paymentInstruments)||[]}get paypalConfig(){const t=this.availablePaymentMethods.find((({paymentMethodCode:t})=>t===_.PAYPAL));if(!t)throw new Error("trying to initialize paypal without config");return t.config}get googlePayConfig(){const t=this.availablePaymentMethods.find((({paymentMethodCode:t})=>t===_.GOOGLE_PAY));if(!t)throw new Error("trying to initialize google pay without config");return t?[t.config]:[]}get url(){return this.response.links.self}get response(){return this.executionResponse}get meta(){return this.executionResponse.meta}get availablePaymentMethods(){var t;return(null===(t=this.lookup)||void 0===t?void 0:t.body.data.paymentCompositionOptions)||[]}get authorizeLink(){var t;return null===(t=this.lookup)||void 0===t?void 0:t.body.links.authorize.href}}class B extends e{constructor(t,e,i){var o;super("button",{id:"payrails-card-payment-button"}),this.sdkConfig=t,this.execution=e,this.options=i,this.selectedCard=null,this.storeInstrument=!1,this.element.innerText=(null===(o=null==i?void 0:i.translations)||void 0===o?void 0:o.label)||"Pay",this.element.addEventListener("click",this.onPay.bind(this)),this.element.addEventListener("mouseenter",(()=>{var t;this.element.classList.contains("disabled")||(this.element.classList.add("hover"),this.setStyles((null===(t=this.options.styles)||void 0===t?void 0:t.hover)||{}))})),this.element.addEventListener("mouseleave",(()=>{var t;this.element.classList.contains("disabled")||(this.element.classList.remove("hover"),this.removeStyles((null===(t=this.options.styles)||void 0===t?void 0:t.hover)||{}))})),this.paymentExecutor=new P(this.sdkConfig,this.execution)}setDisabled(t){var e,i,o;this.element.disabled=t,t?(this.element.classList.add("disabled"),(null===(e=this.options.styles)||void 0===e?void 0:e.disabled)&&this.setStyles(this.options.styles.disabled)):(this.element.classList.remove("disabled"),this.removeStyles((null===(i=this.options.styles)||void 0===i?void 0:i.disabled)||{}),(null===(o=this.options.styles)||void 0===o?void 0:o.base)&&this.setStyles(this.options.styles.base))}setStyles(t){var e;const i=Object.assign(Object.assign({},null===(e=this.options.styles)||void 0===e?void 0:e.base),t);Object.keys(i).forEach((t=>{this.element.style[t]=i[t]}))}removeStyles(t){var e;const i=Object.keys((null===(e=this.options.styles)||void 0===e?void 0:e.base)||{});Object.keys(t).forEach((t=>{var e,o;i.includes(t)?this.element.style[t]=null===(o=null===(e=this.options.styles)||void 0===e?void 0:e.base)||void 0===o?void 0:o[t]:this.element.style[t]=""}))}setLabel(t){this.element.innerText=t}setCardForm(t){this.cardForm=t}triggerLoading(t){var e,i,o,n;const s=this.element.offsetWidth;this.element.style.minWidth=`${s}px`,t?(this.element.innerHTML='<div class="dot-flashing"></div>',this.element.classList.add("loading"),(null===(e=this.options.styles)||void 0===e?void 0:e.loading)&&this.setStyles(this.options.styles.loading)):(this.element.innerText=(null===(o=null===(i=this.options)||void 0===i?void 0:i.translations)||void 0===o?void 0:o.label)||"Pay",this.element.classList.remove("loading"),this.removeStyles((null===(n=this.options.styles)||void 0===n?void 0:n.loading)||{}))}onAuthorizationFailed(){var t,e;this.setDisabled(!1),this.triggerLoading(!1),(null===(t=this.options.events)||void 0===t?void 0:t.onAuthorizeFailed)&&(null===(e=this.options.events)||void 0===e||e.onAuthorizeFailed())}async onPay(){var t,e,i,o;if(this.setDisabled(!0),this.triggerLoading(!0),null===(t=this.options.events)||void 0===t?void 0:t.onPaymentButtonClicked){if(!1===await(null===(e=this.options.events)||void 0===e?void 0:e.onPaymentButtonClicked()))return void this.onAuthorizationFailed()}try{let t;(null===(i=this.selectedCard)||void 0===i?void 0:i.id)||(t=await this.collectCardFormValues());const e=[{paymentMethodCode:_.CARD,integrationType:"api",amount:this.sdkConfig.amount,storeInstrument:this.storeInstrument,paymentInstrumentData:{vaultToken:null==t?void 0:t.instrumentId,card:{numberToken:null==t?void 0:t.card_number,securityCodeToken:null==t?void 0:t.security_code}}}],o=await this.paymentExecutor.pay(e);this.handleAuthorizationResult(o)}catch(t){t instanceof E&&(null===(o=this.options.events)||void 0===o?void 0:o.onPaymentSessionExpired)&&this.options.events.onPaymentSessionExpired(),this.onAuthorizationFailed()}}handleAuthorizationResult(t){var e,i,o;switch(null===(e=null==t?void 0:t.finalState)||void 0===e?void 0:e.code){case"authorizeSuccessful":this.triggerLoading(!1),(null===(i=this.options.events)||void 0===i?void 0:i.onAuthorizeSuccess)&&this.options.events.onAuthorizeSuccess();break;case"authorizePending":"3ds"===(null===(o=null==t?void 0:t.response)||void 0===o?void 0:o.actionRequired)&&this.handle3ds(t);break;default:this.onAuthorizationFailed()}}handle3ds(t){var e,i;const o=null===(e=null==t?void 0:t.response)||void 0===e?void 0:e.links["3ds"];if(o){const t=[[250,400],[390,400],[500,600],[600,400]],e=screen.width,n=t.reduce(((t,i)=>e>i[0]?i:t),[250,400]),s=document.createElement("iframe");s.setAttribute("id","payrails-3ds-frame"),s.setAttribute("src",o),s.setAttribute("width",n[0].toString()),s.setAttribute("height",n[1].toString());const a=document.createElement("div");a.setAttribute("id","payrails-3ds-challenge"),a.appendChild(s);const r=document.createElement("div");r.addEventListener("click",(async()=>{r.remove()})),r.setAttribute("id","payrails-3ds-popup-background"),r.appendChild(a);const l=async t=>{var e,i,o;if(t.data&&'{"type":"3DS-challenge-completed"}'===t.data){window.removeEventListener("message",l),r.remove();if(!(await this.paymentExecutor.getExecution(this.execution.url)).res.status.find((({code:t})=>"authorizeSuccessful"===t))&&(null===(e=this.options.events)||void 0===e?void 0:e.onAuthorizeFailed))return void this.onAuthorizationFailed();if(null===(i=this.options.events)||void 0===i?void 0:i.onAuthorizeSuccess)return void(null===(o=this.options.events)||void 0===o||o.onAuthorizeSuccess())}};null===(i=document.querySelector("body"))||void 0===i||i.appendChild(r),window.addEventListener("message",l),a.style.width=`${n[0]+4}px`,a.style.height=`${n[1]+4}px`}}async collectCardFormValues(){if(!this.cardForm)throw new Error("Trying to collect values from non-existent card form");const{tokenizedCardData:t,storeInstrument:e}=await this.cardForm.collectValues();return this.storeInstrument=Boolean(e),t}}class F extends e{constructor(t="Authorization failed, please try again."){super("div",{id:"authorization-failed-message"}),this.element.innerText=t,this.element.innerHTML=`\n <div>\n <svg class="checkmark-cross" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 52 52">\n <circle class="checkmark-cross_circle" cx="26" cy="26" r="25" fill="none"/>\n <path class="checkmark-cross_check" fill="none" d="M14.1 14.1l23.8 23.8 m0,-23.8 l-23.8,23.8"/>\n </svg>\n </div>\n <div>${t}</div>`,this.element.addEventListener("click",(t=>{t.preventDefault(),t.stopImmediatePropagation(),t.stopPropagation(),this.unmount()}))}}class L extends e{constructor(t){var e;super("div",{id:"payrails-authorization-success-msg"}),this.element.innerHTML=`\n <div class="checkmark-wrapper">\n <svg class="checkmark" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 52 52">\n <circle class="checkmark__circle" cx="26" cy="26" r="25" fill="none"/>\n <path class="checkmark__check" fill="none" d="M14.1 27.2l7.1 7.2 16.7-16.8"/>\n </svg>\n </div>\n <div id="payrails-authorization-success">${(null===(e=null==t?void 0:t.translations)||void 0===e?void 0:e.label)||"Payment successful"}</div`}}class z extends e{constructor(t,e,i){super("div",{id:t,className:"payrails-dropin-item"}),this.events=i,this.isActive=!1;const o=`payrails-dropin-item-${t}`,n=document.createElement("label");n.setAttribute("for",o);const s=document.createElement("input");s.setAttribute("type","radio"),s.setAttribute("name","payment-option"),s.setAttribute("id",o),s.setAttribute("value",o),this.input=s,n.appendChild(s),this.label=n;const a=document.createElement("span");n.appendChild(a),a.innerText=e,this.element.appendChild(n)}get identifier(){return`payrails-dropin-item-${this.id}`}deactivate(){var t,e;this.isActive&&(this.isActive=!1,this.label.style.marginBottom="0",null===(t=this.component)||void 0===t||t.unmount(),(null===(e=this.events)||void 0===e?void 0:e.onDeactivate)&&this.events.onDeactivate())}activate(){var t,e;this.isActive||(null===(t=this.component)||void 0===t||t.mount(this.selector),this.label.style.marginBottom="8px",this.isActive=!0,(null===(e=this.events)||void 0===e?void 0:e.onActivate)&&this.events.onActivate())}}class R extends z{constructor(t,e){super("payrails-credit-card-wrapper","Card"),this.cardForm=t,this.paymentButton=e,this.cardFormShown=!1,this.component=new j(t,e)}activate(){var t,e;this.label.style.marginBottom="8px",this.cardFormShown||(this.cardFormShown=!0,null===(t=this.component)||void 0===t||t.mount(this.selector)),this.isActive||(this.paymentButton.selectedCard=null,this.paymentButton.mount(this.selector),this.paymentButton.setDisabled(!this.cardForm.isValid),this.paymentButton.mount("#payrails-card-form"),this.input.checked=!0,this.cardForm.show(),this.isActive=!0,(null===(e=this.events)||void 0===e?void 0:e.onActivate)&&this.events.onActivate())}deactivate(){var t;this.isActive&&(this.label.style.marginBottom="0",this.paymentButton.unmount(),this.cardForm.hide(),this.isActive=!1,(null===(t=this.events)||void 0===t?void 0:t.onDeactivate)&&this.events.onDeactivate())}}class j extends e{constructor(t,e){super("div",{id:"payrails-form-container"}),this.subElements.push(t,e)}}class I{constructor(t){this.loadFunction=t,this.loadScript()}get loader(){return this.loadingPromise||(this.loadingPromise=this.loadScript()),this.loadingPromise}async loadScript(){return this.loadingPromise||(this.loadingPromise=new Promise(((t,e)=>{this.loadFunction().then((i=>{i?t(i):e()}),e)}))),this.loadingPromise}}const T={apiVersion:2,apiVersionMinor:0};class D extends e{constructor(t,e,i){super("div",{id:"payrails-google-pay-button"}),this.sdkConfig=t,this.execution=e,this.options=i,this.googleButton=null,this.paymentExecutor=new P(t,e),this.loadScript=new I((async()=>{const t=document.createElement("script");return t.src="https://pay.google.com/gp/p/js/pay.js",new Promise(((e,i)=>{t.onload=()=>{const t=new google.payments.api.PaymentsClient({environment:this.options.environment||"TEST"}),o=Object.assign(Object.assign({},T),{allowedPaymentMethods:this.execution.googlePayConfig});t.isReadyToPay(o).then((o=>{var n,s,a;o?(null===(a=null===(s=null===(n=this.options)||void 0===n?void 0:n.events)||void 0===s?void 0:s.onGooglePayAvailable)||void 0===a||a.call(s),e(t)):i()}),i)},t.onerror=()=>{i()},document.body.appendChild(t)}))}))}async sdkLoaded(t){var e,i,o,n,s,a,r,l;try{const d=(null===(i=null===(e=this.options)||void 0===e?void 0:e.styles)||void 0===i?void 0:i.buttonColor)||"black",u=(null===(n=null===(o=this.options)||void 0===o?void 0:o.styles)||void 0===n?void 0:n.buttonType)||"long",c=(null===(a=null===(s=this.options)||void 0===s?void 0:s.styles)||void 0===a?void 0:a.buttonSizeMode)||"fill",h=(null===(l=null===(r=this.options)||void 0===r?void 0:r.styles)||void 0===l?void 0:l.buttonLocale)||void 0;return this.googleButton=t.createButton({buttonColor:d,buttonType:u,buttonSizeMode:c,buttonLocale:h,onClick:async()=>{var t,e,i;if(null===(e=null===(t=this.options)||void 0===t?void 0:t.events)||void 0===e?void 0:e.onPaymentButtonClicked){if(!await(null===(i=this.options)||void 0===i?void 0:i.events.onPaymentButtonClicked()))return}await this.onPaymentButtonClicked()},allowedPaymentMethods:this.execution.googlePayConfig}),this.element.appendChild(this.googleButton),this.googleButton}catch(t){throw console.error("Google pay can not be initialized",t),new Error(t.message)}}async onLoadPaymentData(t){var e,i,o,n;const s=[{paymentMethodCode:"googlePay",integrationType:"api",paymentInstrumentData:{paymentToken:t.paymentMethodData.tokenizationData.token},amount:this.sdkConfig.amount}],a=await this.paymentExecutor.pay(s);(null===(i=null===(e=this.options)||void 0===e?void 0:e.events)||void 0===i?void 0:i.onAuthorizeSuccess)&&(null===(n=null===(o=this.options)||void 0===o?void 0:o.events)||void 0===n||n.onAuthorizeSuccess(a))}async onPaymentButtonClicked(){var t,e,i,o,n;const s=Object.assign({},T);s.allowedPaymentMethods=this.execution.googlePayConfig,s.transactionInfo={totalPriceStatus:"FINAL",totalPrice:null===(t=this.sdkConfig.amount)||void 0===t?void 0:t.value,currencyCode:null===(e=this.sdkConfig.amount)||void 0===e?void 0:e.currency,countryCode:null===(n=null===(o=null===(i=this.execution.meta)||void 0===i?void 0:i.customer)||void 0===o?void 0:o.country)||void 0===n?void 0:n.code};(await this.loadScript.loader).loadPaymentData(s).then((t=>{this.onLoadPaymentData(t)})).catch((t=>{var e,i,o;(null===(i=null===(e=this.options)||void 0===e?void 0:e.events)||void 0===i?void 0:i.onAuthorizeFailed)&&(null===(o=this.options)||void 0===o||o.events.onAuthorizeFailed(t))}))}mount(t){super.mount(t),(async()=>{try{const t=await this.loadScript.loader,e=await this.sdkLoaded(t);this.element.appendChild(e)}catch(t){}})()}unmount(){var t;this.googleButton&&(null===(t=this.googleButton.parentElement)||void 0===t||t.removeChild(this.googleButton)),super.unmount()}}class M extends z{constructor(){super(...arguments),this.buttonShown=!1}activate(){if(!this.buttonShown)return super.activate(),void(this.buttonShown=!0);this.label.style.marginBottom="8px",this.isActive=!0,this.element.querySelector(this.component.selector).style.display="block"}deactivate(){this.isActive&&(this.isActive=!1,this.label.style.marginBottom="0",this.element.querySelector(this.component.selector).style.display="none")}mountAfterAvailable(){super.mount(`#${this.loadElementId}`)}mount(t){const e=document.querySelector(t);if(!e)throw new Error(`Element with selector "${t}" not found in in the DOM`);const i=document.createElement("div");i.setAttribute("id",this.loadElementId),i.setAttribute("style","width: 100%;"),e.appendChild(i)}unmount(){var t;super.unmount(),null===(t=document.querySelector(`#${this.loadElementId}`))||void 0===t||t.remove()}}class N extends M{constructor(t,e,i){var o;super("google-pay-dropin",(null===(o=i.translations)||void 0===o?void 0:o.label)||"Google Pay"),this.loadElementId="google-pay-dropin-load-element",this.component=new D(t,e,Object.assign(Object.assign({},i),{events:Object.assign(Object.assign({},i.events),{onGooglePayAvailable:()=>{this.mountAfterAvailable()}})}))}mount(t){const e=document.querySelector(t);if(!e)throw new Error(`Element with selector "${t}" not found in in the DOM`);const i=document.createElement("div");i.setAttribute("id",this.loadElementId),i.setAttribute("style","width: 100%;"),e.appendChild(i)}}
1
+ !function(){"use strict";var t;let e;exports.ElementType=void 0,(t=exports.ElementType||(exports.ElementType={})).CARD_NUMBER="CARD_NUMBER",t.CARDHOLDER_NAME="CARDHOLDER_NAME",t.CVV="CVV",t.EXPIRATION_MONTH="EXPIRATION_MONTH",t.EXPIRATION_YEAR="EXPIRATION_YEAR";const i=new Uint8Array(16);function n(){if(!e&&(e="undefined"!=typeof crypto&&crypto.getRandomValues&&crypto.getRandomValues.bind(crypto),!e))throw new Error("crypto.getRandomValues() not supported. See https://github.com/uuidjs/uuid#getrandomvalues-not-supported");return e(i)}const o=[];for(let t=0;t<256;++t)o.push((t+256).toString(16).slice(1));var s,a={randomUUID:"undefined"!=typeof crypto&&crypto.randomUUID&&crypto.randomUUID.bind(crypto)};function r(t,e,i){if(a.randomUUID&&!e&&!t)return a.randomUUID();const s=(t=t||{}).random||(t.rng||n)();if(s[6]=15&s[6]|64,s[8]=63&s[8]|128,e){i=i||0;for(let t=0;t<16;++t)e[i+t]=s[t];return e}return function(t,e=0){return(o[t[e+0]]+o[t[e+1]]+o[t[e+2]]+o[t[e+3]]+"-"+o[t[e+4]]+o[t[e+5]]+"-"+o[t[e+6]]+o[t[e+7]]+"-"+o[t[e+8]]+o[t[e+9]]+"-"+o[t[e+10]]+o[t[e+11]]+o[t[e+12]]+o[t[e+13]]+o[t[e+14]]+o[t[e+15]]).toLowerCase()}(s)}!function(t){t.GET="GET",t.POST="POST"}(s||(s={}));const l=async({url:t,method:e=s.GET,token:i,body:n})=>{const o={method:e,headers:Object.assign(Object.assign({},h()),c(i))};e===s.POST&&(o.body=JSON.stringify(n||{}));const a=await fetch(t,o),r=await a.json();if([401,403].includes(a.status))throw new d(t,e);if(!a.ok)throw new u(t,e,r);return{ok:a.ok,req:Object.assign({url:t},o),res:r}};class d extends Error{constructor(t,e){super(`[${e}] ${t} unauthorized`)}}class u extends Error{constructor(t,e,i){super(`[${e}] ${t} unsuccessful`),this.res=i}}const c=t=>({authorization:`Bearer ${t}`}),h=()=>({"x-idempotency-key":r()});class p{constructor(t,e){this.sdkConfig=t,this.execution=e}async pay(t){const e=(await this.authorize(t)).res.links.execution;return await this.pollForAuthorizationResult(e)}async authorize(t){if(!this.execution.authorizeLink||!this.sdkConfig.amount)throw new Error("SDK was not initialized with workflow execution");return l({url:this.execution.authorizeLink,method:s.POST,token:this.sdkConfig.token,body:{amount:this.sdkConfig.amount,paymentComposition:t,returnInfo:{success:"https://www.bootstrap.payrails.io/success",cancel:"https://www.bootstrap.payrails.io/cancel",error:"https://www.bootstrap.payrails.io/error"}}})}async confirm(t,e={}){const i=await l({url:t,method:s.POST,token:this.sdkConfig.token,body:{data:e}});return this.pollForAuthorizationResult(i.res.links.execution)}async pollForAuthorizationResult(t,e=0){const i=(await this.getExecution(t)).res,n=i.status,o=["authorizePending","authorizeSuccessful","authorizeFailed"],s=n.find((({code:t})=>"authorizeRequested"===t));if(!s&&e<10)return await new Promise((t=>setTimeout(t,300))),this.pollForAuthorizationResult(t,e+1);if(!s)throw new Error("Authorization was not requested");const a=n.find((({code:t,time:e})=>"confirmRequested"===t&&new Date(e)>new Date(s.time))),r=a?a.time:s.time;let l=n.find((({code:t,time:e})=>o.includes(t)&&new Date(e)>new Date(r)));if(!l){const{res:e}=await this.getExecution(t,void 0,r);return l=e.status.find((({code:t,time:e})=>o.includes(t)&&new Date(e)>new Date(r))),{finalState:l,response:e}}return{finalState:l,response:i}}async getExecution(t,e,i){const n=new URLSearchParams;e&&e.length>0&&n.append("waitWhile[status]",`[${e.map((t=>`"${t}"`)).join(",")}]`),i&&n.append("waitWhile[lastStatusTime]",i);const o=`${t}${n.toString()?"?":""}${n.toString()}`;return l({url:o,token:this.sdkConfig.token})}async createApplePaySession(t,e){return l({url:t,method:s.POST,token:this.sdkConfig.token,body:{integrationType:"api",paymentMethodCode:"applePay",amount:this.sdkConfig.amount,meta:{sessionURL:e}}})}}class v{constructor(t){this.loadFunction=t,this.loadScript()}get loader(){return this.loadingPromise||(this.loadingPromise=this.loadScript()),this.loadingPromise}async loadScript(){return this.loadingPromise||(this.loadingPromise=new Promise(((t,e)=>{this.loadFunction().then((i=>{i?t(i):e()}),e)}))),this.loadingPromise}}class m{constructor(t,{id:e="",className:i=""}={}){this.subElements=[];const n=document.createElement(t);e&&(this.id=e,n.setAttribute("id",e)),i&&n.setAttribute("class",i),this.element=n}get parentElement(){return this.element.parentElement}get selector(){if(!this.id)throw new Error("Element id is not set");return`#${this.id}`}mount(t){const e=document.querySelector(t);if(!e)throw new Error(`Element with selector "${t}" not found in in the DOM`);e.appendChild(this.element),this.subElements.forEach((t=>{if(!this.id)throw new Error("Sub elements can not be rendered, please set id for the element");t.mount(this.selector)}))}unmount(){var t;this.subElements.forEach((t=>t.unmount())),null===(t=this.parentElement)||void 0===t||t.removeChild(this.element)}}class y extends m{constructor(t,e,i){super("div",{id:"payrails-apple-pay-button"}),this.sdkConfig=t,this.execution=e,this.options=i,this.appleButton=null,this.paymentExecutor=new p(t,e),this.loadScript=new v((async()=>{const t=document.createElement("script");return t.src="https://applepay.cdn-apple.com/jsapi/v1/apple-pay-sdk.js",new Promise(((e,i)=>{t.onload=async()=>{var t,i,n;await this.isApplePayAvailable()?(null===(n=null===(i=null===(t=this.options)||void 0===t?void 0:t.events)||void 0===i?void 0:i.onApplePayAvailable)||void 0===n||n.call(i),e(!0)):e(!1)},t.onerror=()=>{i()},document.body.appendChild(t)}))}))}mount(t){super.mount(t),(async()=>{try{await this.loadScript.loader,await this.mountApplePayButton()}catch(t){}})()}unmount(){var t,e;null===(e=null===(t=this.appleButton)||void 0===t?void 0:t.parentElement)||void 0===e||e.removeChild(this.appleButton),super.unmount()}async isApplePayAvailable(){if(!(null===window||void 0===window?void 0:window.ApplePaySession))return!1;return await ApplePaySession.canMakePayments()}async mountApplePayButton(){var t,e;if(null===window||void 0===window?void 0:window.ApplePaySession)try{if(!this.isApplePayAvailable())return;null===(e=null===(t=this.options.events)||void 0===t?void 0:t.onApplePayAvailable)||void 0===e||e.call(t),this.element.innerHTML='<apple-pay-button buttonstyle="black" type="buy" locale="en-GB"></apple-pay-button>';const i=this.element.querySelector("apple-pay-button");null==i||i.setAttribute("style","width: 100%;"),null==i||i.addEventListener("click",(()=>{this.createApplePaySession()}))}catch(t){}}createApplePaySession(){const t=this.execution.applePayConfig,{countryCode:e,supportedNetworks:i,merchantCapabilities:n}=t,{amount:o}=this.sdkConfig;try{const t={countryCode:e,currencyCode:o.currency,merchantCapabilities:n,supportedNetworks:i,total:{label:"",type:"final",amount:o.value}},s=new ApplePaySession(3,t);return s.onvalidatemerchant=async t=>{const{res:e}=await this.paymentExecutor.createApplePaySession(this.execution.createSessionLink,t.validationURL),i=e.data.data;s.completeMerchantValidation(i)},s.onpaymentauthorized=async t=>{var e,i,n,o,a,r,l,d,u,c,h,p;try{const c=await this.onApplePayAuthorized(t.payment.token);if("authorizeSuccessful"===(null===(e=null==c?void 0:c.finalState)||void 0===e?void 0:e.code))(null===(i=this.options.events)||void 0===i?void 0:i.onAuthorizeSuccess)&&this.options.events.onAuthorizeSuccess();else s.completePayment(ApplePaySession.STATUS_FAILURE),(null===(o=null===(n=this.options)||void 0===n?void 0:n.events)||void 0===o?void 0:o.onAuthorizeFailed)&&(null===(a=this.options)||void 0===a||a.events.onAuthorizeFailed());s.completePayment(ApplePaySession.STATUS_SUCCESS),(null===(l=null===(r=this.options)||void 0===r?void 0:r.events)||void 0===l?void 0:l.onAuthorizeSuccess)&&(null===(u=null===(d=this.options)||void 0===d?void 0:d.events)||void 0===u||u.onAuthorizeSuccess(c))}catch(t){s.completePayment(ApplePaySession.STATUS_FAILURE),(null===(h=null===(c=this.options)||void 0===c?void 0:c.events)||void 0===h?void 0:h.onAuthorizeFailed)&&(null===(p=this.options)||void 0===p||p.events.onAuthorizeFailed(t))}},s.begin(),s}catch(t){return null}}async onApplePayAuthorized(t){const e={paymentData:t.paymentData,transactionIdentifier:t.transactionIdentifier,paymentNetwork:t.paymentMethod.network,paymentInstrumentName:t.paymentMethod.displayName},i=[{paymentMethodCode:"applePay",integrationType:"api",paymentInstrumentData:{paymentToken:JSON.stringify(e)},amount:this.sdkConfig.amount}];return await this.paymentExecutor.pay(i)}}const{CARD_NUMBER:g,CVV:b,CARDHOLDER_NAME:f,EXPIRATION_MONTH:w,EXPIRATION_YEAR:C}=exports.ElementType,A={base:{border:"none",padding:"10px 16px",color:"#1d1d1d",backgroundColor:"#fff"},invalid:{backgroundColor:"#f9e1e1",borderColor:"#f25226",border:"1px solid"}},P=[{type:f,placeholder:"Card holder",styles:Object.assign(Object.assign({},A),{base:Object.assign(Object.assign({},A.base),{border:"1px solid #eae8ee",padding:"10px 16px",borderTopLeftRadius:"4px",borderTopRightRadius:"4px"})})},{type:g,placeholder:"1234 1234 1234 1234",styles:Object.assign(Object.assign({},A),{base:Object.assign(Object.assign({},A.base),{border:"1px solid #eae8ee",padding:"10px 16px",borderTopLeftRadius:"4px",borderTopRightRadius:"4px",textIndent:"0"}),cardIcon:{position:"absolute",right:"8px",height:"24px",bottom:"calc(50% - 12px)"}})},{type:w,placeholder:"MM",styles:Object.assign(Object.assign({},A),{base:Object.assign(Object.assign({},A.base),{borderBottom:"1px solid #eae8ee",borderLeft:"1px solid #eae8ee",borderRight:"1px solid #eae8ee",borderBottomLeftRadius:"4px"})})},{type:C,placeholder:"YY",format:"YY",styles:Object.assign(Object.assign({},A),{base:Object.assign(Object.assign({},A.base),{borderBottom:"1px solid #eae8ee",borderRight:"1px solid #eae8ee"})})},{type:b,placeholder:"CVC",styles:Object.assign(Object.assign({},A),{base:Object.assign(Object.assign({},A.base),{borderBottom:"1px solid #eae8ee",borderRight:"1px solid #eae8ee",borderBottomRightRadius:"4px"})})}];class E extends m{constructor(t,e){var i,n,o,s,a;super("div",{id:"payrails-card-form"}),this.collectContainer=t,this.options=e,this.storeCardCheckbox=null,this.formFields=[],P.forEach((({type:t,styles:i,format:n,placeholder:o})=>{var s,a,r,l,d,u,c;if(!(null===(s=this.options)||void 0===s?void 0:s.showCardHolderName)&&t===exports.ElementType.CARDHOLDER_NAME)return;const h=new k(this.collectContainer,{type:t,label:null===(r=null===(a=null==e?void 0:e.translations)||void 0===a?void 0:a.labels)||void 0===r?void 0:r[t],placeholder:(null===(d=null===(l=null==e?void 0:e.translations)||void 0===l?void 0:l.placeholders)||void 0===d?void 0:d[t])||o,labelStyles:this.prepareLabelStyles(t),inputStyles:this.prepareInputStyles(i,t),format:n,events:{onFocus:null===(c=null===(u=this.options)||void 0===u?void 0:u.events)||void 0===c?void 0:c.onFocus,onChange:this.onChange.bind(this)}});this.formFields.push(h)})),this.subElements.push(this.collectContainer),(null===(i=this.options)||void 0===i?void 0:i.showStoreInstrumentCheckbox)&&(this.storeCardCheckbox=new x({label:null===(o=null===(n=this.options.translations)||void 0===n?void 0:n.labels)||void 0===o?void 0:o.saveCreditCard,styles:null===(s=this.options.styles)||void 0===s?void 0:s.storeCardCheckbox,events:{onSaveInstrumentCheckboxChanged:null===(a=this.options.events)||void 0===a?void 0:a.onSaveInstrumentCheckboxChanged}}),this.subElements.push(this.storeCardCheckbox))}show(){this.element.style.display="flex"}hide(){this.element.style.display="none"}prepareLabelStyles(t){return["base"].reduce(((e,i)=>{var n,o,s,a,r,l,d,u;return e[i]=Object.assign(Object.assign(Object.assign({},null===(o=null===(n=this.options)||void 0===n?void 0:n.styles)||void 0===o?void 0:o.base),null===(r=null===(a=null===(s=this.options)||void 0===s?void 0:s.styles)||void 0===a?void 0:a.labels)||void 0===r?void 0:r.all),null===(u=null===(d=null===(l=this.options)||void 0===l?void 0:l.styles)||void 0===d?void 0:d.labels)||void 0===u?void 0:u[t]),e}),{})}prepareInputStyles(t,e){var i;let n=JSON.parse(JSON.stringify(t));return(null===(i=this.options)||void 0===i?void 0:i.showCardHolderName)&&e===exports.ElementType.CARD_NUMBER&&(this.element.setAttribute("class","with-card-holder"),n=Object.assign(Object.assign({},t),{base:Object.assign(Object.assign({},A.base),{border:"1px solid #eae8ee",borderTop:"none",padding:"10px 16px",textIndent:"0"})})),["base","complete","empty","focus","invalid","cardIcon","copyIcon"].forEach((t=>{var i,o,s,a,r,l,d,u;n[t]=Object.assign(Object.assign(Object.assign({},n[t]),null===(a=null===(s=null===(o=null===(i=this.options)||void 0===i?void 0:i.styles)||void 0===o?void 0:o.inputFields)||void 0===s?void 0:s.all)||void 0===a?void 0:a[t]),null===(u=null===(d=null===(l=null===(r=this.options)||void 0===r?void 0:r.styles)||void 0===l?void 0:l.inputFields)||void 0===d?void 0:d[e])||void 0===u?void 0:u[t])})),n}get isValid(){return this.formFields.reduce(((t,e)=>t&&e.isValid),!0)}onChange(){var t,e,i,n;(null===(e=null===(t=this.options)||void 0===t?void 0:t.events)||void 0===e?void 0:e.onChange)&&(null===(n=null===(i=this.options)||void 0===i?void 0:i.events)||void 0===n||n.onChange({isValid:this.isValid}))}async collectValues(){var t,e;return{tokenizedCardData:await this.collectContainer.collect(),storeInstrument:(null===(t=this.storeCardCheckbox)||void 0===t?void 0:t.isChecked)||(null===(e=this.options)||void 0===e?void 0:e.alwaysStoreInstrument)}}}class x extends m{constructor(t){super("span",{id:"payrails-store-card"});const e="payrails-store-card-checkbox",i=(null==t?void 0:t.label)||"Save credit card for future payments";this.element.innerHTML=`<label for="${e}"}"><input type="checkbox" id="${e}" name="${e}">${i}</label>`,Object.keys((null==t?void 0:t.styles)||{}).forEach((e=>{var i;this.element.style[e]=null===(i=null==t?void 0:t.styles)||void 0===i?void 0:i[e]})),this.element.addEventListener("change",(e=>{var i,n;(null===(i=null==t?void 0:t.events)||void 0===i?void 0:i.onSaveInstrumentCheckboxChanged)&&(null===(n=null==t?void 0:t.events)||void 0===n||n.onSaveInstrumentCheckboxChanged({checked:this.element.checked})),e.stopPropagation(),e.stopImmediatePropagation()}))}get isChecked(){var t;return null===(t=this.element.querySelector("input"))||void 0===t?void 0:t.checked}}class k{constructor(t,e){this.isValid=!1;const{events:i}=e,n=t.createCollectElement(e);(null==i?void 0:i.onFocus)&&n.on("FOCUS",i.onFocus),n.on("CHANGE",(t=>{const{isEmpty:e,isValid:n}=t;this.isValid=!e&&n,(null==i?void 0:i.onChange)&&i.onChange(this)}))}}class S extends m{constructor(t,e){super("div",{id:"payrails-card-list"}),this.workflowExecution=t,this.listItems=[],this.workflowExecution.savedCreditCards.forEach((t=>{const i=new _((()=>{(null==e?void 0:e.onCardChange)&&e.onCardChange(t)}),t);this.listItems.push(i),this.subElements.push(i)}))}reset(){this.element.querySelectorAll("input").forEach((t=>t.checked=!1))}}class _ extends m{constructor(t,e){super("div",{className:"payrails-card-list-item",id:`payrails-card-list-item-${e.id}`});const{id:i}=e,n=this.createCardLabel(e),o=document.createElement("label");o.setAttribute("for",i),o.addEventListener("click",t);const s=document.createElement("input");s.setAttribute("type","radio"),s.setAttribute("name","payment-option"),s.setAttribute("id",i),s.setAttribute("value",i),o.appendChild(s);const a=document.createElement("span");a.innerText=n,o.appendChild(a),this.element.appendChild(o)}createCardLabel({data:{suffix:t}}){return`****${t}`}}var O,B;!function(t){t.CARD="card",t.GOOGLE_PAY="googlePay",t.PAYPAL="payPal",t.APPLE_PAY="applePay"}(O||(O={})),function(t){t.ENABLED="enabled",t.CREATED="created"}(B||(B={}));class z{constructor(t){this.executionResponse=t}get lookup(){return this.executionResponse.initialResults.find((({body:{name:t}})=>"lookup"===t))}get holderReference(){return this.executionResponse.holderReference}get savedCreditCards(){const t=this.availablePaymentMethods.find((({paymentMethodCode:t})=>t===O.CARD));return(null==t?void 0:t.paymentInstruments)||[]}get paypalConfig(){const t=this.availablePaymentMethods.find((({paymentMethodCode:t})=>t===O.PAYPAL));if(!t)throw new Error("trying to initialize paypal without config");return t.config}get googlePayConfig(){const t=this.availablePaymentMethods.find((({paymentMethodCode:t})=>t===O.GOOGLE_PAY));if(!t)throw new Error("trying to initialize google pay without config");return t?[t.config]:[]}get applePayConfig(){const t=this.availablePaymentMethods.find((({paymentMethodCode:t})=>t===O.APPLE_PAY));if(!t)throw new Error("apple pay config not found");return t.config.parameters}get url(){return this.response.links.self}get response(){return this.executionResponse}get meta(){return this.executionResponse.meta}get availablePaymentMethods(){var t;return(null===(t=this.lookup)||void 0===t?void 0:t.body.data.paymentCompositionOptions)||[]}get authorizeLink(){var t;return null===(t=this.lookup)||void 0===t?void 0:t.body.links.authorize.href}get createSessionLink(){return this.response.links.startPaymentSession.href}}class F extends m{constructor(t,e,i){var n;super("button",{id:"payrails-card-payment-button"}),this.sdkConfig=t,this.execution=e,this.options=i,this.selectedCard=null,this.storeInstrument=!1,this.element.innerText=(null===(n=null==i?void 0:i.translations)||void 0===n?void 0:n.label)||"Pay",this.element.addEventListener("click",this.onPay.bind(this)),this.element.addEventListener("mouseenter",(()=>{var t;this.element.classList.contains("disabled")||(this.element.classList.add("hover"),this.setStyles((null===(t=this.options.styles)||void 0===t?void 0:t.hover)||{}))})),this.element.addEventListener("mouseleave",(()=>{var t;this.element.classList.contains("disabled")||(this.element.classList.remove("hover"),this.removeStyles((null===(t=this.options.styles)||void 0===t?void 0:t.hover)||{}))})),this.paymentExecutor=new p(this.sdkConfig,this.execution)}setDisabled(t){var e,i,n;this.element.disabled=t,t?(this.element.classList.add("disabled"),(null===(e=this.options.styles)||void 0===e?void 0:e.disabled)&&this.setStyles(this.options.styles.disabled)):(this.element.classList.remove("disabled"),this.removeStyles((null===(i=this.options.styles)||void 0===i?void 0:i.disabled)||{}),(null===(n=this.options.styles)||void 0===n?void 0:n.base)&&this.setStyles(this.options.styles.base))}setStyles(t){var e;const i=Object.assign(Object.assign({},null===(e=this.options.styles)||void 0===e?void 0:e.base),t);Object.keys(i).forEach((t=>{this.element.style[t]=i[t]}))}removeStyles(t){var e;const i=Object.keys((null===(e=this.options.styles)||void 0===e?void 0:e.base)||{});Object.keys(t).forEach((t=>{var e,n;i.includes(t)?this.element.style[t]=null===(n=null===(e=this.options.styles)||void 0===e?void 0:e.base)||void 0===n?void 0:n[t]:this.element.style[t]=""}))}setLabel(t){this.element.innerText=t}setCardForm(t){this.cardForm=t}triggerLoading(t){var e,i,n,o;const s=this.element.offsetWidth;this.element.style.minWidth=`${s}px`,t?(this.element.innerHTML='<div class="dot-flashing"></div>',this.element.classList.add("loading"),(null===(e=this.options.styles)||void 0===e?void 0:e.loading)&&this.setStyles(this.options.styles.loading)):(this.element.innerText=(null===(n=null===(i=this.options)||void 0===i?void 0:i.translations)||void 0===n?void 0:n.label)||"Pay",this.element.classList.remove("loading"),this.removeStyles((null===(o=this.options.styles)||void 0===o?void 0:o.loading)||{}))}onAuthorizationFailed(){var t,e;this.setDisabled(!1),this.triggerLoading(!1),(null===(t=this.options.events)||void 0===t?void 0:t.onAuthorizeFailed)&&(null===(e=this.options.events)||void 0===e||e.onAuthorizeFailed())}async onPay(){var t,e,i,n,o;if(this.setDisabled(!0),this.triggerLoading(!0),null===(t=this.options.events)||void 0===t?void 0:t.onPaymentButtonClicked){if(!1===await(null===(e=this.options.events)||void 0===e?void 0:e.onPaymentButtonClicked()))return void this.onAuthorizationFailed()}try{const t=[{paymentMethodCode:O.CARD,integrationType:"api",amount:this.sdkConfig.amount,storeInstrument:this.storeInstrument}];if(null===(i=this.selectedCard)||void 0===i?void 0:i.id)t[0].paymentInstrumentId=null===(n=this.selectedCard)||void 0===n?void 0:n.id;else{const e=await this.collectCardFormValues();t[0].paymentInstrumentData={vaultToken:null==e?void 0:e.instrumentId,card:{numberToken:null==e?void 0:e.card_number,securityCodeToken:null==e?void 0:e.security_code}}}const e=await this.paymentExecutor.pay(t);this.handleAuthorizationResult(e)}catch(t){t instanceof d&&(null===(o=this.options.events)||void 0===o?void 0:o.onPaymentSessionExpired)&&this.options.events.onPaymentSessionExpired(),this.onAuthorizationFailed()}}handleAuthorizationResult(t){var e,i,n;switch(null===(e=null==t?void 0:t.finalState)||void 0===e?void 0:e.code){case"authorizeSuccessful":this.triggerLoading(!1),(null===(i=this.options.events)||void 0===i?void 0:i.onAuthorizeSuccess)&&this.options.events.onAuthorizeSuccess();break;case"authorizePending":"3ds"===(null===(n=null==t?void 0:t.response)||void 0===n?void 0:n.actionRequired)&&this.handle3ds(t);break;default:this.onAuthorizationFailed()}}handle3ds(t){var e,i;const n=null===(e=null==t?void 0:t.response)||void 0===e?void 0:e.links["3ds"];if(n){const t=[[250,400],[390,400],[500,600],[600,400]],e=screen.width,o=t.reduce(((t,i)=>e>i[0]?i:t),[250,400]),s=document.createElement("iframe");s.setAttribute("id","payrails-3ds-frame"),s.setAttribute("src",n),s.setAttribute("width",o[0].toString()),s.setAttribute("height",o[1].toString());const a=document.createElement("div");a.setAttribute("id","payrails-3ds-challenge"),a.appendChild(s);const r=document.createElement("div");r.addEventListener("click",(async()=>{r.remove()})),r.setAttribute("id","payrails-3ds-popup-background"),r.appendChild(a);const l=async t=>{var e,i,n;if(t.data&&'{"type":"3DS-challenge-completed"}'===t.data){window.removeEventListener("message",l),r.remove();if(!(await this.paymentExecutor.getExecution(this.execution.url)).res.status.find((({code:t})=>"authorizeSuccessful"===t))&&(null===(e=this.options.events)||void 0===e?void 0:e.onAuthorizeFailed))return void this.onAuthorizationFailed();if(null===(i=this.options.events)||void 0===i?void 0:i.onAuthorizeSuccess)return void(null===(n=this.options.events)||void 0===n||n.onAuthorizeSuccess())}};null===(i=document.querySelector("body"))||void 0===i||i.appendChild(r),window.addEventListener("message",l),a.style.width=`${o[0]+4}px`,a.style.height=`${o[1]+4}px`}}async collectCardFormValues(){if(!this.cardForm)throw new Error("Trying to collect values from non-existent card form");const{tokenizedCardData:t,storeInstrument:e}=await this.cardForm.collectValues();return this.storeInstrument=Boolean(e),t}}class L extends m{constructor(t="Authorization failed, please try again."){super("div",{id:"authorization-failed-message"}),this.element.innerText=t,this.element.innerHTML=`\n <div>\n <svg class="checkmark-cross" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 52 52">\n <circle class="checkmark-cross_circle" cx="26" cy="26" r="25" fill="none"/>\n <path class="checkmark-cross_check" fill="none" d="M14.1 14.1l23.8 23.8 m0,-23.8 l-23.8,23.8"/>\n </svg>\n </div>\n <div>${t}</div>`,this.element.addEventListener("click",(t=>{t.preventDefault(),t.stopImmediatePropagation(),t.stopPropagation(),this.unmount()}))}}class I extends m{constructor(t){var e;super("div",{id:"payrails-authorization-success-msg"}),this.element.innerHTML=`\n <div class="checkmark-wrapper">\n <svg class="checkmark" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 52 52">\n <circle class="checkmark__circle" cx="26" cy="26" r="25" fill="none"/>\n <path class="checkmark__check" fill="none" d="M14.1 27.2l7.1 7.2 16.7-16.8"/>\n </svg>\n </div>\n <div id="payrails-authorization-success">${(null===(e=null==t?void 0:t.translations)||void 0===e?void 0:e.label)||"Payment successful"}</div`}}class T extends m{constructor(t,e,i){super("div",{id:t,className:"payrails-dropin-item"}),this.events=i,this.isActive=!1;const n=`payrails-dropin-item-${t}`,o=document.createElement("label");o.setAttribute("for",n);const s=document.createElement("input");s.setAttribute("type","radio"),s.setAttribute("name","payment-option"),s.setAttribute("id",n),s.setAttribute("value",n),this.input=s,o.appendChild(s),this.label=o;const a=document.createElement("span");o.appendChild(a),a.innerText=e,this.element.appendChild(o)}get identifier(){return`payrails-dropin-item-${this.id}`}deactivate(){var t,e;this.isActive&&(this.isActive=!1,this.label.style.marginBottom="0",null===(t=this.component)||void 0===t||t.unmount(),(null===(e=this.events)||void 0===e?void 0:e.onDeactivate)&&this.events.onDeactivate())}activate(){var t,e;this.isActive||(null===(t=this.component)||void 0===t||t.mount(this.selector),this.label.style.marginBottom="8px",this.isActive=!0,(null===(e=this.events)||void 0===e?void 0:e.onActivate)&&this.events.onActivate())}}class R extends T{constructor(){super(...arguments),this.buttonShown=!1}activate(){if(!this.buttonShown)return super.activate(),void(this.buttonShown=!0);this.label.style.marginBottom="8px",this.isActive=!0,this.element.querySelector(this.component.selector).style.display="block"}deactivate(){this.isActive&&(this.isActive=!1,this.label.style.marginBottom="0",this.element.querySelector(this.component.selector).style.display="none")}mountAfterAvailable(){super.mount(`#${this.loadElementId}`)}mount(t){const e=document.querySelector(t);if(!e)throw new Error(`Element with selector "${t}" not found in in the DOM`);const i=document.createElement("div");i.setAttribute("id",this.loadElementId),i.setAttribute("style","width: 100%;"),e.appendChild(i)}unmount(){var t;super.unmount(),null===(t=document.querySelector(`#${this.loadElementId}`))||void 0===t||t.remove()}}class j extends R{constructor(t,e,i){var n;super("apple-pay-dropin",(null===(n=i.translations)||void 0===n?void 0:n.label)||"Apple Pay"),this.loadElementId="apple-pay-dropin-load-element",this.component=new y(t,e,Object.assign(Object.assign({},i),{events:{onApplePayAvailable:()=>{this.mountAfterAvailable()}}}))}mount(t){const e=document.querySelector(t);if(!e)throw new Error(`Element with selector "${t}" not found in in the DOM`);const i=document.createElement("div");i.setAttribute("id",this.loadElementId),i.setAttribute("style","width: 100%;"),e.appendChild(i)}}class D extends T{constructor(t,e){super("payrails-credit-card-wrapper","Card"),this.cardForm=t,this.paymentButton=e,this.cardFormShown=!1,this.component=new M(t,e)}activate(){var t,e;this.label.style.marginBottom="8px",this.cardFormShown||(this.cardFormShown=!0,null===(t=this.component)||void 0===t||t.mount(this.selector)),this.isActive||(this.paymentButton.selectedCard=null,this.paymentButton.mount(this.selector),this.paymentButton.setDisabled(!this.cardForm.isValid),this.paymentButton.mount("#payrails-card-form"),this.input.checked=!0,this.cardForm.show(),this.isActive=!0,(null===(e=this.events)||void 0===e?void 0:e.onActivate)&&this.events.onActivate())}deactivate(){var t;this.isActive&&(this.label.style.marginBottom="0",this.paymentButton.unmount(),this.cardForm.hide(),this.isActive=!1,(null===(t=this.events)||void 0===t?void 0:t.onDeactivate)&&this.events.onDeactivate())}}class M extends m{constructor(t,e){super("div",{id:"payrails-form-container"}),this.subElements.push(t,e)}}const N={apiVersion:2,apiVersionMinor:0};class $ extends m{constructor(t,e,i){super("div",{id:"payrails-google-pay-button"}),this.sdkConfig=t,this.execution=e,this.options=i,this.googleButton=null,this.paymentExecutor=new p(t,e),this.loadScript=new v((async()=>{const t=document.createElement("script");return t.src="https://pay.google.com/gp/p/js/pay.js",new Promise(((e,i)=>{t.onload=()=>{const t=new google.payments.api.PaymentsClient({environment:this.options.environment||"TEST"}),n=Object.assign(Object.assign({},N),{allowedPaymentMethods:this.execution.googlePayConfig});t.isReadyToPay(n).then((n=>{var o,s,a;n?(null===(a=null===(s=null===(o=this.options)||void 0===o?void 0:o.events)||void 0===s?void 0:s.onGooglePayAvailable)||void 0===a||a.call(s),e(t)):i()}),i)},t.onerror=()=>{i()},document.body.appendChild(t)}))}))}async sdkLoaded(t){var e,i,n,o,s,a,r,l;try{const d=(null===(i=null===(e=this.options)||void 0===e?void 0:e.styles)||void 0===i?void 0:i.buttonColor)||"black",u=(null===(o=null===(n=this.options)||void 0===n?void 0:n.styles)||void 0===o?void 0:o.buttonType)||"long",c=(null===(a=null===(s=this.options)||void 0===s?void 0:s.styles)||void 0===a?void 0:a.buttonSizeMode)||"fill",h=(null===(l=null===(r=this.options)||void 0===r?void 0:r.styles)||void 0===l?void 0:l.buttonLocale)||void 0;return this.googleButton=t.createButton({buttonColor:d,buttonType:u,buttonSizeMode:c,buttonLocale:h,onClick:async()=>{var t,e,i;if(null===(e=null===(t=this.options)||void 0===t?void 0:t.events)||void 0===e?void 0:e.onPaymentButtonClicked){if(!await(null===(i=this.options)||void 0===i?void 0:i.events.onPaymentButtonClicked()))return}await this.onPaymentButtonClicked()},allowedPaymentMethods:this.execution.googlePayConfig}),this.element.appendChild(this.googleButton),this.googleButton}catch(t){throw console.error("Google pay can not be initialized",t),new Error(t.message)}}async onLoadPaymentData(t){var e,i,n,o;const s=[{paymentMethodCode:"googlePay",integrationType:"api",paymentInstrumentData:{paymentToken:t.paymentMethodData.tokenizationData.token},amount:this.sdkConfig.amount}],a=await this.paymentExecutor.pay(s);(null===(i=null===(e=this.options)||void 0===e?void 0:e.events)||void 0===i?void 0:i.onAuthorizeSuccess)&&(null===(o=null===(n=this.options)||void 0===n?void 0:n.events)||void 0===o||o.onAuthorizeSuccess(a))}async onPaymentButtonClicked(){var t,e,i,n,o;const s=Object.assign({},N);s.allowedPaymentMethods=this.execution.googlePayConfig,s.transactionInfo={totalPriceStatus:"FINAL",totalPrice:null===(t=this.sdkConfig.amount)||void 0===t?void 0:t.value,currencyCode:null===(e=this.sdkConfig.amount)||void 0===e?void 0:e.currency,countryCode:null===(o=null===(n=null===(i=this.execution.meta)||void 0===i?void 0:i.customer)||void 0===n?void 0:n.country)||void 0===o?void 0:o.code};(await this.loadScript.loader).loadPaymentData(s).then((t=>{this.onLoadPaymentData(t)})).catch((t=>{var e,i,n;(null===(i=null===(e=this.options)||void 0===e?void 0:e.events)||void 0===i?void 0:i.onAuthorizeFailed)&&(null===(n=this.options)||void 0===n||n.events.onAuthorizeFailed(t))}))}mount(t){super.mount(t),(async()=>{try{const t=await this.loadScript.loader,e=await this.sdkLoaded(t);this.element.appendChild(e)}catch(t){}})()}unmount(){var t;this.googleButton&&(null===(t=this.googleButton.parentElement)||void 0===t||t.removeChild(this.googleButton)),super.unmount()}}class U extends R{constructor(t,e,i){var n;super("google-pay-dropin",(null===(n=i.translations)||void 0===n?void 0:n.label)||"Google Pay"),this.loadElementId="google-pay-dropin-load-element",this.component=new $(t,e,Object.assign(Object.assign({},i),{events:Object.assign(Object.assign({},i.events),{onGooglePayAvailable:()=>{this.mountAfterAvailable()}})}))}mount(t){const e=document.querySelector(t);if(!e)throw new Error(`Element with selector "${t}" not found in in the DOM`);const i=document.createElement("div");i.setAttribute("id",this.loadElementId),i.setAttribute("style","width: 100%;"),e.appendChild(i)}}
2
2
  /*!
3
3
  * paypal-js v5.1.4 (2022-11-29T23:08:21.847Z)
4
4
  * Copyright 2020-present, PayPal, Inc. All rights reserved.
@@ -14,4 +14,4 @@
14
14
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
15
15
  * See the License for the specific language governing permissions and
16
16
  * limitations under the License.
17
- */function $(t){var e="https://www.paypal.com/sdk/js";t.sdkBaseURL&&(e=t.sdkBaseURL,delete t.sdkBaseURL),function(t){var e=t["merchant-id"],i=t["data-merchant-id"],o="",n="";Array.isArray(e)?e.length>1?(o="*",n=e.toString()):o=e.toString():"string"==typeof e&&e.length>0?o=e:"string"==typeof i&&i.length>0&&(o="*",n=i);t["merchant-id"]=o,t["data-merchant-id"]=n}(t);var i=Object.keys(t).filter((function(e){return void 0!==t[e]&&null!==t[e]&&""!==t[e]})).reduce((function(e,i){var o=t[i].toString();return"data-"===i.substring(0,5)?e.dataAttributes[i]=o:e.queryParams[i]=o,e}),{queryParams:{},dataAttributes:{}}),o=i.queryParams,n=i.dataAttributes;return{url:"".concat(e,"?").concat(V(o)),dataAttributes:n}}function V(t){var e="";return Object.keys(t).forEach((function(i){0!==e.length&&(e+="&"),e+=i+"="+t[i]})),e}function U(t,e){void 0===e&&(e={});var i=document.createElement("script");return i.src=t,Object.keys(e).forEach((function(t){i.setAttribute(t,e[t]),"data-csp-nonce"===t&&i.setAttribute("nonce",e["data-csp-nonce"])})),i}function q(t,e){if(void 0===e&&(e=H()),Y(t,e),"undefined"==typeof window)return e.resolve(null);var i=$(t),o=i.url,n=i.dataAttributes,s=n["data-namespace"]||"paypal",a=G(s);return function(t,e){var i=document.querySelector('script[src="'.concat(t,'"]'));if(null===i)return null;var o=U(t,e),n=i.cloneNode();if(delete n.dataset.uidAuto,Object.keys(n.dataset).length!==Object.keys(o.dataset).length)return null;var s=!0;return Object.keys(n.dataset).forEach((function(t){n.dataset[t]!==o.dataset[t]&&(s=!1)})),s?i:null}(o,n)&&a?e.resolve(a):function(t,e){void 0===e&&(e=H());Y(t,e);var i=t.url,o=t.attributes;if("string"!=typeof i||0===i.length)throw new Error("Invalid url.");if(void 0!==o&&"object"!=typeof o)throw new Error("Expected attributes to be an object.");return new e((function(t,e){if("undefined"==typeof window)return t();!function(t){var e=t.url,i=t.attributes,o=t.onSuccess,n=t.onError,s=U(e,i);s.onerror=n,s.onload=o,document.head.insertBefore(s,document.head.firstElementChild)}({url:i,attributes:o,onSuccess:function(){return t()},onError:function(){var t=new Error('The script "'.concat(i,'" failed to load.'));return window.fetch?fetch(i).then((function(i){return 200===i.status&&e(t),i.text()})).then((function(t){var i=function(t){var e=t.split("/* Original Error:")[1];return e?e.replace(/\n/g,"").replace("*/","").trim():t}(t);e(new Error(i))})).catch((function(t){e(t)})):e(t)}})}))}({url:o,attributes:n},e).then((function(){var t=G(s);if(t)return t;throw new Error("The window.".concat(s," global variable is not available."))}))}function H(){if("undefined"==typeof Promise)throw new Error("Promise is undefined. To resolve the issue, use a Promise polyfill.");return Promise}function G(t){return window[t]}function Y(t,e){if("object"!=typeof t||null===t)throw new Error("Expected an options object.");if(void 0!==e&&"function"!=typeof e)throw new Error("Expected PromisePonyfill to be a function.")}class X extends e{constructor(t,e,i){super("div",{id:"payrails-paypal-button"}),this.sdkConfig=t,this.execution=e,this.options=i,this.paypalLoader=null,this.createOrder=async()=>{var t,e,i,o,n,s,a;const r=[{paymentMethodCode:"payPal",integrationType:"api",amount:this.sdkConfig.amount,paymentInstrumentData:{providerData:{merchantId:this.execution.paypalConfig.merchantId}},savePaymentInstrument:!1}],l=await this.paymentExecutor.pay(r),d=null===(i=null===(e=null===(t=l.response.links.confirm)||void 0===t?void 0:t.action)||void 0===e?void 0:e.parameters)||void 0===i?void 0:i.orderId;if(!d)throw null===(s=null===(n=null===(o=this.options)||void 0===o?void 0:o.events)||void 0===n?void 0:n.onAuthorizeFailed)||void 0===s||s.call(n),new J("No order id returned");return this.confirmLink=null===(a=l.response.links.confirm)||void 0===a?void 0:a.href,d},this.paymentExecutor=new P(t,e),this.paypalLoader=new I(this.loadPaypal.bind(this))}async loadPaypal(){const t=this.execution.paypalConfig,e=await q({"client-id":t.clientId,components:"buttons,funding-eligibility",intent:"authorize",currency:this.sdkConfig.amount.currency});if(e){return await this.createPaypalButton(e)}throw new Error("Paypal not available")}async createPaypalButton(t){var e,i,o,n,s,a,r,l,d,u,c,h,v;if(!t.Buttons)throw new Error("Paypal button not available");const p=await t.Buttons({fundingSource:"paypal",style:{color:(null===(i=null===(e=this.options)||void 0===e?void 0:e.styles)||void 0===i?void 0:i.color)||"gold",height:(null===(n=null===(o=this.options)||void 0===o?void 0:o.styles)||void 0===n?void 0:n.height)||40,label:(null===(a=null===(s=this.options)||void 0===s?void 0:s.styles)||void 0===a?void 0:a.label)||"paypal",shape:(null===(l=null===(r=this.options)||void 0===r?void 0:r.styles)||void 0===l?void 0:l.shape)||"rect",tagline:(null===(u=null===(d=this.options)||void 0===d?void 0:d.styles)||void 0===u?void 0:u.tagline)||!1},createOrder:this.createOrder.bind(this),onApprove:this.onApprove.bind(this),onError:t=>{var e,i;(null===(i=null===(e=this.options)||void 0===e?void 0:e.events)||void 0===i?void 0:i.onAuthorizeFailed)&&this.options.events.onAuthorizeFailed(t)},onClick:async(t,e)=>{var i,o;if(null===(o=null===(i=this.options)||void 0===i?void 0:i.events)||void 0===o?void 0:o.onPaymentButtonClicked){return await this.options.events.onPaymentButtonClicked()?e.resolve():e.reject()}}});return p.isEligible()?(null===(v=null===(h=null===(c=this.options)||void 0===c?void 0:c.events)||void 0===h?void 0:h.onPaypalAvailable)||void 0===v||v.call(h),p):null}async onApprove(){var t,e,i,o,n,s,a;if(!this.confirmLink)throw new J("No confirm link");"authorizeSuccessful"===(null===(t=(await this.paymentExecutor.confirm(this.confirmLink)).finalState)||void 0===t?void 0:t.code)?null===(o=null===(i=null===(e=this.options)||void 0===e?void 0:e.events)||void 0===i?void 0:i.onAuthorizeSuccess)||void 0===o||o.call(i):null===(a=null===(s=null===(n=this.options)||void 0===n?void 0:n.events)||void 0===s?void 0:s.onAuthorizeFailed)||void 0===a||a.call(s)}mount(t){super.mount(t),(async()=>{this.paypalLoader||(this.paypalLoader=new I(this.loadPaypal.bind(this)));const t=await this.paypalLoader.loader;try{await(null==t?void 0:t.render("#payrails-paypal-button"))}catch(t){throw new W(t.message)}})()}unmount(){var t;null===(t=this.button)||void 0===t||t.close(),this.paypalLoader=null,super.unmount()}}class J extends Error{constructor(t){super(`PaypalOrderError: ${t}`),this.name="PaypalOrderError"}}class W extends Error{constructor(t){super(`PaypalButtonError: ${t}`),this.name="PaypalButtonError"}}class K extends M{constructor(t,e,i){var o;super("payrails-paypal-button-dropin",(null===(o=null==i?void 0:i.translations)||void 0===o?void 0:o.label)||"PayPal"),this.loadElementId="paypal-dropin-load-element",this.component=new X(t,e,Object.assign(Object.assign({},i),{events:Object.assign(Object.assign({},null==i?void 0:i.events),{onPaypalAvailable:()=>{this.mountAfterAvailable()}})}))}}class Q extends z{constructor(t,e,i){super(`card-${t.id}`,`****${t.data.suffix}`,{onActivate:()=>{i(t),this.component.setDisabled(!1)}}),this.component=e}}class Z extends e{constructor(t,e,i,o){var n,s;super("fieldset",{id:"payrails-dropin-component"}),this.collectContainer=t,this.dropinConfig=e,this.execution=i,this.sdkConfig=o;const a=!1===(null===(s=null===(n=this.dropinConfig.paymentMethodsConfiguration)||void 0===n?void 0:n.cards)||void 0===s?void 0:s.showExistingCards),r=new Map;this.execution.availablePaymentMethods.forEach((({paymentMethodCode:t})=>{if(t===_.CARD)a||this.execution.savedCreditCards.forEach((t=>{var e;this.cardPaymentButton=this.createCardPaymentButton(null===(e=this.dropinConfig.translations)||void 0===e?void 0:e.cardPaymentButton);const i=new Q(t,this.cardPaymentButton,(t=>{this.cardPaymentButton&&(this.cardPaymentButton.selectedCard=t)}));r.set(i.identifier,i)}))})),this.execution.availablePaymentMethods.forEach((({paymentMethodCode:t})=>{var e,i;switch(t){case _.PAYPAL:this.paypal=new K(this.sdkConfig,this.execution,{events:{onAuthorizeSuccess:this.onAuthorizeSuccess.bind(this),onAuthorizeFailed:this.onAuthorizeFailed.bind(this)}}),r.set(this.paypal.identifier,this.paypal);break;case _.CARD:this.creditCard=new R(this.createCardForm(),this.createCardPaymentButton(null===(e=this.dropinConfig.translations)||void 0===e?void 0:e.cardPaymentButton)),r.set(this.creditCard.identifier,this.creditCard);break;case _.GOOGLE_PAY:this.googlePay=new N(this.sdkConfig,this.execution,{events:{onAuthorizeSuccess:t=>{var e;if(t)if("authorizeSuccessful"===(null===(e=null==t?void 0:t.finalState)||void 0===e?void 0:e.code))this.onAuthorizeSuccess();else this.onAuthorizeFailed()},onAuthorizeFailed:this.onAuthorizeFailed.bind(this),onPaymentButtonClicked:this.dropinConfig.events.onPaymentButtonClicked},styles:null===(i=this.dropinConfig.styles)||void 0===i?void 0:i.googlePayButton}),r.set(this.googlePay.identifier,this.googlePay)}})),this.element.addEventListener("change",(t=>{var e,i;const o=(null===(e=null==t?void 0:t.target)||void 0===e?void 0:e.value)||"";r.forEach((t=>{t.deactivate()})),null===(i=r.get(o))||void 0===i||i.activate()})),this.subElements.push(...Array.from(r.values()))}createCardForm(){var t,e;if(!this.cardForm){const i=null===(t=this.dropinConfig.paymentMethodsConfiguration)||void 0===t?void 0:t.cards,o=Boolean(null==i?void 0:i.showStoreInstrumentCheckbox),n=Boolean(null==i?void 0:i.showCardHolderName),s=Boolean(null==i?void 0:i.alwaysStoreInstrument);this.cardForm=new d(this.collectContainer,{showStoreInstrumentCheckbox:o,showCardHolderName:n,alwaysStoreInstrument:s,translations:null===(e=this.dropinConfig.translations)||void 0===e?void 0:e.cardForm,events:{onFocus:()=>{var t;null===(t=this.creditCard)||void 0===t||t.activate()},onChange:({isValid:t})=>{var e;null===(e=this.cardPaymentButton)||void 0===e||e.setDisabled(!t)},onSaveInstrumentCheckboxChanged:t=>{this.dropinConfig.events.onSaveInstrumentCheckboxChanged&&this.dropinConfig.events.onSaveInstrumentCheckboxChanged(t)}}})}return this.cardPaymentButton&&this.cardPaymentButton.setCardForm(this.cardForm),this.cardForm}createCardPaymentButton(t){return this.cardPaymentButton||(this.cardPaymentButton=new B(this.sdkConfig,this.execution,{translations:t,events:{onAuthorizeSuccess:this.onAuthorizeSuccess.bind(this),onAuthorizeFailed:this.onAuthorizeFailed.bind(this),onPaymentButtonClicked:this.dropinConfig.events.onPaymentButtonClicked}})),this.cardForm&&this.cardPaymentButton.setCardForm(this.cardForm),this.cardPaymentButton}onAuthorizeSuccess(){var t,e,i,o;this.subElements.forEach((t=>t.unmount())),new L({translations:{label:null===(i=null===(e=null===(t=this.dropinConfig)||void 0===t?void 0:t.translations)||void 0===e?void 0:e.paymentResult)||void 0===i?void 0:i.success}}).mount(this.selector),(null===(o=this.dropinConfig.events)||void 0===o?void 0:o.onAuthorizeSuccess)&&this.dropinConfig.events.onAuthorizeSuccess()}onAuthorizeFailed(){var t,e,i;new F(null===(e=null===(t=this.dropinConfig.translations)||void 0===t?void 0:t.paymentResult)||void 0===e?void 0:e.fail).mount(this.selector),this.dropinConfig.events.onAuthorizeFailed&&(null===(i=this.dropinConfig.events)||void 0===i||i.onAuthorizeFailed())}}var tt=require("skyflow-js").default;class et{constructor(t,e){this.__container=t.container(tt.ContainerType.COMPOSABLE,e)}get elementToFieldMap(){return new Map([[exports.ElementType.CARD_NUMBER,"card_number"],[exports.ElementType.CARDHOLDER_NAME,"cardholder_name"],[exports.ElementType.CVV,"security_code"],[exports.ElementType.EXPIRATION_MONTH,"expiry_month"],[exports.ElementType.EXPIRATION_YEAR,"expiry_year"]])}createCollectElement(t){return this.__container.create(Object.assign({table:"cards",labelStyles:{},errorTextStyles:{},column:this.elementToFieldMap.get(t.type)},t),{format:t.format})}mount(t){const e="payrails-container-wrapper";this.element=document.createElement("span"),this.element.setAttribute("id",e);const i=document.querySelector(t);if(!i)throw new Error(`Element with selector ${t} does not exist`);i.appendChild(this.element),window.setTimeout((()=>{this.__container.mount(`#${e}`)}),50)}unmount(){this.element&&this.element.remove()}async collect(){const{records:t}=await this.__container.collect(),{skyflow_id:e,card_number:i,cardholder_name:o,expiry_month:n,expiry_year:s,security_code:a}=t[0].fields;return{instrumentId:e,card_number:i,cardholder_name:o,expiry_month:n,expiry_year:s,security_code:a}}}var it=require("skyflow-js").default;class ot{static init(t,e){const i=JSON.parse(atob(t.data)),{vaultConfiguration:{vaultId:o,vaultUrl:n,token:s},execution:a}=i,r=it.init({vaultID:o,vaultURL:n,getBearerToken:()=>Promise.resolve(s)});return new ot(i,r,new O(a),e)}update(t){this.sdkConfiguration.amount=t}collectContainer(t){if(!t.layout)throw new Error("Layout configuration is required");return this.__container=new et(this.vaultClient,t),this.__container}googlePayButton(t){var e;if(!this.execution)throw new Error("SDK was not initialized with workflow execution");return new D(this.sdkConfiguration,this.execution,Object.assign({environment:null===(e=this.options)||void 0===e?void 0:e.environment},t))}cardList(t){return this.__cardList||(this.__cardList=new h(this.execution,{onCardChange:e=>{this.__cardPaymentButton&&(this.__cardPaymentButton.selectedCard=e,this.__cardPaymentButton.setDisabled(!1)),null==t||t.onCardChange(e)}})),this.__cardList}cardForm(t){var e,i;if(!this.__cardForm){const o=this.getContainerLayout(null==t?void 0:t.showCardHolderName);this.__container=this.collectContainer(Object.assign(Object.assign({layout:o,errorTextStyles:{base:{display:"none"}}},null===(e=null==t?void 0:t.styles)||void 0===e?void 0:e.errorTextStyles),{styles:{base:null===(i=null==t?void 0:t.styles)||void 0===i?void 0:i.base}})),this.__cardForm=new d(this.__container,Object.assign(Object.assign({},t),{events:Object.assign(Object.assign({},null==t?void 0:t.events),{onChange:e=>{var i;this.__cardPaymentButton&&(this.__cardPaymentButton.selectedCard=null,this.__cardForm&&this.__cardPaymentButton.setDisabled(!this.__cardForm.isValid)),(null===(i=null==t?void 0:t.events)||void 0===i?void 0:i.onChange)&&t.events.onChange(e)},onFocus:()=>{var e;this.__cardList&&this.__cardList.reset(),this.__cardPaymentButton&&(this.__cardPaymentButton.selectedCard=null,this.__cardForm&&this.__cardPaymentButton.setDisabled(!this.__cardForm.isValid)),(null===(e=null==t?void 0:t.events)||void 0===e?void 0:e.onFocus)&&t.events.onFocus()}})}))}return this.__cardPaymentButton&&this.__cardPaymentButton.setCardForm(this.__cardForm),this.__cardForm}constructor(t,e,i,o){var n;this.sdkConfiguration=t,this.vaultClient=e,this.execution=i,this.options=o,(null===(n=null==o?void 0:o.events)||void 0===n?void 0:n.onClientInitialized)&&o.events.onClientInitialized(this.execution)}dropin(t){var e,i;const o=this.getContainerLayout(null===(i=null===(e=t.paymentMethodsConfiguration)||void 0===e?void 0:e.cards)||void 0===i?void 0:i.showCardHolderName);return this.__container=this.collectContainer({layout:o,errorTextStyles:{base:{display:"none"}}}),new Z(this.__container,t,this.execution,this.sdkConfiguration)}getContainerLayout(t){return t?[1,1,3]:[1,3]}paymentButton(t){return this.__cardPaymentButton||(this.__cardPaymentButton=new B(this.sdkConfiguration,this.execution,t)),this.__cardPaymentButton.setDisabled(!0),this.__cardForm&&this.__cardPaymentButton.setCardForm(this.__cardForm),this.__cardPaymentButton}paypalButton(t){return new X(this.sdkConfiguration,this.execution,t)}}exports.Payrails=ot}();
17
+ */function V(t){var e="https://www.paypal.com/sdk/js";t.sdkBaseURL&&(e=t.sdkBaseURL,delete t.sdkBaseURL),function(t){var e=t["merchant-id"],i=t["data-merchant-id"],n="",o="";Array.isArray(e)?e.length>1?(n="*",o=e.toString()):n=e.toString():"string"==typeof e&&e.length>0?n=e:"string"==typeof i&&i.length>0&&(n="*",o=i);t["merchant-id"]=n,t["data-merchant-id"]=o}(t);var i=Object.keys(t).filter((function(e){return void 0!==t[e]&&null!==t[e]&&""!==t[e]})).reduce((function(e,i){var n=t[i].toString();return"data-"===i.substring(0,5)?e.dataAttributes[i]=n:e.queryParams[i]=n,e}),{queryParams:{},dataAttributes:{}}),n=i.queryParams,o=i.dataAttributes;return{url:"".concat(e,"?").concat(q(n)),dataAttributes:o}}function q(t){var e="";return Object.keys(t).forEach((function(i){0!==e.length&&(e+="&"),e+=i+"="+t[i]})),e}function H(t,e){void 0===e&&(e={});var i=document.createElement("script");return i.src=t,Object.keys(e).forEach((function(t){i.setAttribute(t,e[t]),"data-csp-nonce"===t&&i.setAttribute("nonce",e["data-csp-nonce"])})),i}function Y(t,e){if(void 0===e&&(e=G()),J(t,e),"undefined"==typeof window)return e.resolve(null);var i=V(t),n=i.url,o=i.dataAttributes,s=o["data-namespace"]||"paypal",a=X(s);return function(t,e){var i=document.querySelector('script[src="'.concat(t,'"]'));if(null===i)return null;var n=H(t,e),o=i.cloneNode();if(delete o.dataset.uidAuto,Object.keys(o.dataset).length!==Object.keys(n.dataset).length)return null;var s=!0;return Object.keys(o.dataset).forEach((function(t){o.dataset[t]!==n.dataset[t]&&(s=!1)})),s?i:null}(n,o)&&a?e.resolve(a):function(t,e){void 0===e&&(e=G());J(t,e);var i=t.url,n=t.attributes;if("string"!=typeof i||0===i.length)throw new Error("Invalid url.");if(void 0!==n&&"object"!=typeof n)throw new Error("Expected attributes to be an object.");return new e((function(t,e){if("undefined"==typeof window)return t();!function(t){var e=t.url,i=t.attributes,n=t.onSuccess,o=t.onError,s=H(e,i);s.onerror=o,s.onload=n,document.head.insertBefore(s,document.head.firstElementChild)}({url:i,attributes:n,onSuccess:function(){return t()},onError:function(){var t=new Error('The script "'.concat(i,'" failed to load.'));return window.fetch?fetch(i).then((function(i){return 200===i.status&&e(t),i.text()})).then((function(t){var i=function(t){var e=t.split("/* Original Error:")[1];return e?e.replace(/\n/g,"").replace("*/","").trim():t}(t);e(new Error(i))})).catch((function(t){e(t)})):e(t)}})}))}({url:n,attributes:o},e).then((function(){var t=X(s);if(t)return t;throw new Error("The window.".concat(s," global variable is not available."))}))}function G(){if("undefined"==typeof Promise)throw new Error("Promise is undefined. To resolve the issue, use a Promise polyfill.");return Promise}function X(t){return window[t]}function J(t,e){if("object"!=typeof t||null===t)throw new Error("Expected an options object.");if(void 0!==e&&"function"!=typeof e)throw new Error("Expected PromisePonyfill to be a function.")}class W extends m{constructor(t,e,i){super("div",{id:"payrails-paypal-button"}),this.sdkConfig=t,this.execution=e,this.options=i,this.paypalLoader=null,this.createOrder=async()=>{var t,e,i,n,o,s,a;const r=[{paymentMethodCode:"payPal",integrationType:"api",amount:this.sdkConfig.amount,paymentInstrumentData:{providerData:{merchantId:this.execution.paypalConfig.merchantId}},savePaymentInstrument:!1}],l=await this.paymentExecutor.pay(r),d=null===(i=null===(e=null===(t=l.response.links.confirm)||void 0===t?void 0:t.action)||void 0===e?void 0:e.parameters)||void 0===i?void 0:i.orderId;if(!d)throw null===(s=null===(o=null===(n=this.options)||void 0===n?void 0:n.events)||void 0===o?void 0:o.onAuthorizeFailed)||void 0===s||s.call(o),new K("No order id returned");return this.confirmLink=null===(a=l.response.links.confirm)||void 0===a?void 0:a.href,d},this.paymentExecutor=new p(t,e),this.paypalLoader=new v(this.loadPaypal.bind(this))}async loadPaypal(){const t=this.execution.paypalConfig,e=await Y({"client-id":t.clientId,components:"buttons,funding-eligibility",intent:"authorize",currency:this.sdkConfig.amount.currency});if(e){return await this.createPaypalButton(e)}throw new Error("Paypal not available")}async createPaypalButton(t){var e,i,n,o,s,a,r,l,d,u,c,h,p;if(!t.Buttons)throw new Error("Paypal button not available");const v=await t.Buttons({fundingSource:"paypal",style:{color:(null===(i=null===(e=this.options)||void 0===e?void 0:e.styles)||void 0===i?void 0:i.color)||"gold",height:(null===(o=null===(n=this.options)||void 0===n?void 0:n.styles)||void 0===o?void 0:o.height)||40,label:(null===(a=null===(s=this.options)||void 0===s?void 0:s.styles)||void 0===a?void 0:a.label)||"paypal",shape:(null===(l=null===(r=this.options)||void 0===r?void 0:r.styles)||void 0===l?void 0:l.shape)||"rect",tagline:(null===(u=null===(d=this.options)||void 0===d?void 0:d.styles)||void 0===u?void 0:u.tagline)||!1},createOrder:this.createOrder.bind(this),onApprove:this.onApprove.bind(this),onError:t=>{var e,i;(null===(i=null===(e=this.options)||void 0===e?void 0:e.events)||void 0===i?void 0:i.onAuthorizeFailed)&&this.options.events.onAuthorizeFailed(t)},onClick:async(t,e)=>{var i,n;if(null===(n=null===(i=this.options)||void 0===i?void 0:i.events)||void 0===n?void 0:n.onPaymentButtonClicked){return await this.options.events.onPaymentButtonClicked()?e.resolve():e.reject()}}});return v.isEligible()?(null===(p=null===(h=null===(c=this.options)||void 0===c?void 0:c.events)||void 0===h?void 0:h.onPaypalAvailable)||void 0===p||p.call(h),v):null}async onApprove(){var t,e,i,n,o,s,a;if(!this.confirmLink)throw new K("No confirm link");"authorizeSuccessful"===(null===(t=(await this.paymentExecutor.confirm(this.confirmLink)).finalState)||void 0===t?void 0:t.code)?null===(n=null===(i=null===(e=this.options)||void 0===e?void 0:e.events)||void 0===i?void 0:i.onAuthorizeSuccess)||void 0===n||n.call(i):null===(a=null===(s=null===(o=this.options)||void 0===o?void 0:o.events)||void 0===s?void 0:s.onAuthorizeFailed)||void 0===a||a.call(s)}mount(t){super.mount(t),(async()=>{this.paypalLoader||(this.paypalLoader=new v(this.loadPaypal.bind(this)));const t=await this.paypalLoader.loader;try{await(null==t?void 0:t.render("#payrails-paypal-button"))}catch(t){throw new Q(t.message)}})()}unmount(){var t;null===(t=this.button)||void 0===t||t.close(),this.paypalLoader=null,super.unmount()}}class K extends Error{constructor(t){super(`PaypalOrderError: ${t}`),this.name="PaypalOrderError"}}class Q extends Error{constructor(t){super(`PaypalButtonError: ${t}`),this.name="PaypalButtonError"}}class Z extends R{constructor(t,e,i){var n;super("payrails-paypal-button-dropin",(null===(n=null==i?void 0:i.translations)||void 0===n?void 0:n.label)||"PayPal"),this.loadElementId="paypal-dropin-load-element",this.component=new W(t,e,Object.assign(Object.assign({},i),{events:Object.assign(Object.assign({},null==i?void 0:i.events),{onPaypalAvailable:()=>{this.mountAfterAvailable()}})}))}}class tt extends T{constructor(t,e,i){super(`card-${t.id}`,`****${t.data.suffix}`,{onActivate:()=>{i(t),this.component.setDisabled(!1)}}),this.component=e}}class et extends m{constructor(t,e,i,n){var o,s;super("fieldset",{id:"payrails-dropin-component"}),this.collectContainer=t,this.dropinConfig=e,this.execution=i,this.sdkConfig=n;const a=!1===(null===(s=null===(o=this.dropinConfig.paymentMethodsConfiguration)||void 0===o?void 0:o.cards)||void 0===s?void 0:s.showExistingCards),r=new Map;this.execution.availablePaymentMethods.forEach((({paymentMethodCode:t})=>{if(t===O.CARD)a||this.execution.savedCreditCards.forEach((t=>{var e;this.cardPaymentButton=this.createCardPaymentButton(null===(e=this.dropinConfig.translations)||void 0===e?void 0:e.cardPaymentButton);const i=new tt(t,this.cardPaymentButton,(t=>{this.cardPaymentButton&&(this.cardPaymentButton.selectedCard=t)}));r.set(i.identifier,i)}))})),this.execution.availablePaymentMethods.forEach((({paymentMethodCode:t})=>{var e,i;switch(t){case O.PAYPAL:this.paypal=new Z(this.sdkConfig,this.execution,{events:{onAuthorizeSuccess:this.onAuthorizeSuccess.bind(this),onAuthorizeFailed:this.onAuthorizeFailed.bind(this)}}),r.set(this.paypal.identifier,this.paypal);break;case O.CARD:this.creditCard=new D(this.createCardForm(),this.createCardPaymentButton(null===(e=this.dropinConfig.translations)||void 0===e?void 0:e.cardPaymentButton)),r.set(this.creditCard.identifier,this.creditCard);break;case O.GOOGLE_PAY:this.googlePay=new U(this.sdkConfig,this.execution,{events:{onAuthorizeSuccess:t=>{var e;if(t)if("authorizeSuccessful"===(null===(e=null==t?void 0:t.finalState)||void 0===e?void 0:e.code))this.onAuthorizeSuccess();else this.onAuthorizeFailed()},onAuthorizeFailed:this.onAuthorizeFailed.bind(this),onPaymentButtonClicked:this.dropinConfig.events.onPaymentButtonClicked},styles:null===(i=this.dropinConfig.styles)||void 0===i?void 0:i.googlePayButton}),r.set(this.googlePay.identifier,this.googlePay);break;case O.APPLE_PAY:this.applePay=new j(this.sdkConfig,this.execution,{events:{onAuthorizeSuccess:t=>{var e;if(t)if("authorizeSuccessful"===(null===(e=null==t?void 0:t.finalState)||void 0===e?void 0:e.code))this.onAuthorizeSuccess();else this.onAuthorizeFailed()},onAuthorizeFailed:this.onAuthorizeFailed.bind(this),onPaymentButtonClicked:this.dropinConfig.events.onPaymentButtonClicked}}),r.set(this.applePay.identifier,this.applePay)}})),this.element.addEventListener("change",(t=>{var e,i;const n=(null===(e=null==t?void 0:t.target)||void 0===e?void 0:e.value)||"";r.forEach((t=>{t.deactivate()})),null===(i=r.get(n))||void 0===i||i.activate()})),this.subElements.push(...Array.from(r.values()))}createCardForm(){var t,e;if(!this.cardForm){const i=null===(t=this.dropinConfig.paymentMethodsConfiguration)||void 0===t?void 0:t.cards,n=Boolean(null==i?void 0:i.showStoreInstrumentCheckbox),o=Boolean(null==i?void 0:i.showCardHolderName),s=Boolean(null==i?void 0:i.alwaysStoreInstrument);this.cardForm=new E(this.collectContainer,{showStoreInstrumentCheckbox:n,showCardHolderName:o,alwaysStoreInstrument:s,translations:null===(e=this.dropinConfig.translations)||void 0===e?void 0:e.cardForm,events:{onFocus:()=>{var t;null===(t=this.creditCard)||void 0===t||t.activate()},onChange:({isValid:t})=>{var e;null===(e=this.cardPaymentButton)||void 0===e||e.setDisabled(!t)},onSaveInstrumentCheckboxChanged:t=>{this.dropinConfig.events.onSaveInstrumentCheckboxChanged&&this.dropinConfig.events.onSaveInstrumentCheckboxChanged(t)}}})}return this.cardPaymentButton&&this.cardPaymentButton.setCardForm(this.cardForm),this.cardForm}createCardPaymentButton(t){return this.cardPaymentButton||(this.cardPaymentButton=new F(this.sdkConfig,this.execution,{translations:t,events:{onAuthorizeSuccess:this.onAuthorizeSuccess.bind(this),onAuthorizeFailed:this.onAuthorizeFailed.bind(this),onPaymentButtonClicked:this.dropinConfig.events.onPaymentButtonClicked}})),this.cardForm&&this.cardPaymentButton.setCardForm(this.cardForm),this.cardPaymentButton}onAuthorizeSuccess(){var t,e,i,n;this.subElements.forEach((t=>t.unmount())),new I({translations:{label:null===(i=null===(e=null===(t=this.dropinConfig)||void 0===t?void 0:t.translations)||void 0===e?void 0:e.paymentResult)||void 0===i?void 0:i.success}}).mount(this.selector),(null===(n=this.dropinConfig.events)||void 0===n?void 0:n.onAuthorizeSuccess)&&this.dropinConfig.events.onAuthorizeSuccess()}onAuthorizeFailed(){var t,e,i;new L(null===(e=null===(t=this.dropinConfig.translations)||void 0===t?void 0:t.paymentResult)||void 0===e?void 0:e.fail).mount(this.selector),this.dropinConfig.events.onAuthorizeFailed&&(null===(i=this.dropinConfig.events)||void 0===i||i.onAuthorizeFailed())}}var it=require("skyflow-js").default;class nt{constructor(t,e){this.__container=t.container(it.ContainerType.COMPOSABLE,e)}get elementToFieldMap(){return new Map([[exports.ElementType.CARD_NUMBER,"card_number"],[exports.ElementType.CARDHOLDER_NAME,"cardholder_name"],[exports.ElementType.CVV,"security_code"],[exports.ElementType.EXPIRATION_MONTH,"expiry_month"],[exports.ElementType.EXPIRATION_YEAR,"expiry_year"]])}createCollectElement(t){return this.__container.create(Object.assign({table:"cards",labelStyles:{},errorTextStyles:{},column:this.elementToFieldMap.get(t.type)},t),{format:t.format})}mount(t){const e="payrails-container-wrapper";this.element=document.createElement("span"),this.element.setAttribute("id",e);const i=document.querySelector(t);if(!i)throw new Error(`Element with selector ${t} does not exist`);i.appendChild(this.element),window.setTimeout((()=>{this.__container.mount(`#${e}`)}),50)}unmount(){this.element&&this.element.remove()}async collect(){const{records:t}=await this.__container.collect(),{skyflow_id:e,card_number:i,cardholder_name:n,expiry_month:o,expiry_year:s,security_code:a}=t[0].fields;return{instrumentId:e,card_number:i,cardholder_name:n,expiry_month:o,expiry_year:s,security_code:a}}}var ot=require("skyflow-js").default;class st{static init(t,e){const i=JSON.parse(atob(t.data)),{vaultConfiguration:{vaultId:n,vaultUrl:o,token:s},execution:a}=i,r=ot.init({vaultID:n,vaultURL:o,getBearerToken:()=>Promise.resolve(s)});return new st(i,r,new z(a),e)}update(t){this.sdkConfiguration.amount=t}collectContainer(t){if(!t.layout)throw new Error("Layout configuration is required");return this.__container=new nt(this.vaultClient,t),this.__container}googlePayButton(t){var e;if(!this.execution)throw new Error("SDK was not initialized with workflow execution");return new $(this.sdkConfiguration,this.execution,Object.assign({environment:null===(e=this.options)||void 0===e?void 0:e.environment},t))}applePayButton(t){if(!this.execution)throw new Error("SDK was not initialized with workflow execution");return new y(this.sdkConfiguration,this.execution,t)}cardList(t){return this.__cardList||(this.__cardList=new S(this.execution,{onCardChange:e=>{this.__cardPaymentButton&&(this.__cardPaymentButton.selectedCard=e,this.__cardPaymentButton.setDisabled(!1)),null==t||t.onCardChange(e)}})),this.__cardList}cardForm(t){var e,i;if(!this.__cardForm){const n=this.getContainerLayout(null==t?void 0:t.showCardHolderName);this.__container=this.collectContainer(Object.assign(Object.assign({layout:n,errorTextStyles:{base:{display:"none"}}},null===(e=null==t?void 0:t.styles)||void 0===e?void 0:e.errorTextStyles),{styles:{base:null===(i=null==t?void 0:t.styles)||void 0===i?void 0:i.base}})),this.__cardForm=new E(this.__container,Object.assign(Object.assign({},t),{events:Object.assign(Object.assign({},null==t?void 0:t.events),{onChange:e=>{var i;this.__cardPaymentButton&&(this.__cardPaymentButton.selectedCard=null,this.__cardForm&&this.__cardPaymentButton.setDisabled(!this.__cardForm.isValid)),(null===(i=null==t?void 0:t.events)||void 0===i?void 0:i.onChange)&&t.events.onChange(e)},onFocus:()=>{var e;this.__cardList&&this.__cardList.reset(),this.__cardPaymentButton&&(this.__cardPaymentButton.selectedCard=null,this.__cardForm&&this.__cardPaymentButton.setDisabled(!this.__cardForm.isValid)),(null===(e=null==t?void 0:t.events)||void 0===e?void 0:e.onFocus)&&t.events.onFocus()}})}))}return this.__cardPaymentButton&&this.__cardPaymentButton.setCardForm(this.__cardForm),this.__cardForm}constructor(t,e,i,n){var o;this.sdkConfiguration=t,this.vaultClient=e,this.execution=i,this.options=n,(null===(o=null==n?void 0:n.events)||void 0===o?void 0:o.onClientInitialized)&&n.events.onClientInitialized(this.execution)}dropin(t){var e,i;const n=this.getContainerLayout(null===(i=null===(e=t.paymentMethodsConfiguration)||void 0===e?void 0:e.cards)||void 0===i?void 0:i.showCardHolderName);return this.__container=this.collectContainer({layout:n,errorTextStyles:{base:{display:"none"}}}),new et(this.__container,t,this.execution,this.sdkConfiguration)}getContainerLayout(t){return t?[1,1,3]:[1,3]}paymentButton(t){return this.__cardPaymentButton||(this.__cardPaymentButton=new F(this.sdkConfiguration,this.execution,t)),this.__cardPaymentButton.setDisabled(!0),this.__cardForm&&this.__cardPaymentButton.setCardForm(this.__cardForm),this.__cardPaymentButton}paypalButton(t){return new W(this.sdkConfiguration,this.execution,t)}}exports.Payrails=st}();
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@payrails/web-sdk",
3
- "version": "2.0.0",
3
+ "version": "2.1.1",
4
4
  "description": "SDK providing tokenization options on the client for merchants",
5
5
  "main": "index.js",
6
6
  "types": "payrails.d.ts",
package/payrails-styles.css CHANGED
@@ -171,7 +171,6 @@
171
171
  flex-direction: column;
172
172
  align-items: flex-start;
173
173
  padding: 24px;
174
- gap: 24px;
175
174
  position: relative;
176
175
  }
177
176
 
@@ -191,6 +190,14 @@
191
190
  min-width: none !important;
192
191
  }
193
192
 
193
+ #payrails-dropin-component > div:has(label) {
194
+ margin-bottom: 24px;
195
+ }
196
+
197
+ #payrails-dropin-component > div:has(label):last-child {
198
+ margin-bottom: 0;
199
+ }
200
+
194
201
  #payrails-dropin-component .gpay-button {
195
202
  background-color: #000;
196
203
  }
package/payrails.d.ts CHANGED
@@ -1,3 +1,4 @@
1
+ /// <reference types="applepayjs" />
1
2
  /// <reference types="googlepay" />
2
3
  import * as skyflow_js_types_core_external_collect_compose_collect_element from 'skyflow-js/types/core/external/collect/compose-collect-element';
3
4
  import Skyflow from 'skyflow-js';
@@ -142,7 +143,8 @@ interface CardFieldStyles extends LabelStyles {
142
143
  declare enum PAYMENT_METHOD_CODES {
143
144
  'CARD' = "card",
144
145
  'GOOGLE_PAY' = "googlePay",
145
- 'PAYPAL' = "payPal"
146
+ 'PAYPAL' = "payPal",
147
+ 'APPLE_PAY' = "applePay"
146
148
  }
147
149
  declare enum PAYMENT_INSTRUMENT_STATUS {
148
150
  'ENABLED' = "enabled",
@@ -187,6 +189,12 @@ declare class WorkflowExecution {
187
189
  };
188
190
  type: string;
189
191
  }[];
192
+ get applePayConfig(): {
193
+ merchantIdentifier: string;
194
+ supportedNetworks: string[];
195
+ countryCode: string;
196
+ merchantCapabilities: ApplePayJS.ApplePayMerchantCapability[];
197
+ };
190
198
  get url(): string;
191
199
  get response(): WorkflowExecutionResponse;
192
200
  get meta(): {
@@ -198,6 +206,7 @@ declare class WorkflowExecution {
198
206
  };
199
207
  get availablePaymentMethods(): (GooglePayCompositionOption | CardCompositionOption)[];
200
208
  get authorizeLink(): string | undefined;
209
+ get createSessionLink(): string;
201
210
  }
202
211
  interface WorkflowExecutionResponse {
203
212
  id: string;
@@ -232,6 +241,10 @@ interface WorkflowExecutionResponse {
232
241
  };
233
242
  }>;
234
243
  links: {
244
+ startPaymentSession: {
245
+ href: string;
246
+ method: 'POST';
247
+ };
235
248
  confirm?: {
236
249
  href: string;
237
250
  action?: {
@@ -287,6 +300,32 @@ declare class CardList extends PayrailsElement {
287
300
  reset(): void;
288
301
  }
289
302
 
303
+ interface ApplePayButtonOptions {
304
+ events?: PaymentEvents & {
305
+ onApplePayAvailable?: () => void;
306
+ };
307
+ }
308
+ declare global {
309
+ interface Window {
310
+ ApplePaySession?: ApplePaySession;
311
+ }
312
+ }
313
+ declare class ApplePayButton extends PayrailsElement {
314
+ private sdkConfig;
315
+ private execution;
316
+ private options;
317
+ private appleButton;
318
+ private loadScript;
319
+ private paymentExecutor;
320
+ constructor(sdkConfig: SdkConfiguration, execution: WorkflowExecution, options: ApplePayButtonOptions);
321
+ mount(location: string): void;
322
+ unmount(): void;
323
+ private isApplePayAvailable;
324
+ private mountApplePayButton;
325
+ private createApplePaySession;
326
+ private onApplePayAuthorized;
327
+ }
328
+
290
329
  interface GooglePayButtonOptions {
291
330
  environment?: 'TEST' | 'PRODUCTION';
292
331
  events?: PaymentEvents & {
@@ -363,6 +402,7 @@ declare class Dropin extends PayrailsElement {
363
402
  private cardPaymentButton;
364
403
  private creditCard;
365
404
  private googlePay;
405
+ private applePay;
366
406
  private cardForm;
367
407
  private paypal;
368
408
  constructor(collectContainer: CollectContainer, dropinConfig: DropinConfiguration, execution: WorkflowExecution, sdkConfig: SdkConfiguration);
@@ -420,6 +460,7 @@ declare class Payrails {
420
460
  update(amount: PayrailsAmount): void;
421
461
  collectContainer(containerOptions: CollectContainerOptions): CollectContainer;
422
462
  googlePayButton(options: GooglePayButtonOptions): GooglePayButton;
463
+ applePayButton(options: ApplePayButtonOptions): ApplePayButton;
423
464
  cardList(options?: CardListOptions): CardList;
424
465
  cardForm(options?: CardFormOptions): CardForm;
425
466
  private constructor();