JezK
Edit File: sc-payment-methods-list.js
import{proxyCustomElement,HTMLElement,h}from"@stencil/core/internal/client";import"./fetch.js";import{o as onFirstVisible}from"./lazy.js";import{d as defineCustomElement$o}from"./sc-alert2.js";import{d as defineCustomElement$n}from"./sc-block-ui2.js";import{d as defineCustomElement$m}from"./sc-button2.js";import{d as defineCustomElement$l}from"./sc-card2.js";import{d as defineCustomElement$k}from"./sc-cc-logo2.js";import{d as defineCustomElement$j}from"./sc-dashboard-module2.js";import{d as defineCustomElement$i}from"./sc-dialog2.js";import{d as defineCustomElement$h}from"./sc-divider2.js";import{d as defineCustomElement$g}from"./dropdown.js";import{d as defineCustomElement$f}from"./sc-empty2.js";import{d as defineCustomElement$e}from"./sc-flex2.js";import{d as defineCustomElement$d}from"./sc-icon2.js";import{d as defineCustomElement$c}from"./sc-menu2.js";import{d as defineCustomElement$b}from"./sc-menu-item2.js";import{d as defineCustomElement$a}from"./sc-payment-method2.js";import{d as defineCustomElement$9}from"./sc-skeleton2.js";import{d as defineCustomElement$8}from"./sc-spinner2.js";import{d as defineCustomElement$7}from"./sc-stacked-list2.js";import{d as defineCustomElement$6}from"./sc-stacked-list-row2.js";import{d as defineCustomElement$5}from"./sc-switch2.js";import{d as defineCustomElement$4}from"./sc-tag2.js";import{d as defineCustomElement$3}from"./sc-text2.js";import{d as defineCustomElement$2}from"./sc-tooltip2.js";import{a as addQueryArgs}from"./add-query-args.js";import{a as apiFetch}from"./index4.js";const scPaymentMethodsListCss=":host{display:block;position:relative}.payment-methods-list{display:grid;gap:0.5em}.payment-methods-list sc-heading a{text-decoration:none;font-weight:var(--sc-font-weight-semibold);display:inline-flex;align-items:center;gap:0.25em;color:var(--sc-color-primary-500)}.payment-id{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}",ScPaymentMethodsListStyle0=scPaymentMethodsListCss,ScPaymentMethodsList$1=proxyCustomElement(class extends HTMLElement{constructor(){super(),this.__registerHost(),this.__attachShadow(),this.query=void 0,this.heading=void 0,this.isCustomer=void 0,this.canDetachDefaultPaymentMethod=!1,this.paymentMethods=[],this.loading=void 0,this.busy=void 0,this.error=void 0,this.hasTitleSlot=void 0,this.editPaymentMethod=!1,this.deletePaymentMethod=!1,this.cascadeDefaultPaymentMethod=!1}componentWillLoad(){onFirstVisible(this.el,(()=>this.getPaymentMethods())),this.handleSlotChange()}handleSlotChange(){this.hasTitleSlot=!!this.el.querySelector('[slot="title"]')}async deleteMethod(){var e;if(this.deletePaymentMethod)try{this.busy=!0,await apiFetch({path:`surecart/v1/payment_methods/${null===(e=this.deletePaymentMethod)||void 0===e?void 0:e.id}/detach`,method:"PATCH"}),this.paymentMethods=this.paymentMethods.filter((e=>{var t;return e.id!==(null===(t=this.deletePaymentMethod)||void 0===t?void 0:t.id)})),this.deletePaymentMethod=!1}catch(e){alert((null==e?void 0:e.messsage)||wp.i18n.__("Something went wrong","surecart"))}finally{this.busy=!1}}async setDefault(){var e,t,s;if(this.editPaymentMethod){try{this.error="",this.busy=!0,await apiFetch({path:`surecart/v1/customers/${null===(t=null===(e=this.editPaymentMethod)||void 0===e?void 0:e.customer)||void 0===t?void 0:t.id}`,method:"PATCH",data:{default_payment_method:null===(s=this.editPaymentMethod)||void 0===s?void 0:s.id,cascade_default_payment_method:this.cascadeDefaultPaymentMethod}}),this.editPaymentMethod=!1}catch(e){this.error=(null==e?void 0:e.message)||wp.i18n.__("Something went wrong","surecart")}finally{this.busy=!1}try{this.busy=!0,this.paymentMethods=await apiFetch({path:addQueryArgs("surecart/v1/payment_methods/",{expand:["card","customer","billing_agreement","paypal_account","payment_instrument","bank_account"],...this.query})})}catch(e){this.error=(null==e?void 0:e.message)||wp.i18n.__("Something went wrong","surecart")}finally{this.busy=!1}}}async getPaymentMethods(){if(this.isCustomer)try{this.loading=!0,this.paymentMethods=await apiFetch({path:addQueryArgs("surecart/v1/payment_methods/",{expand:["card","customer","billing_agreement","paypal_account","payment_instrument","bank_account"],...this.query,per_page:100})})}catch(e){console.error(this.error),this.error=(null==e?void 0:e.message)||wp.i18n.__("Something went wrong","surecart")}finally{this.loading=!1}}renderLoading(){return h("sc-card",{noPadding:!0},h("sc-stacked-list",null,h("sc-stacked-list-row",{style:{"--columns":"4"},"mobile-size":500},[...Array(4)].map((()=>h("sc-skeleton",{style:{width:"100px",display:"inline-block"}}))))))}renderEmpty(){return h("div",null,h("sc-divider",{style:{"--spacing":"0"}}),h("slot",{name:"empty"},h("sc-empty",{icon:"credit-card"},wp.i18n.__("You don't have any saved payment methods.","surecart"))))}renderPaymentMethodActions(e){const{id:t,customer:s}=e;if("string"!=typeof s&&(s.default_payment_method!==t||this.canDetachDefaultPaymentMethod))return h("sc-dropdown",{placement:"bottom-end",slot:"suffix"},h("sc-icon",{role:"button",tabIndex:0,name:"more-horizontal",slot:"trigger"}),h("sc-menu",null,s.default_payment_method!==t&&h("sc-menu-item",{onClick:()=>this.editPaymentMethod=e},wp.i18n.__("Make Default","surecart")),h("sc-menu-item",{onClick:()=>this.deletePaymentMethod=e},wp.i18n.__("Delete","surecart"))))}renderList(){return this.paymentMethods.map((e=>{const{id:t,card:s,customer:a,live_mode:n,billing_agreement:o,paypal_account:i}=e;return h("sc-stacked-list-row",{style:{"--columns":o?"2":"3"}},h("sc-payment-method",{paymentMethod:e}),h("div",{class:"payment-id"},!!(null==s?void 0:s.exp_month)&&h("span",null,wp.i18n.__("Exp.","surecart"),null==s?void 0:s.exp_month,"/",null==s?void 0:s.exp_year),!!i&&(null==i?void 0:i.email)),h("sc-flex",{"justify-content":"flex-start","align-items":"center",style:{"--spacing":"0.5em",marginLeft:"auto"}},"string"!=typeof a&&(null==a?void 0:a.default_payment_method)===t&&h("sc-tag",{type:"info"},wp.i18n.__("Default","surecart")),!n&&h("sc-tag",{type:"warning"},wp.i18n.__("Test","surecart"))),this.renderPaymentMethodActions(e))}))}renderContent(){var e;return this.isCustomer?this.loading?this.renderLoading():0===(null===(e=this.paymentMethods)||void 0===e?void 0:e.length)?this.renderEmpty():h("sc-card",{"no-padding":!0},h("sc-stacked-list",null,this.renderList())):this.renderEmpty()}handleEditPaymentMethodChange(){this.cascadeDefaultPaymentMethod=!1}render(){return h("sc-dashboard-module",{key:"e92209433e067603d41ec2bd9d38e207f96908d4",class:"payment-methods-list",error:this.error},h("span",{key:"4c4d68bb058cf048b29c80a9e9687bb3e92b0947",slot:"heading"},h("slot",{key:"1e7e55cf8b86593f6087438a7eaf8bb27e8395db",name:"heading"},this.heading||wp.i18n.__("Payment Methods","surecart"))),this.isCustomer&&h("sc-flex",{key:"3acfe318bd104baa5fd06c94e507ba7aa313571c",slot:"end"},h("sc-button",{key:"c46d9d3e765b94dd7d26bd1297ca1d6e8fb813fa",type:"link",href:addQueryArgs(window.location.href,{action:"index",model:"charge"})},h("sc-icon",{key:"00270e2a2c5c4cb8d3e723c281fb837827d8e1e8",name:"clock",slot:"prefix"}),wp.i18n.__("Payment History","surecart")),h("sc-button",{key:"0c647fc31489abb3e364cf8bea7ce8b06110a0a9",type:"link",href:addQueryArgs(window.location.href,{action:"create",model:"payment_method"})},h("sc-icon",{key:"593e75c55669d2750a7ef61e2a8a1a02ead78b82",name:"plus",slot:"prefix"}),wp.i18n.__("Add","surecart"))),this.renderContent(),h("sc-dialog",{key:"882ee6772c0e561787101a3b3a0ece4d6aef57d2",open:!!this.editPaymentMethod,label:wp.i18n.__("Update Default Payment Method","surecart"),onScRequestClose:()=>this.editPaymentMethod=!1},h("sc-alert",{key:"16b0d67141bacfc6cb628cb612d367e644191529",type:"danger",open:!!this.error},this.error),h("sc-flex",{key:"2444240887770dea937ce21bf6de92e9259a6975",flexDirection:"column",style:{"--sc-flex-column-gap":"var(--sc-spacing-small)"}},h("sc-alert",{key:"b7c2dafa9f0686c1d3dadf8fdbd6701396824416",type:"info",open:!0},wp.i18n.__("A default payment method will be used as a fallback in case other payment methods get removed from a subscription.","surecart")),h("sc-switch",{key:"db5fff91e517bbc7764010db34ba289970f7b624",checked:this.cascadeDefaultPaymentMethod,onScChange:e=>this.cascadeDefaultPaymentMethod=e.target.checked},wp.i18n.__("Update All Subscriptions","surecart"),h("span",{key:"dbc1a593179f95dcf2e98036cfea8d7de7802b06",slot:"description"},wp.i18n.__("Update all existing subscriptions to use this payment method","surecart")))),h("div",{key:"6f4f58b21e7e1079a69847d4b7cffa91e3720e0a",slot:"footer"},h("sc-button",{key:"60f930412424779b8a26246cc60c68360b4767fb",type:"text",onClick:()=>this.editPaymentMethod=!1},wp.i18n.__("Cancel","surecart")),h("sc-button",{key:"d5e6d1900102d11cb73e28c71acf662e0017f388",type:"primary",onClick:()=>this.setDefault()},wp.i18n.__("Make Default","surecart"))),this.busy&&h("sc-block-ui",{key:"a809f0aba17df5cc3ee976811d25d406bdc749c9",spinner:!0})),h("sc-dialog",{key:"6c628650bbc591128e6a5dfb9d7f86d946388527",open:!!this.deletePaymentMethod,label:wp.i18n.__("Delete Payment Method","surecart"),onScRequestClose:()=>this.deletePaymentMethod=!1},h("sc-alert",{key:"8c8dfda309f1a43dbe1aaafb09eeb6c7c30775af",type:"danger",open:!!this.error},this.error),h("sc-text",{key:"9bc4429a7b45adf2bc75b0009307cf10287d1eee"},wp.i18n.__("Are you sure you want to remove this payment method?","surecart")),h("div",{key:"0cb7e02f9fbe805cdec25eb13f724fd62f83a2d4",slot:"footer"},h("sc-button",{key:"5ba26761ae3bb9ce8f1574fdc88ad49ca48df8e9",type:"text",onClick:()=>this.deletePaymentMethod=!1},wp.i18n.__("Cancel","surecart")),h("sc-button",{key:"8221a5fa04757965b6e52137145f79a20fb23807",type:"primary",onClick:()=>this.deleteMethod()},wp.i18n.__("Delete","surecart"))),this.busy&&h("sc-block-ui",{key:"e572201fdbd3e47860ab55fb1ce3eb0fff45ebe1",spinner:!0})),this.busy&&h("sc-block-ui",{key:"159176572d462ed7db6c8924b99983c18d835a44",spinner:!0}))}get el(){return this}static get watchers(){return{editPaymentMethod:["handleEditPaymentMethodChange"]}}static get style(){return ScPaymentMethodsListStyle0}},[1,"sc-payment-methods-list",{query:[16],heading:[1],isCustomer:[4,"is-customer"],canDetachDefaultPaymentMethod:[4,"can-detach-default-payment-method"],paymentMethods:[32],loading:[32],busy:[32],error:[32],hasTitleSlot:[32],editPaymentMethod:[32],deletePaymentMethod:[32],cascadeDefaultPaymentMethod:[32]},void 0,{editPaymentMethod:["handleEditPaymentMethodChange"]}]);function defineCustomElement$1(){"undefined"!=typeof customElements&&["sc-payment-methods-list","sc-alert","sc-block-ui","sc-button","sc-card","sc-cc-logo","sc-dashboard-module","sc-dialog","sc-divider","sc-dropdown","sc-empty","sc-flex","sc-icon","sc-menu","sc-menu-item","sc-payment-method","sc-skeleton","sc-spinner","sc-stacked-list","sc-stacked-list-row","sc-switch","sc-tag","sc-text","sc-tooltip"].forEach((e=>{switch(e){case"sc-payment-methods-list":customElements.get(e)||customElements.define(e,ScPaymentMethodsList$1);break;case"sc-alert":customElements.get(e)||defineCustomElement$o();break;case"sc-block-ui":customElements.get(e)||defineCustomElement$n();break;case"sc-button":customElements.get(e)||defineCustomElement$m();break;case"sc-card":customElements.get(e)||defineCustomElement$l();break;case"sc-cc-logo":customElements.get(e)||defineCustomElement$k();break;case"sc-dashboard-module":customElements.get(e)||defineCustomElement$j();break;case"sc-dialog":customElements.get(e)||defineCustomElement$i();break;case"sc-divider":customElements.get(e)||defineCustomElement$h();break;case"sc-dropdown":customElements.get(e)||defineCustomElement$g();break;case"sc-empty":customElements.get(e)||defineCustomElement$f();break;case"sc-flex":customElements.get(e)||defineCustomElement$e();break;case"sc-icon":customElements.get(e)||defineCustomElement$d();break;case"sc-menu":customElements.get(e)||defineCustomElement$c();break;case"sc-menu-item":customElements.get(e)||defineCustomElement$b();break;case"sc-payment-method":customElements.get(e)||defineCustomElement$a();break;case"sc-skeleton":customElements.get(e)||defineCustomElement$9();break;case"sc-spinner":customElements.get(e)||defineCustomElement$8();break;case"sc-stacked-list":customElements.get(e)||defineCustomElement$7();break;case"sc-stacked-list-row":customElements.get(e)||defineCustomElement$6();break;case"sc-switch":customElements.get(e)||defineCustomElement$5();break;case"sc-tag":customElements.get(e)||defineCustomElement$4();break;case"sc-text":customElements.get(e)||defineCustomElement$3();break;case"sc-tooltip":customElements.get(e)||defineCustomElement$2()}}))}const ScPaymentMethodsList=ScPaymentMethodsList$1,defineCustomElement=defineCustomElement$1;export{ScPaymentMethodsList,defineCustomElement};