@justifi/webcomponents 5.4.4 → 5.6.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-payment-transactions-list.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface JustifiPaymentTransactionsList extends Components.JustifiPaymentTransactionsList, HTMLElement {}
+export const JustifiPaymentTransactionsList: {
+    prototype: JustifiPaymentTransactionsList;
+    new (): JustifiPaymentTransactionsList;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/module/justifi-payment-transactions-list.js

@@ -0,0 +1,229 @@
+import { h, proxyCustomElement, HTMLElement, createEvent } from '@stencil/core/internal/client';
+import { h as convertToLocal } from './utils2.js';
+import { C as ComponentErrorSeverity, a as ComponentErrorCodes } from './ComponentError.js';
+import './Checkout.js';
+import { p as pagingDefaults } from './Pagination.js';
+import './Payment.js';
+import { c as PaymentBalanceTransaction } from './Refund.js';
+import './Document.js';
+import { c as checkPkgVersion, J as JustifiAnalytics } from './check-pkg-version.js';
+import { g as getErrorCode, a as getErrorMessage } from './utils4.js';
+import { P as PaymentService } from './payment.service.js';
+import { T as TableClickActions, a as Table, b as TableLoadingState, c as TableEmptyState, d as TableErrorState } from './event-types3.js';
+import { n as tableHeadCell, a2 as getAlternateTableCellPart, m as table, o as tableCell } from './parts.js';
+import { S as StyledHost } from './styled-host.js';
+import './details.js';
+import { d as defineCustomElement$2 } from './pagination-menu2.js';
+
+const makeGetPaymentTransactions = ({ id, authToken, service, apiOrigin }) => async ({ params, onSuccess, onError, final }) => {
+    var _a;
+    try {
+        const response = await service.fetchPaymentTransactions(id, authToken, params, apiOrigin);
+        if (!response.error) {
+            const balanceTransactions = response.data.map((dataItem) => new PaymentBalanceTransaction(dataItem));
+            const pagingInfo = Object.assign({}, response.page_info);
+            onSuccess({ balanceTransactions, pagingInfo });
+        }
+        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,
+        });
+    }
+    finally {
+        final();
+    }
+};
+
+const defaultColumnsKeys = 'created_at,type,id,amount,balance';
+const paymentTransactionTableColumns = {
+    created_at: () => (h("th", { part: tableHeadCell, scope: "col", title: "The date and time each transaction was made" }, "Processed On")),
+    type: () => (h("th", { part: tableHeadCell, scope: "col", title: "The type of each transaction" }, "Type")),
+    id: () => (h("th", { part: tableHeadCell, scope: "col", title: "The unique identifier of each transaction" }, "ID")),
+    amount: () => (h("th", { part: tableHeadCell, scope: "col", title: "The dollar amount of each transaction", class: "text-end" }, "Amount")),
+    balance: () => (h("th", { part: tableHeadCell, scope: "col", title: "The running total amount of this payment that belongs to you", class: "text-end" }, "Balance")),
+    currency: () => (h("th", { part: tableHeadCell, scope: "col", title: "The currency of each transaction" }, "Currency")),
+    financial_transaction_id: () => (h("th", { part: tableHeadCell, scope: "col", title: "The unique identifier of the financial transaction associated with the payment balance transaction" }, "Financial Transaction ID")),
+    payment_id: () => (h("th", { part: tableHeadCell, scope: "col", title: "The unique identifier of the payment associated with the payment balance transaction" }, "Payment ID")),
+    payment_balance_txn_type: () => (h("th", { part: tableHeadCell, scope: "col", title: "The type of the payment balance transaction" }, "Transaction Type")),
+    source_id: () => (h("th", { part: tableHeadCell, scope: "col", title: "The unique identifier of the source object associated with the payment balance transaction" }, "Source ID")),
+    source_type: () => (h("th", { part: tableHeadCell, scope: "col", title: "The type of the source object associated with the payment balance transaction" }, "Source Type")),
+};
+const paymentTransactionTypes = {
+    ach_return: "ACH Return",
+    ach_return_fee: "ACH Return Fee",
+    dispute: "Dispute",
+    dispute_fee: "Dispute Fee",
+    dispute_fee_refund: "Dispute Fee Refund",
+    dispute_refund: "Dispute Refund",
+    payment: "Payment",
+    payment_fee: "Fee",
+    refund: "Refund",
+    fee_refund: "Fee Refund",
+    application_fee_returned: "Application Fee Returned",
+    refund_failure: "Refund Failure",
+    void: "Void",
+};
+const paymentTransactionTableCells = {
+    created_at: (balanceTransaction, index) => (h("td", { part: getAlternateTableCellPart(index) },
+        h("div", { class: "fw-bold" }, convertToLocal(balanceTransaction.created_at, { showDisplayDate: true })),
+        h("div", { class: "fw-bold" }, convertToLocal(balanceTransaction.created_at, { showTime: true })))),
+    type: (balanceTransaction, index) => (h("td", { part: getAlternateTableCellPart(index) }, paymentTransactionTypes[balanceTransaction.payment_balance_txn_type])),
+    id: (balanceTransaction, index) => (h("td", { part: getAlternateTableCellPart(index) }, balanceTransaction.id)),
+    amount: (balanceTransaction, index) => (h("td", { part: getAlternateTableCellPart(index), class: "text-end" }, balanceTransaction.formattedPaymentAmount(balanceTransaction.amount))),
+    balance: (balanceTransaction, index) => (h("td", { part: getAlternateTableCellPart(index), class: "text-end" }, balanceTransaction.formattedPaymentAmount(balanceTransaction.balance))),
+    currency: (balanceTransaction, index) => (h("td", { part: getAlternateTableCellPart(index) }, balanceTransaction.currency)),
+    financial_transaction_id: (balanceTransaction, index) => (h("td", { part: getAlternateTableCellPart(index) }, balanceTransaction.financial_transaction_id)),
+    payment_id: (balanceTransaction, index) => (h("td", { part: getAlternateTableCellPart(index) }, balanceTransaction.payment_id)),
+    payment_balance_txn_type: (balanceTransaction, index) => (h("td", { part: getAlternateTableCellPart(index) }, balanceTransaction.payment_balance_txn_type)),
+    source_id: (balanceTransaction, index) => (h("td", { part: getAlternateTableCellPart(index) }, balanceTransaction.source_id)),
+    source_type: (balanceTransaction, index) => (h("td", { part: getAlternateTableCellPart(index) }, balanceTransaction.source_type)),
+};
+
+const PaymentTransactionsList = /*@__PURE__*/ proxyCustomElement(class PaymentTransactionsList extends HTMLElement {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
+        this.clickEvent = createEvent(this, "click-event", 7);
+        this.errorEvent = createEvent(this, "error-event", 7);
+        this.balanceTransactions = [];
+        this.isLoading = true;
+        this.errorMessage = null;
+        this.paging = pagingDefaults;
+        this.pagingParams = {};
+        this.apiOrigin = "https://wc-proxy.justifi.ai";
+        this.columns = defaultColumnsKeys;
+        this.handleClickPrevious = (beforeCursor) => {
+            this.pagingParams = { before_cursor: beforeCursor };
+            this.clickEvent.emit({ name: TableClickActions.previous });
+        };
+        this.handleClickNext = (afterCursor) => {
+            this.pagingParams = { after_cursor: afterCursor };
+            this.clickEvent.emit({ name: TableClickActions.next });
+        };
+        this.rowClickHandler = (e) => {
+            const clickedPaymentID = e.target.closest('tr').dataset.rowEntityId;
+            if (!clickedPaymentID)
+                return;
+            const transactionData = this.balanceTransactions.find((payment) => payment.id === clickedPaymentID);
+            this.clickEvent.emit({ name: TableClickActions.row, data: transactionData });
+        };
+    }
+    componentWillLoad() {
+        this.transactionsTable = new Table(this.balanceTransactions, this.columns, paymentTransactionTableColumns, paymentTransactionTableCells);
+        checkPkgVersion();
+        this.analytics = new JustifiAnalytics(this);
+        this.initializeApi();
+    }
+    disconnectedCallback() {
+        this.analytics.cleanup();
+    }
+    propChanged() {
+        this.initializeApi();
+    }
+    handleError(code, errorMessage, severity) {
+        this.isLoading = false;
+        this.errorEvent.emit({ errorCode: code, message: errorMessage, severity });
+    }
+    initializeApi() {
+        if (this.paymentId && this.authToken) {
+            const getPaymentTransactions = makeGetPaymentTransactions({
+                id: this.paymentId,
+                authToken: this.authToken,
+                service: new PaymentService(),
+                apiOrigin: this.apiOrigin
+            });
+            getPaymentTransactions({
+                params: this.pagingParams,
+                onSuccess: ({ balanceTransactions, pagingInfo }) => {
+                    this.balanceTransactions = balanceTransactions;
+                    this.paging = pagingInfo;
+                    this.transactionsTable.collectionData = this.balanceTransactions;
+                },
+                onError: ({ error, code, severity }) => {
+                    this.errorMessage = error.message;
+                    this.handleError(error, code, severity);
+                },
+                final: () => {
+                    this.isLoading = false;
+                }
+            });
+        }
+        else {
+            this.errorMessage = 'payment-id and auth-token props are required';
+            this.handleError(ComponentErrorCodes.MISSING_PROPS, this.errorMessage, ComponentErrorSeverity.ERROR);
+        }
+    }
+    get entityId() {
+        return this.balanceTransactions.map((transaction) => transaction.id);
+    }
+    get showEmptyState() {
+        return !this.isLoading && !this.errorMessage && this.transactionsTable.rowData.length < 1;
+    }
+    get showErrorState() {
+        return !this.isLoading && !!this.errorMessage;
+    }
+    get showRowData() {
+        return !this.showEmptyState && !this.showErrorState && !this.isLoading;
+    }
+    render() {
+        return (h(StyledHost, { key: 'b011961e9c9b01720fa7964186e477784a7deddd' }, h("div", { key: '074eb86caf8be83e6cdc51ab496564358dafdeb5', class: "table-wrapper" }, h("table", { key: 'cc1453bcba758c6847d593a545918c449219eac4', class: "table table-hover", part: table }, h("thead", { key: '08bbac43b6484ed2f96061153a3d40a2d9f4da7d', class: "table-head sticky-top" }, h("tr", { key: '424dadd8f7686d62fcf3d3222a77c707d6e69985', class: "table-light text-nowrap" }, this.transactionsTable.columnData.map((column) => column))), h("tbody", { key: '3ef6863f785ff73b467f2c48fa91ed1bac57c7e2', class: "table-body" }, h(TableLoadingState, { key: '69da7b5801f492787ec6ce3b10fbd25e9580c0e1', columnSpan: this.transactionsTable.columnData.length, isLoading: this.isLoading }), h(TableEmptyState, { key: 'e6ff1509d0a54aaca9fbaa2e5ebd3e83a62ef17c', isEmpty: this.showEmptyState, columnSpan: this.transactionsTable.columnData.length }), h(TableErrorState, { key: '5cd693d69c7dc34807767d18ad97cc1f5fce52fe', columnSpan: this.transactionsTable.columnData.length, errorMessage: this.errorMessage }), this.showRowData && this.transactionsTable.rowData.map((data, index) => (h("tr", { "data-test-id": "table-row", "data-row-entity-id": this.entityId[index], onClick: this.rowClickHandler }, data)))), this.paging && (h("tfoot", { key: 'c8e1ff59e7db5aeb4db84884360e3d9cf71a1552', class: "sticky-bottom" }, h("tr", { key: 'fd0b29ddeb0ed6114904ce4b875618c469349578', class: "table-light align-middle" }, h("td", { key: '340ae8d8132eb66a8c0cae500d708c4174ed5dc7', part: tableCell, colSpan: this.transactionsTable.columnData.length }, h("pagination-menu", { key: 'a2ea49ba4478b3e22a4587eed3262bc482cfd9b8', paging: Object.assign(Object.assign({}, this.paging), { handleClickPrevious: this.handleClickPrevious, handleClickNext: this.handleClickNext }) })))))))));
+    }
+    static get watchers() { return {
+        "pagingParams": ["propChanged"],
+        "paymentId": ["propChanged"],
+        "authToken": ["propChanged"]
+    }; }
+}, [1, "justifi-payment-transactions-list", {
+        "paymentId": [1, "payment-id"],
+        "authToken": [1, "auth-token"],
+        "apiOrigin": [1, "api-origin"],
+        "columns": [1],
+        "balanceTransactions": [32],
+        "transactionsTable": [32],
+        "isLoading": [32],
+        "errorMessage": [32],
+        "paging": [32],
+        "pagingParams": [32]
+    }, undefined, {
+        "pagingParams": ["propChanged"],
+        "paymentId": ["propChanged"],
+        "authToken": ["propChanged"]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["justifi-payment-transactions-list", "pagination-menu"];
+    components.forEach(tagName => { switch (tagName) {
+        case "justifi-payment-transactions-list":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, PaymentTransactionsList);
+            }
+            break;
+        case "pagination-menu":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+    } });
+}
+defineCustomElement$1();
+
+const JustifiPaymentTransactionsList = PaymentTransactionsList;
+const defineCustomElement = defineCustomElement$1;
+
+export { JustifiPaymentTransactionsList, defineCustomElement };

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: '10829c1f0fc63fa2f7d051d0cfecf99cfa7d5d53' }, h("table-filters-menu", { key: 'c59be37898d0eb1b6b6d19c4b338a527efcb6cc6', params: filterMenuParams, clearParams: clearParams, part: paymentsListFilterMenu }, h("div", { key: '716e807db90c39aa977e9b5daf6a411d3086ca63', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: 'a6f176d96dc459cc78135bdb2eab080876883c9e', class: "p-2" }, h("form-control-text", { key: '08acfb9b4d70e641a33482abfb20085ef1dfe193', name: "payment_id", label: "Payment ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.paymentId || filterParams.payment_id, disabled: !!this.paymentId, part: paymentIdPaymentsListFilterParam })), h("div", { key: 'bb19e9f99e3365163701450b28e008decd59596a', class: "p-2" }, h("form-control-text", { key: 'bbeec69309d93ac6dc519369fea831a37e09cff1', name: "terminal_id", label: "Terminal ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.terminalId || filterParams.terminal_id, disabled: !!this.terminalId, part: terminalIdPaymentsListFilterParam })), h("div", { key: 'c4a260634c01d93cffe4106dc2d39b74ee74d1bb', class: "p-2" }, h("form-control-select", { key: 'f9bf9bea0a8de4387523379494a2ef6da763a532', 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: 'b9f48f0df0007629e0046a9c001b4ed92e29e229', class: "p-2" }, h("form-control-date", { key: 'c997c468c94710e8f16bd5125092390d6444b247', 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: '792715eec40293f7877377b06d97402a9befe6c9', class: "p-2" }, h("form-control-date", { key: '5a175d01c307a5273a9d41dc8c319554dc32e2e0', 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: '97f98385d5b9f4664776f920183901136b1e3d1a' }, h("payments-list-core", { key: 'be6558d801908c60c8c0c0f66741d2ee7049d5e3', getPayments: this.getPayments, "onError-event": this.handleErrorEvent, columns: this.columns })));
     }
     static get watchers() { return {
         "accountId": ["propChanged"],

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

@@ -1,14 +1,16 @@
 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 { P as PayoutService } from './payout.service.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 { m as makeGetPayoutCSV } from './get-payout-csv.js';
 import { d as defineCustomElement$3 } from './details.js';
 import { d as defineCustomElement$2 } from './payout-details-core2.js';
 
@@ -47,16 +49,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-payout-transactions-list.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface JustifiPayoutTransactionsList extends Components.JustifiPayoutTransactionsList, HTMLElement {}
+export const JustifiPayoutTransactionsList: {
+    prototype: JustifiPayoutTransactionsList;
+    new (): JustifiPayoutTransactionsList;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;