@justifi/webcomponents 5.4.3 → 5.5.0

package/dist/module/justifi-payment-details.js

@@ -1,59 +1,25 @@
 import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
 import { P as PaymentService } from './payment.service.js';
-import { a as ComponentErrorSeverity, C as ComponentErrorCodes } from './ComponentError.js';
-import './Checkout.js';
-import './Pagination.js';
-import { b as Payment } from './Payment.js';
-import './SubAccount.js';
-import './Document.js';
-import { g as getErrorMessage, a as getErrorCode } from './utils4.js';
+import { m as makeGetPaymentDetails } from './get-payment-details.js';
 import { E as ErrorState } from './utils.js';
+import { C as ComponentErrorSeverity, a as ComponentErrorCodes } from './ComponentError.js';
 import { c as checkPkgVersion, J as JustifiAnalytics } from './check-pkg-version.js';
 import { d as defineCustomElement$3 } from './details.js';
 import { d as defineCustomElement$2 } from './payment-details-core2.js';
 
-const makeGetPaymentDetails = ({ id, authToken, service }) => async ({ onSuccess, onError }) => {
-    var _a;
-    try {
-        const response = await service.fetchPayment(id, authToken);
-        if (!response.error) {
-            onSuccess({ payment: new Payment(response.data) });
-        }
-        else {
-            const responseError = getErrorMessage(response.error);
-            const code = getErrorCode((_a = response.error) === null || _a === void 0 ? void 0 : _a.code);
-            onError({
-                error: responseError,
-                code,
-                severity: ComponentErrorSeverity.ERROR,
-            });
-        }
-    }
-    catch (error) {
-        const code = getErrorCode(error === null || error === void 0 ? void 0 : error.code);
-        onError({
-            error: getErrorMessage(error),
-            code,
-            severity: ComponentErrorSeverity.ERROR,
-        });
-    }
-};
-
 const PaymentDetails = /*@__PURE__*/ proxyCustomElement(class PaymentDetails extends HTMLElement {
     constructor() {
         super();
         this.__registerHost();
         this.__attachShadow();
         this.errorEvent = createEvent(this, "error-event", 7);
+        this.apiOrigin = "https://wc-proxy.justifi.ai";
+        this.errorMessage = null;
         this.paymentService = new PaymentService();
         this.handleErrorEvent = event => {
             this.errorMessage = event.detail.message;
             this.errorEvent.emit(event.detail);
         };
-        this.paymentId = undefined;
-        this.authToken = undefined;
-        this.getPaymentDetails = undefined;
-        this.errorMessage = null;
     }
     componentWillLoad() {
         checkPkgVersion();
@@ -73,6 +39,7 @@ const PaymentDetails = /*@__PURE__*/ proxyCustomElement(class PaymentDetails ext
                 id: this.paymentId,
                 authToken: this.authToken,
                 service: new PaymentService(),
+                apiOrigin: this.apiOrigin
             });
         }
         else {
@@ -97,6 +64,7 @@ const PaymentDetails = /*@__PURE__*/ proxyCustomElement(class PaymentDetails ext
 }, [1, "justifi-payment-details", {
         "paymentId": [1, "payment-id"],
         "authToken": [1, "auth-token"],
+        "apiOrigin": [1, "api-origin"],
         "getPaymentDetails": [32],
         "errorMessage": [32]
     }, undefined, {

package/dist/module/justifi-payment-provisioning.js

@@ -1,6 +1,6 @@
 import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
 import { c as checkPkgVersion, J as JustifiAnalytics } from './check-pkg-version.js';
-import { C as ComponentErrorCodes, a as ComponentErrorSeverity } from './ComponentError.js';
+import { C as ComponentErrorSeverity, a as ComponentErrorCodes } from './ComponentError.js';
 import { m as makeGetBusiness, g as makePostProvisioning } from './payment-provisioning-actions.js';
 import { B as BusinessService } from './business.service.js';
 import { A as Api } from './Api.js';
@@ -45,7 +45,10 @@ class ProvisionService {
             business_id: businessId,
             product_category: product,
         };
-        return Api({ authToken, apiOrigin: "https://wc-proxy.justifi.ai" }).post(endpoint, payload);
+        return Api({ authToken, apiOrigin: "https://wc-proxy.justifi.ai" }).post({
+            endpoint,
+            body: payload,
+        });
     }
 }
 
@@ -55,10 +58,6 @@ const PaymentProvisioning = /*@__PURE__*/ proxyCustomElement(class PaymentProvis
         this.__registerHost();
         this.__attachShadow();
         this.errorEvent = createEvent(this, "error-event", 7);
-        this.postProvisioning = undefined;
-        this.getBusiness = undefined;
-        this.businessId = undefined;
-        this.authToken = undefined;
         this.allowOptionalFields = false;
         this.formTitle = 'Business Information';
     }

package/dist/module/justifi-payments-list-filters.js

@@ -1,10 +1,10 @@
 import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
-import { l as lodash } from './lodash.js';
+import { l as lodashExports } from './lodash.js';
 import { f as filterParams, p as propsParams, c as clearParams } from './payments-list-params-state.js';
-import { a5 as paymentsListFilterMenu, a6 as paymentIdPaymentsListFilterParam, a7 as terminalIdPaymentsListFilterParam, a8 as paymentStatusPaymentsListFilterParam, a9 as createdAfterPaymentsListFilterParam, aa as createdBeforePaymentsListFilterParam } from './parts.js';
+import { a3 as paymentsListFilterMenu, a4 as paymentIdPaymentsListFilterParam, a5 as terminalIdPaymentsListFilterParam, a6 as paymentStatusPaymentsListFilterParam, a7 as createdAfterPaymentsListFilterParam, a8 as createdBeforePaymentsListFilterParam } from './parts.js';
 import { S as StyledHost } from './styled-host.js';
 import './details.js';
-import { k as convertToUTC, j as convertToLocal } from './utils2.js';
+import { j as convertToUTC, h as convertToLocal } from './utils2.js';
 import { d as defineCustomElement$7 } from './custom-popper2.js';
 import { d as defineCustomElement$6 } from './form-control-date2.js';
 import { d as defineCustomElement$5 } from './form-control-select2.js';
@@ -24,15 +24,10 @@ const PaymentsListFilters = /*@__PURE__*/ proxyCustomElement(class PaymentsListF
             const utcDate = convertToUTC(value, { setExactTime: true });
             this.setParamsOnChange(name, utcDate);
         };
-        this.paymentId = undefined;
-        this.terminalId = undefined;
-        this.paymentStatus = undefined;
-        this.createdAfter = undefined;
-        this.createdBefore = undefined;
     }
     componentWillLoad() {
         // debounced input handler for text input
-        this.debouncedSetParamsOnChange = lodash.exports.debounce(this.setParamsOnChange, 300);
+        this.debouncedSetParamsOnChange = lodashExports.debounce(this.setParamsOnChange, 300);
         const propsToSet = {
             payment_id: this.paymentId,
             terminal_id: this.terminalId,
@@ -59,8 +54,8 @@ const PaymentsListFilters = /*@__PURE__*/ proxyCustomElement(class PaymentsListF
     }
     render() {
         const filterMenuParams = Object.assign({}, filterParams);
-        return (h(StyledHost, { key: 'c213f44219409851784f62f38932d6165e933e2a' }, h("table-filters-menu", { key: 'b0f67131ad7812cf51e475809c4e6b1d57577cf1', params: filterMenuParams, clearParams: clearParams, part: paymentsListFilterMenu }, h("div", { key: '8d259cfe28fdeb67096383c317392f99642b4266', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: 'a593eae6541085b1d2ad46e8fac7a5e53c11c38e', class: "p-2" }, h("form-control-text", { key: 'a32b07e6635bbc31c2ca11e91cd3f95edf558cb1', name: "payment_id", label: "Payment ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.paymentId || filterParams.payment_id, disabled: !!this.paymentId, part: paymentIdPaymentsListFilterParam })), h("div", { key: '989e3f4d1f48549210e982e2c55329841bdd1926', class: "p-2" }, h("form-control-text", { key: 'a54152f1052642448ccd1e50561af65c32d976bf', name: "terminal_id", label: "Terminal ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.terminalId || filterParams.terminal_id, disabled: !!this.terminalId, part: terminalIdPaymentsListFilterParam })), h("div", { key: 'f5d484ca692420c508c8c33392a73ed84544ab97', class: "p-2" }, h("form-control-select", { key: '1f8d609f065cae6830b28ce268fb299eff9bf549', name: "payment_status", label: "Status", options: this.paymentStatusOptions, inputHandler: this.setParamsOnChange, defaultValue: this.paymentStatus || filterParams.payment_status, disabled: !!this.paymentStatus, part: paymentStatusPaymentsListFilterParam })), h("div", { key: '8db078f3a5272b61f3843119b4da4344df70e02d', class: "p-2" }, h("form-control-date", { key: '6e20e715d77f116f93484d417a0ac1c95d0e9a5e', name: "created_after", label: "Created After", inputHandler: this.handleDateInput, defaultValue: convertToLocal(this.createdAfter, { showInputDateTime: true }) ||
-                convertToLocal(filterParams.created_after, { showInputDateTime: true }), showTime: true, disabled: !!this.createdAfter, part: createdAfterPaymentsListFilterParam })), h("div", { key: '5a011a17767ad4cfd89a40b0f3d77ec92df433b3', class: "p-2" }, h("form-control-date", { key: '5064f46b779239aabc5d0fcb11479634e14e050d', name: "created_before", label: "Created Before", inputHandler: this.handleDateInput, defaultValue: convertToLocal(this.createdBefore, { showInputDateTime: true }) ||
+        return (h(StyledHost, { key: '0f60343035418f02bfb4c5a334281035cc572957' }, h("table-filters-menu", { key: 'f3fbf51df04aab4de27aec6c16b1154a9c68cf89', params: filterMenuParams, clearParams: clearParams, part: paymentsListFilterMenu }, h("div", { key: 'f16d287033fcd5738a248c46f055ca880afa100d', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: 'c732920f08adcc06e730bc37989dfab19ab1ca70', class: "p-2" }, h("form-control-text", { key: 'd627c54541b7ef5d18047eeeb1d123974903a7b4', name: "payment_id", label: "Payment ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.paymentId || filterParams.payment_id, disabled: !!this.paymentId, part: paymentIdPaymentsListFilterParam })), h("div", { key: '9d0808c36388cd9e6d44ad911ce2b35c8ef3d481', class: "p-2" }, h("form-control-text", { key: '75bd80ea108dfd17260a494fb616c4b59c9a6d17', name: "terminal_id", label: "Terminal ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.terminalId || filterParams.terminal_id, disabled: !!this.terminalId, part: terminalIdPaymentsListFilterParam })), h("div", { key: '67d9241d539eb9dbde85b36d2b46c03557988aac', class: "p-2" }, h("form-control-select", { key: '6cc1f7f8d660d6d7dd71231c0fadcd487dec598d', name: "payment_status", label: "Status", options: this.paymentStatusOptions, inputHandler: this.setParamsOnChange, defaultValue: this.paymentStatus || filterParams.payment_status, disabled: !!this.paymentStatus, part: paymentStatusPaymentsListFilterParam })), h("div", { key: '286c868036528e6c0d8d57eba384a1cbf7e9fe46', class: "p-2" }, h("form-control-date", { key: '74507753f003841539d9b6c4e233428d8cdef85e', name: "created_after", label: "Created After", inputHandler: this.handleDateInput, defaultValue: convertToLocal(this.createdAfter, { showInputDateTime: true }) ||
+                convertToLocal(filterParams.created_after, { showInputDateTime: true }), showTime: true, disabled: !!this.createdAfter, part: createdAfterPaymentsListFilterParam })), h("div", { key: 'd028a802f375b553e7504dfaec3232af5b3d7849', class: "p-2" }, h("form-control-date", { key: '3f4f89061c6f50b38aaab0d950b8bd6ed53e1290', name: "created_before", label: "Created Before", inputHandler: this.handleDateInput, defaultValue: convertToLocal(this.createdBefore, { showInputDateTime: true }) ||
                 convertToLocal(filterParams.created_before, { showInputDateTime: true }), showTime: true, disabled: !!this.createdBefore, part: createdBeforePaymentsListFilterParam }))))));
     }
 }, [1, "justifi-payments-list-filters", {

package/dist/module/justifi-payments-list.js

@@ -1,12 +1,13 @@
 import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
 import { P as PaymentService } from './payment.service.js';
-import { a as ComponentErrorSeverity, C as ComponentErrorCodes } from './ComponentError.js';
+import './utils2.js';
+import { C as ComponentErrorSeverity, a as ComponentErrorCodes } from './ComponentError.js';
 import './Checkout.js';
 import './Pagination.js';
 import { b as Payment } from './Payment.js';
-import './SubAccount.js';
+import './Refund.js';
 import './Document.js';
-import { g as getErrorMessage, a as getErrorCode } from './utils4.js';
+import { g as getErrorCode, a as getErrorMessage } from './utils4.js';
 import { c as checkPkgVersion, J as JustifiAnalytics } from './check-pkg-version.js';
 import { S as StyledHost } from './styled-host.js';
 import './details.js';
@@ -51,16 +52,13 @@ const PaymentsList = /*@__PURE__*/ proxyCustomElement(class PaymentsList extends
         this.__registerHost();
         this.__attachShadow();
         this.errorEvent = createEvent(this, "error-event", 7);
+        this.errorMessage = null;
+        this.apiOrigin = "https://wc-proxy.justifi.ai";
+        this.columns = defaultColumnsKeys;
         this.handleErrorEvent = (event) => {
             this.errorMessage = event.detail.message;
             this.errorEvent.emit(event.detail);
         };
-        this.getPayments = undefined;
-        this.errorMessage = null;
-        this.accountId = undefined;
-        this.authToken = undefined;
-        this.apiOrigin = "https://wc-proxy.justifi.ai";
-        this.columns = defaultColumnsKeys;
     }
     componentWillLoad() {
         checkPkgVersion();
@@ -92,7 +90,7 @@ const PaymentsList = /*@__PURE__*/ proxyCustomElement(class PaymentsList extends
         }
     }
     render() {
-        return (h(StyledHost, { key: '6882456e9e7af8dd5e8023cf649d967551689c20' }, h("payments-list-core", { key: '7df305455ba20e2eede8c5146edb5db2e7c412c8', getPayments: this.getPayments, "onError-event": this.handleErrorEvent, columns: this.columns })));
+        return (h(StyledHost, { key: '9abf2a388255fc2f1dd326e6c3fc3e59284a5d0e' }, h("payments-list-core", { key: '280aa7cc66e89c376f5e3169ce6bd7cda8404f70', getPayments: this.getPayments, "onError-event": this.handleErrorEvent, columns: this.columns })));
     }
     static get watchers() { return {
         "accountId": ["propChanged"],

package/dist/module/justifi-payout-details.js

@@ -1,12 +1,13 @@
 import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
 import { m as makeGetPayoutCSV, P as PayoutService } from './get-payout-csv.js';
-import { a as ComponentErrorSeverity, C as ComponentErrorCodes } from './ComponentError.js';
+import './utils2.js';
+import { C as ComponentErrorSeverity, a as ComponentErrorCodes } from './ComponentError.js';
 import './Checkout.js';
 import './Pagination.js';
 import './Payment.js';
-import { P as Payout } from './SubAccount.js';
+import { P as Payout } from './Refund.js';
 import './Document.js';
-import { g as getErrorMessage, a as getErrorCode } from './utils4.js';
+import { g as getErrorCode, a as getErrorMessage } from './utils4.js';
 import { E as ErrorState } from './utils.js';
 import { c as checkPkgVersion, J as JustifiAnalytics } from './check-pkg-version.js';
 import { d as defineCustomElement$3 } from './details.js';
@@ -47,16 +48,12 @@ const PayoutDetails = /*@__PURE__*/ proxyCustomElement(class PayoutDetails exten
         this.__registerHost();
         this.__attachShadow();
         this.errorEvent = createEvent(this, "error-event", 7);
+        this.apiOrigin = "https://wc-proxy.justifi.ai";
+        this.errorMessage = null;
         this.handleErrorEvent = (event) => {
             this.errorMessage = event.detail.message;
             this.errorEvent.emit(event.detail);
         };
-        this.payoutId = undefined;
-        this.authToken = undefined;
-        this.apiOrigin = "https://wc-proxy.justifi.ai";
-        this.getPayout = undefined;
-        this.getPayoutCSV = undefined;
-        this.errorMessage = null;
     }
     componentWillLoad() {
         checkPkgVersion();

package/dist/module/justifi-payouts-list-filters.js

@@ -1,9 +1,9 @@
 import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
 import { f as filterParams, p as propsParams, c as clearParams } from './payouts-list-params-state.js';
-import { ab as payoutsListFilterMenu, ac as createdAfterPayoutsListFilterParam, ad as createdBeforePayoutsListFilterParam } from './parts.js';
+import { a9 as payoutsListFilterMenu, aa as createdAfterPayoutsListFilterParam, ab as createdBeforePayoutsListFilterParam } from './parts.js';
 import { S as StyledHost } from './styled-host.js';
 import './details.js';
-import { k as convertToUTC, j as convertToLocal } from './utils2.js';
+import { j as convertToUTC, h as convertToLocal } from './utils2.js';
 import { d as defineCustomElement$5 } from './custom-popper2.js';
 import { d as defineCustomElement$4 } from './form-control-date2.js';
 import { d as defineCustomElement$3 } from './form-control-tooltip2.js';
@@ -21,8 +21,6 @@ const PayoutsListFilters = /*@__PURE__*/ proxyCustomElement(class PayoutsListFil
             const utcDate = convertToUTC(value, { setEndOfDay: true });
             this.setParamsOnChange(name, utcDate);
         };
-        this.createdAfter = undefined;
-        this.createdBefore = undefined;
     }
     componentWillLoad() {
         const propsToSet = {
@@ -37,8 +35,8 @@ const PayoutsListFilters = /*@__PURE__*/ proxyCustomElement(class PayoutsListFil
     }
     render() {
         const filterMenuParams = Object.assign({}, filterParams);
-        return (h(StyledHost, { key: '30857b318a635a1420f56799c572f39da85d6317' }, h("table-filters-menu", { key: 'c3b0bdc3d50d9cc3e2cef3adfbba7f0fe7539044', params: filterMenuParams, clearParams: clearParams, part: payoutsListFilterMenu }, h("div", { key: '9be791ebd77eb197e18e7663c30fa2a12c1e9a4f', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: '3e172e7f255b4e78b48cb03d2b921b01fdefc4b0', class: "p-2" }, h("form-control-date", { key: '875f2202358370bec6df4b724dbc2db7070b1ff7', name: "created_after", label: "Created After", inputHandler: this.handleDateInput, defaultValue: convertToLocal(this.createdAfter, { showInputDate: true }) ||
-                convertToLocal(filterParams.created_after, { showInputDate: true }), disabled: !!this.createdAfter, part: createdAfterPayoutsListFilterParam })), h("div", { key: 'ce324f47aa1b38b6d24f200a7b468076c6998faf', class: "p-2" }, h("form-control-date", { key: '3d2543d40d2f3ac60c7f3f09d905c102425dffc6', name: "created_before", label: "Created Before", inputHandler: this.handleDateInput, defaultValue: convertToLocal(this.createdBefore, { showInputDate: true }) ||
+        return (h(StyledHost, { key: 'a02b73ab10133c56f31f99b55573fb20e0e86347' }, h("table-filters-menu", { key: 'b59a8bd778d74f92683b379b1496ac08c2caa261', params: filterMenuParams, clearParams: clearParams, part: payoutsListFilterMenu }, h("div", { key: '8ff8564e37ed565b4efdab9a2ae10caa400968ad', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: '7506e9a888dbee516cdd52d504ff6dbe4b09ac11', class: "p-2" }, h("form-control-date", { key: '8ecdb74398e9375250bee9a89c649b4049d22a93', name: "created_after", label: "Created After", inputHandler: this.handleDateInput, defaultValue: convertToLocal(this.createdAfter, { showInputDate: true }) ||
+                convertToLocal(filterParams.created_after, { showInputDate: true }), disabled: !!this.createdAfter, part: createdAfterPayoutsListFilterParam })), h("div", { key: '89767b23bfa33b5df07067815205091d808b5656', class: "p-2" }, h("form-control-date", { key: '8c58ded3c3597f3d7a01a06f11a480fa998ed658', name: "created_before", label: "Created Before", inputHandler: this.handleDateInput, defaultValue: convertToLocal(this.createdBefore, { showInputDate: true }) ||
                 convertToLocal(filterParams.created_before, { showInputDate: true }), disabled: !!this.createdBefore, part: createdBeforePayoutsListFilterParam }))))));
     }
 }, [1, "justifi-payouts-list-filters", {

package/dist/module/justifi-payouts-list.js

@@ -1,13 +1,14 @@
 import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
-import { a as ComponentErrorSeverity, C as ComponentErrorCodes } from './ComponentError.js';
+import { C as ComponentErrorSeverity, a as ComponentErrorCodes } from './ComponentError.js';
 import { c as checkPkgVersion, J as JustifiAnalytics } from './check-pkg-version.js';
 import { m as makeGetPayoutCSV, P as PayoutService } from './get-payout-csv.js';
+import './utils2.js';
 import './Checkout.js';
 import './Pagination.js';
 import './Payment.js';
-import { P as Payout } from './SubAccount.js';
+import { P as Payout } from './Refund.js';
 import './Document.js';
-import { g as getErrorMessage, a as getErrorCode } from './utils4.js';
+import { g as getErrorCode, a as getErrorMessage } from './utils4.js';
 import { m as makeGetSubAccounts, S as SubAccountService } from './get-subaccounts.js';
 import { S as StyledHost } from './styled-host.js';
 import './details.js';
@@ -55,18 +56,13 @@ const PayoutsList = /*@__PURE__*/ proxyCustomElement(class PayoutsList extends H
         this.__registerHost();
         this.__attachShadow();
         this.errorEvent = createEvent(this, "error-event", 7);
+        this.errorMessage = null;
+        this.apiOrigin = "https://wc-proxy.justifi.ai";
+        this.columns = defaultColumnsKeys;
         this.handleOnError = (event) => {
             this.errorMessage = event.detail.message;
             this.errorEvent.emit(event.detail);
         };
-        this.getPayouts = undefined;
-        this.getPayoutCSV = undefined;
-        this.getSubAccounts = undefined;
-        this.errorMessage = null;
-        this.accountId = undefined;
-        this.authToken = undefined;
-        this.apiOrigin = "https://wc-proxy.justifi.ai";
-        this.columns = defaultColumnsKeys;
     }
     componentWillLoad() {
         checkPkgVersion();
@@ -114,7 +110,7 @@ const PayoutsList = /*@__PURE__*/ proxyCustomElement(class PayoutsList extends H
         }
     }
     render() {
-        return (h(StyledHost, { key: '434171dee57c7d639a894133b36f7dc727e28381', exportedparts: tableExportedParts }, h("payouts-list-core", { key: 'e4ed849e1c839dcdd3990a1b64d2bd132cda86f8', getPayouts: this.getPayouts, getPayoutCSV: this.getPayoutCSV, getSubAccounts: this.getSubAccounts, "onError-event": this.handleOnError, columns: this.columns })));
+        return (h(StyledHost, { key: '59e0cf1800c624229e00efcdfcb0bd5837a285f4', exportedparts: tableExportedParts }, h("payouts-list-core", { key: '7a9d5bff50bffa36c037420e57cbdf4254eadafa', getPayouts: this.getPayouts, getPayoutCSV: this.getPayoutCSV, getSubAccounts: this.getSubAccounts, "onError-event": this.handleOnError, columns: this.columns })));
     }
     static get watchers() { return {
         "accountId": ["propChanged"],

package/dist/module/justifi-refund-payment.js

@@ -1,34 +1,54 @@
-import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
+import { h, proxyCustomElement, HTMLElement, createEvent } from '@stencil/core/internal/client';
 import { c as create$3, a as create$6, F as FormController } from './form.js';
 import { f as formatCurrency } from './utils2.js';
-import { A as Api } from './Api.js';
-import { C as ComponentErrorCodes, a as ComponentErrorSeverity } from './ComponentError.js';
+import { C as ComponentErrorSeverity, a as ComponentErrorCodes } from './ComponentError.js';
 import './Checkout.js';
 import './Pagination.js';
 import './Payment.js';
-import './SubAccount.js';
+import { R as RefundReasons, e as RefundPayload } from './Refund.js';
 import './Document.js';
 import { B as Button } from './button.js';
 import { S as StyledHost } from './styled-host.js';
 import './details.js';
+import { P as PaymentService } from './payment.service.js';
+import { m as makeGetPaymentDetails } from './get-payment-details.js';
+import { c as checkPkgVersion, J as JustifiAnalytics } from './check-pkg-version.js';
+import { g as getErrorCode, a as getErrorMessage } from './utils4.js';
+import { A as Api } from './Api.js';
+import { S as Skeleton } from './skeleton.js';
 import { d as defineCustomElement$7 } from './custom-popper2.js';
-import { d as defineCustomElement$6 } from './form-control-help-text3.js';
+import { d as defineCustomElement$6 } from './form-control-help-text2.js';
 import { d as defineCustomElement$5 } from './form-control-monetary2.js';
 import { d as defineCustomElement$4 } from './form-control-select2.js';
 import { d as defineCustomElement$3 } from './form-control-textarea2.js';
 import { d as defineCustomElement$2 } from './form-control-tooltip2.js';
 
+const amountValidation = (maxAmount) => {
+    const max = +maxAmount;
+    return (create$6()
+        .required('Amount is required')
+        .test('max-amount', `Refund amount cannot be more than payment amount: ${formatCurrency(max)}`, function (value) {
+        return +value <= +max;
+    })
+        .test('min-amount', 'Refund amount must be greater than 0', function (value) {
+        return +value > 0;
+    }));
+};
 const RefundPaymentSchema = (maxRefundAmount) => {
-    const maxAmount = +maxRefundAmount;
-    return create$3().shape({
-        amount: create$6()
-            .required('Amount is required')
-            .typeError('Amount must be a number')
-            .test('amount', `Refund amount cannot be more than ${formatCurrency(maxAmount)}`, function (value) {
-            return +value <= maxAmount;
-        })
-            .nullable(),
+    if (!maxRefundAmount) {
+        return;
+    }
+    const schema = create$3({
+        amount: amountValidation(maxRefundAmount),
+        description: create$6().optional(),
+        reason: create$6().optional()
+            .oneOf([
+            RefundReasons.customerRequest,
+            RefundReasons.duplicate,
+            RefundReasons.fraudulent,
+        ], 'Select a reason')
     });
+    return schema;
 };
 
 const refundReasonOptions = [
@@ -50,6 +70,56 @@ const refundReasonOptions = [
     }
 ];
 
+const makePostRefund = ({ authToken, accountId, paymentId, service, apiOrigin }) => async ({ refundBody, onSuccess, onError, final }) => {
+    var _a;
+    try {
+        const response = await service.postRefund(paymentId, accountId, authToken, refundBody, apiOrigin);
+        if (!response.error) {
+            onSuccess(response);
+        }
+        else {
+            const responseError = getErrorMessage(response.error);
+            const code = getErrorCode((_a = response.error) === null || _a === void 0 ? void 0 : _a.code);
+            return onError({
+                error: responseError,
+                code,
+                severity: ComponentErrorSeverity.ERROR,
+            });
+        }
+    }
+    catch (error) {
+        const code = getErrorCode(error === null || error === void 0 ? void 0 : error.code);
+        return onError({
+            error: error.message || error,
+            code,
+            severity: ComponentErrorSeverity.ERROR,
+        });
+    }
+    finally {
+        return final();
+    }
+};
+
+class RefundService {
+    async postRefund(paymentId, accountId, authToken, refundBody, apiOrigin = "https://wc-proxy.justifi.ai") {
+        const api = Api({ authToken, apiOrigin });
+        const endpoint = `payments/${paymentId}/refunds`;
+        const headers = { 'Sub-Account': accountId };
+        return api.post({ endpoint, headers, body: refundBody });
+    }
+}
+
+const FormBlock = () => (h("div", { class: "row gap-3" },
+    h("div", { class: "col-12" },
+        h(Skeleton, { width: "100%", height: "40px" }))));
+const RefundLoading = () => {
+    return (h(StyledHost, null,
+        h("div", { class: "row gap-5" },
+            h(FormBlock, null),
+            h(FormBlock, null),
+            h(FormBlock, null))));
+};
+
 const RefundPayment = /*@__PURE__*/ proxyCustomElement(class RefundPayment extends HTMLElement {
     constructor() {
         super();
@@ -57,77 +127,130 @@ const RefundPayment = /*@__PURE__*/ proxyCustomElement(class RefundPayment exten
         this.__attachShadow();
         this.errorEvent = createEvent(this, "error-event", 7);
         this.submitEvent = createEvent(this, "submit-event", 7);
-        this.authToken = undefined;
-        this.paymentId = undefined;
+        this.refundPayload = {};
+        this.displayAmount = '';
+        this.errors = {};
+        this.paymentLoading = true;
+        this.refundLoading = false;
         this.hideSubmitButton = false;
         this.apiOrigin = "https://wc-proxy.justifi.ai";
-        this.paymentAmountRefundable = 0;
-        this.errorMessage = null;
-        this.errors = {};
-        this.values = {};
-        this.isLoading = false;
+        this.inputHandler = (name, value) => {
+            this.formController.setValues(Object.assign(Object.assign({}, this.formController.values.getValue()), { [name]: value }));
+        };
     }
     componentWillLoad() {
-        this.formController = new FormController(RefundPaymentSchema(this.paymentAmountRefundable.toString()));
+        checkPkgVersion();
+        this.analytics = new JustifiAnalytics(this);
         this.initializeApi();
+        this.formController = new FormController(RefundPaymentSchema());
     }
-    componentDidLoad() {
-        this.formController.errors.subscribe(errors => {
-            this.errors = Object.assign({}, errors);
-        });
-        this.formController.values.subscribe(values => {
-            this.values = Object.assign({}, values);
-        });
+    handleError(code, errorMessage, severity) {
+        this.errorEvent.emit({ errorCode: code, message: errorMessage, severity });
     }
-    async handleSubmit(event) {
-        event.preventDefault();
-        this.formController.validateAndSubmit(this.submitRefund);
+    checkAmount(amount) {
+        return amount > 0;
     }
-    async submitRefund(values) {
-        this.isLoading = true;
-        let refundResponse;
-        try {
-            refundResponse = await this.api.post(`payments/${this.paymentId}/refunds`, values);
-        }
-        catch (error) {
-            console.error('Error submitting refund:', error);
-            this.errorEvent.emit(error);
-        }
-        finally {
-            this.submitEvent.emit({ response: refundResponse });
-            this.isLoading = false;
-        }
+    handleInvalidAmount() {
+        this.submitDisabled = true;
+        const errorMessage = 'Refund amount must be greater than 0';
+        this.handleError(ComponentErrorCodes.INVALID_REFUND_AMOUNT, errorMessage, ComponentErrorSeverity.ERROR);
     }
-    handleInput(field, value) {
-        this.formController.setValues(Object.assign(Object.assign({}, this.formController.values.getValue()), { [field]: value }));
+    initializeFormController() {
+        const amount = this.refundPayload.amount;
+        const amountRefundable = amount ? amount.toString() : '0';
+        this.formController = new FormController(RefundPaymentSchema(amountRefundable));
+        this.formController.setInitialValues({
+            amount: amountRefundable
+        });
+        this.formController.values.subscribe(values => {
+            this.refundPayload = Object.assign({}, values);
+        });
+        this.formController.errors.subscribe(errors => {
+            this.errors = Object.assign({}, errors);
+        });
     }
     initializeApi() {
         if (this.paymentId && this.authToken) {
-            this.api = Api({ authToken: this.authToken, apiOrigin: "https://wc-proxy.justifi.ai" });
+            const getPayment = makeGetPaymentDetails({
+                id: this.paymentId,
+                authToken: this.authToken,
+                service: new PaymentService(),
+                apiOrigin: this.apiOrigin
+            });
+            getPayment({
+                onSuccess: ({ payment }) => {
+                    this.refundPayload = new RefundPayload({ amount: payment.amount_refundable });
+                },
+                onError: ({ error, code, severity }) => {
+                    this.handleError(code, error, severity);
+                },
+                final: () => {
+                    const amount = this.refundPayload.amount;
+                    const validAmount = this.checkAmount(amount);
+                    !validAmount ? this.handleInvalidAmount() : this.initializeFormController();
+                    this.paymentLoading = false;
+                }
+            });
         }
         else {
-            this.errorMessage = 'Payment ID and Auth Token are required';
-            this.errorEvent.emit({
-                errorCode: ComponentErrorCodes.MISSING_PROPS,
-                message: this.errorMessage,
-                severity: ComponentErrorSeverity.ERROR,
-            });
+            const errorMessage = 'Payment ID and Auth Token are required';
+            this.handleError(ComponentErrorCodes.MISSING_PROPS, errorMessage, ComponentErrorSeverity.ERROR);
         }
     }
+    async refundPayment(event) {
+        event && event.preventDefault();
+        const valid = await this.formController.validate();
+        if (!valid)
+            return;
+        const postRefund = makePostRefund({
+            authToken: this.authToken,
+            accountId: this.accountId,
+            paymentId: this.paymentId,
+            service: new RefundService(),
+            apiOrigin: this.apiOrigin
+        });
+        const values = this.formController.values.getValue();
+        this.refundLoading = true;
+        return new Promise((resolve) => {
+            let refundResponse;
+            postRefund({
+                refundBody: values,
+                onSuccess: (response) => { refundResponse = response; },
+                onError: ({ error, code, severity }) => {
+                    refundResponse = error;
+                    this.handleError(error, code, severity);
+                },
+                final: () => {
+                    this.submitEvent.emit({ response: refundResponse });
+                    this.submitDisabled = true;
+                    this.refundLoading = false;
+                    resolve(refundResponse.data);
+                },
+            });
+        });
+    }
     render() {
-        return (h(StyledHost, { key: 'ea0429d62ea383b6525251150978bb0ebfb2704e' }, h("form", { key: '8f2e00b871ee896ba82311d8975574e5a2cbf6e3' }, h("div", { key: 'fa6476367e4a8b7fd7cdfff906671ef597b453de', class: "row gy-3" }, h("div", { key: '72a48181200d6116ceb4bb511bdd33c8c8197742', class: "form-group" }, h("form-control-monetary", { key: 'f6a3b3a7d8d8c733cb032db96878ad64ff712356', name: "amount", label: "Refund Amount", inputHandler: (name, value) => this.handleInput(name, value), errorText: this.errors.amount, defaultValue: this.paymentAmountRefundable.toString() })), h("div", { key: '47e6dc07510e192caf00ce959348a2a9472f48f8', class: "form-group" }, h("form-control-select", { key: '9f9b761eea9964c7f6ac1dd907a4fee8cd63c906', label: "Reason for refund (optional)", options: refundReasonOptions, name: "reason", defaultValue: '' })), h("div", { key: 'daa4bf44ec311e0554ea28f97a0932673d542a31', class: "form-group" }, h("form-control-textarea", { key: 'a03d055e6462b9a23e714ca58a942a6da0365919', name: "description", label: "Note (optional)", inputHandler: (name, value) => this.handleInput(name, value), errorText: this.errors.description, maxLength: 250 })), h("div", { key: 'b744d28ff0a2d6aa37b1ebe2b7ea6d9b3edbbc39', class: "form-group d-flex flex-row-reverse" }, h(Button, { key: '3f62881a5fa333277478d35a7c19a8c4ca8bb929', variant: "primary", type: "submit", onClick: e => this.handleSubmit(e), isLoading: this.isLoading, hidden: this.hideSubmitButton }, `Refund ${formatCurrency(+this.values.amount)}`))))));
+        if (this.paymentLoading) {
+            return h(RefundLoading, null);
+        }
+        const defaultValues = this.formController.getInitialValues();
+        const currentRefundAmount = this.refundPayload.amount;
+        return (h(StyledHost, null, h("form", null, h("fieldset", null, h("div", { class: "row gy-3" }, h("div", { class: "col-12" }, h("form-control-monetary", { name: "amount", label: "Refund Amount", defaultValue: defaultValues.amount, inputHandler: this.inputHandler, errorText: this.errors.amount })), h("div", { class: "col-12" }, h("form-control-select", { name: "reason", label: "Reason for refund (optional)", defaultValue: defaultValues.reason, inputHandler: this.inputHandler, options: refundReasonOptions, errorText: this.errors.reason })), h("div", { class: "col-12" }, h("form-control-textarea", { name: "description", label: "Note (optional)", defaultValue: defaultValues.description, inputHandler: this.inputHandler, maxLength: 250, errorText: this.errors.description })), h("div", { class: "form-group d-flex flex-row-reverse" }, h(Button, { variant: "primary", type: "submit", onClick: this.refundPayment.bind(this), isLoading: this.paymentLoading || this.refundLoading, hidden: this.hideSubmitButton, disabled: this.submitDisabled }, `Refund ${formatCurrency(+currentRefundAmount)}`)))))));
     }
 }, [1, "justifi-refund-payment", {
         "authToken": [1, "auth-token"],
+        "accountId": [1, "account-id"],
         "paymentId": [1, "payment-id"],
         "hideSubmitButton": [4, "hide-submit-button"],
         "apiOrigin": [1, "api-origin"],
-        "paymentAmountRefundable": [32],
-        "errorMessage": [32],
+        "formController": [32],
+        "refundPayload": [32],
+        "displayAmount": [32],
         "errors": [32],
-        "values": [32],
-        "isLoading": [32],
-        "submitRefund": [64]
+        "paymentLoading": [32],
+        "refundLoading": [32],
+        "submitDisabled": [32],
+        "refundPayment": [64]
     }]);
 function defineCustomElement$1() {
     if (typeof customElements === "undefined") {