@justifi/webcomponents 5.4.4 → 5.5.0

package/dist/collection/components/payments-list/payments-list.js

@@ -8,16 +8,13 @@ import { StyledHost } from "../../ui-components";
 import { defaultColumnsKeys } from "./payments-table";
 export class PaymentsList {
     constructor() {
+        this.errorMessage = null;
+        this.apiOrigin = PROXY_API_ORIGIN;
+        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 = PROXY_API_ORIGIN;
-        this.columns = defaultColumnsKeys;
     }
     componentWillLoad() {
         checkPkgVersion();
@@ -49,7 +46,7 @@ export class PaymentsList {
         }
     }
     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 is() { return "justifi-payments-list"; }
     static get encapsulation() { return "shadow"; }
@@ -57,6 +54,7 @@ export class PaymentsList {
         return {
             "accountId": {
                 "type": "string",
+                "attribute": "account-id",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -69,11 +67,13 @@ export class PaymentsList {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "account-id",
+                "getter": false,
+                "setter": false,
                 "reflect": false
             },
             "authToken": {
                 "type": "string",
+                "attribute": "auth-token",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -86,11 +86,13 @@ export class PaymentsList {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "auth-token",
+                "getter": false,
+                "setter": false,
                 "reflect": false
             },
             "apiOrigin": {
                 "type": "string",
+                "attribute": "api-origin",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -103,12 +105,14 @@ export class PaymentsList {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "api-origin",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
                 "defaultValue": "PROXY_API_ORIGIN"
             },
             "columns": {
                 "type": "string",
+                "attribute": "columns",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -121,7 +125,8 @@ export class PaymentsList {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "columns",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
                 "defaultValue": "defaultColumnsKeys"
             }

package/dist/collection/components/payout-details/payout-details-core.js

@@ -6,6 +6,8 @@ import { MapPayoutStatusToBadge } from "../payouts-list/payouts-status";
 import PayoutDetailsLoading from "./payout-details-loading";
 export class PayoutDetailsCore {
     constructor() {
+        this.loading = true;
+        this.errorMessage = null;
         this.downloadCSV = () => {
             this.getPayoutCSV({
                 payoutId: this.payout.id,
@@ -19,11 +21,6 @@ export class PayoutDetailsCore {
                 },
             });
         };
-        this.getPayout = undefined;
-        this.getPayoutCSV = undefined;
-        this.payout = undefined;
-        this.loading = true;
-        this.errorMessage = null;
     }
     componentWillLoad() {
         if (this.getPayout) {
@@ -54,13 +51,14 @@ export class PayoutDetailsCore {
     }
     render() {
         var _a;
-        return (h(StyledHost, { key: '061c711344ca86e94a8fcc9d3d5f7de97e5c2179' }, this.loading && h(PayoutDetailsLoading, { key: '697e0405c5287731c6b5349f89919e6ca167a7b8' }), !this.loading && this.errorMessage && ErrorState(this.errorMessage), !this.loading && this.payout && (h("justifi-details", { key: 'baf48186beef6db33ca09cc62f48e1d6233cc087', "error-message": this.errorMessage }, h(EntityHeadInfo, { key: '2ad1ac98d7b7613c017ce94d5f970c599e385857', slot: "head-info", badge: MapPayoutStatusToBadge((_a = this.payout) === null || _a === void 0 ? void 0 : _a.status), title: this.payout.formattedPaymentAmount(this.payout.amount) }, h(EntityHeadInfoItem, { key: '356ae84a31ba8d28d4b00c5a019c9f6f169c16bb', classes: "border-1 border-end", title: "Updated At", value: `${formatDate(this.payout.updated_at)} ${formatTime(this.payout.updated_at)}` }), h(EntityHeadInfoItem, { key: '9bc19f40ab8c1c75acf8771d2e939c9b86c81352', classes: "border-1 border-end", title: "Created At", value: `${formatDate(this.payout.created_at)} ${formatTime(this.payout.created_at)}` }), h(EntityHeadInfoItem, { key: 'adda5e8e83511030ab0998b9093d3f73879b1b34', title: "ID", value: this.payout.id }), h("div", { key: 'a8e3eb9c2ac80d09078adb19107106d2952c4995', class: "m-4" }, h(Button, { key: '039196e6cb3d5600eb60343eb073739b262adb89', variant: "secondary", class: "btn btn-outline-secondary d-flex align-items-center", onClick: this.downloadCSV }, "Export CSV"))), h("div", { key: '7076fed938660f113e41d0f1cf29410df02bd9d5', slot: 'detail-sections' }, h(DetailSectionTitle, { key: 'bd3fbd6c010d62a3db20b05eb09b6e1144675978', sectionTitle: "Details" }), h("div", { key: '6f5faf48a2fa1a49265e8c7454889ad007efea77', class: "d-table gap-2 w-100" }, h(DetailItem, { key: '7f426b472de86bc4948bb4722f5f59190a8816fc', title: "Date paid", value: formatDate(this.payout.deposits_at) }), h(DetailItem, { key: '9c985e1faaac021bb49c15064edb7cdacb53b285', title: "Statement Description", value: this.payout.description }), h(DetailItem, { key: '819e4ce2b8a2aa34eee35994bd395cfbd358a08b', title: "Payout Method", value: this.payout.delivery_method }), h(DetailItem, { key: 'de6ef451dba0364a2d531b82ed5a8a3cfc865fce', title: "Amount", value: this.payout.formattedPaymentAmount(this.payout.amount) }), h(DetailItem, { key: 'ab3705265c4d05f3e157e5beb338239e99be687d', title: "Fee", value: this.payout.formattedPaymentAmount(this.payout.fees_total) })), h(DetailSectionTitle, { key: 'ceef5bbeeb73858eea8643a50107288e87280c15', sectionTitle: "Account" }), h("div", { key: '6652445ecf1819d85b8642af02ded44cde934979', class: "d-table gap-2 w-100" }, h(DetailItem, { key: '53b1e17717881ee14bbac8ff5941d8ee850675c2', title: "ID", value: this.payout.account_id }), h(DetailItem, { key: 'afc5c48aef9715ef55f1aaa207f0af427679f8a4', title: "Account Type", value: this.payout.bank_account.account_type }), h(DetailItem, { key: 'd78fe12043891c7a76b9c1d590cff1cfb45bf1f3', title: "Institution", value: this.payout.bank_account.account_type }), h(DetailItem, { key: '5c8d4c492a4f0ccb2d1b7c721be7426e6b46e143', title: "Routing Number", value: this.payout.bank_account.routing_number }), h(DetailItem, { key: '9ecc3872af10c9cfc380b1f4382a1ac980fff0fd', title: "Account Number", value: this.payout.bank_account.account_number_last4 })), h(DetailSectionTitle, { key: 'd38fdfd6754a68ff340a3e6456418c2ee0cd0672', sectionTitle: 'Metadata' }), h("div", { key: 'e45b2a4681556d276eaeed35e5c8a3b90e3235f0', class: "d-table gap-2 w-100" }, h(CodeBlock, { key: '1c2b19619b1997ee8f12116d1ffe822fd5ce09ce', metadata: this.payout.metadata })))))));
+        return (h(StyledHost, { key: '5b8398747913d6bf40b373eca65c253e8113a21d' }, this.loading && h(PayoutDetailsLoading, { key: 'e5f9584c81a01d4a10b1afd7926fae1e92f39ad8' }), !this.loading && this.errorMessage && ErrorState(this.errorMessage), !this.loading && this.payout && (h("justifi-details", { key: 'c3ef47e4bd529fd0738f30780e53ecd5778106b9', "error-message": this.errorMessage }, h(EntityHeadInfo, { key: '8c0a7c9319715c66820b7fe4c4c4d231fff912aa', slot: "head-info", badge: MapPayoutStatusToBadge((_a = this.payout) === null || _a === void 0 ? void 0 : _a.status), title: this.payout.formattedPaymentAmount(this.payout.amount) }, h(EntityHeadInfoItem, { key: 'f5cee7860b1d1653cb81d790e93010a407c54dcc', classes: "border-1 border-end", title: "Updated At", value: `${formatDate(this.payout.updated_at)} ${formatTime(this.payout.updated_at)}` }), h(EntityHeadInfoItem, { key: '5b1ddcba3cec58cda32dd1e3e77f655c92c0b3bd', classes: "border-1 border-end", title: "Created At", value: `${formatDate(this.payout.created_at)} ${formatTime(this.payout.created_at)}` }), h(EntityHeadInfoItem, { key: '0413f7ef138657ed896f32bd79dc685efbabd348', title: "ID", value: this.payout.id }), h("div", { key: '18347805fab3468f464cb05886f70808d3fa8d49', class: "m-4" }, h(Button, { key: 'c3e28ed761ad89697efe2d8e311b07cafe5f4e87', variant: "secondary", class: "btn btn-outline-secondary d-flex align-items-center", onClick: this.downloadCSV }, "Export CSV"))), h("div", { key: '46e2455e8aab52ff6f2ec21ab1bc5d9314e4fd9d', slot: 'detail-sections' }, h(DetailSectionTitle, { key: '11dd28f1a0a0128481683f8c7bf703a63a37b92f', sectionTitle: "Details" }), h("div", { key: '015e5ff4c1723d5cd0e9658c9489a961b20b6bbc', class: "d-table gap-2 w-100" }, h(DetailItem, { key: '0bb7d2722f3c2abbe9d09e8ed5e401f3dc126e1a', title: "Date paid", value: formatDate(this.payout.deposits_at) }), h(DetailItem, { key: 'afb65e77f66f7600d8498ef2b26e13b34c8815d2', title: "Statement Description", value: this.payout.description }), h(DetailItem, { key: '289d1c6b93cf7e36efc3f473f32beab31bf2897a', title: "Payout Method", value: this.payout.delivery_method }), h(DetailItem, { key: '866381078c7fa406bbf5293c517f6d87d736e3c2', title: "Amount", value: this.payout.formattedPaymentAmount(this.payout.amount) }), h(DetailItem, { key: '9cc27410ff9600465f4b52db6e8b70d291e48889', title: "Fee", value: this.payout.formattedPaymentAmount(this.payout.fees_total) })), h(DetailSectionTitle, { key: 'a270a06d0a9407c65a71dfe0525a547ffc7a7b76', sectionTitle: "Account" }), h("div", { key: '17b064d47baaff7d58c9b73b15b225456cbb0139', class: "d-table gap-2 w-100" }, h(DetailItem, { key: '2f7335af4b7708901760a780a9908694ad488442', title: "ID", value: this.payout.account_id }), h(DetailItem, { key: 'e3dc1e150db520f373b0e8d7faf383ea9859ba58', title: "Account Type", value: this.payout.bank_account.account_type }), h(DetailItem, { key: 'e4d213592faccb7142c781ae5da2478b2efc6a28', title: "Institution", value: this.payout.bank_account.account_type }), h(DetailItem, { key: '0a2beb62f2c4fa2ceff53c853706343cb8994624', title: "Routing Number", value: this.payout.bank_account.routing_number }), h(DetailItem, { key: 'f3e6c8f8fd7789f7d9244eecc0cf328ae5519f87', title: "Account Number", value: this.payout.bank_account.account_number_last4 })), h(DetailSectionTitle, { key: 'a35dc97c55c9fc81679a5396d79c7d0f8834dc8a', sectionTitle: 'Metadata' }), h("div", { key: '8deeab8c305bb861fa7a9a3bc1ff5aad8e8d0d48', class: "d-table gap-2 w-100" }, h(CodeBlock, { key: '318c943916f17908ead2addaebe350e949b305f0', metadata: this.payout.metadata })))))));
     }
     static get is() { return "payout-details-core"; }
     static get properties() {
         return {
             "getPayout": {
                 "type": "unknown",
+                "attribute": "get-payout",
                 "mutable": false,
                 "complexType": {
                     "original": "Function",
@@ -77,10 +75,13 @@ export class PayoutDetailsCore {
                 "docs": {
                     "tags": [],
                     "text": ""
-                }
+                },
+                "getter": false,
+                "setter": false
             },
             "getPayoutCSV": {
                 "type": "unknown",
+                "attribute": "get-payout-c-s-v",
                 "mutable": false,
                 "complexType": {
                     "original": "Function",
@@ -97,7 +98,9 @@ export class PayoutDetailsCore {
                 "docs": {
                     "tags": [],
                     "text": ""
-                }
+                },
+                "getter": false,
+                "setter": false
             }
         };
     }

package/dist/collection/components/payout-details/payout-details.js

@@ -8,16 +8,12 @@ import { makeGetPayoutCSV } from "./get-payout-csv";
 import { checkPkgVersion } from "../../utils/check-pkg-version";
 export class PayoutDetails {
     constructor() {
+        this.apiOrigin = PROXY_API_ORIGIN;
+        this.errorMessage = null;
         this.handleErrorEvent = (event) => {
             this.errorMessage = event.detail.message;
             this.errorEvent.emit(event.detail);
         };
-        this.payoutId = undefined;
-        this.authToken = undefined;
-        this.apiOrigin = PROXY_API_ORIGIN;
-        this.getPayout = undefined;
-        this.getPayoutCSV = undefined;
-        this.errorMessage = null;
     }
     componentWillLoad() {
         checkPkgVersion();
@@ -64,6 +60,7 @@ export class PayoutDetails {
         return {
             "payoutId": {
                 "type": "string",
+                "attribute": "payout-id",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -76,11 +73,13 @@ export class PayoutDetails {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "payout-id",
+                "getter": false,
+                "setter": false,
                 "reflect": false
             },
             "authToken": {
                 "type": "string",
+                "attribute": "auth-token",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -93,11 +92,13 @@ export class PayoutDetails {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "auth-token",
+                "getter": false,
+                "setter": false,
                 "reflect": false
             },
             "apiOrigin": {
                 "type": "string",
+                "attribute": "api-origin",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -110,7 +111,8 @@ export class PayoutDetails {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "api-origin",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
                 "defaultValue": "PROXY_API_ORIGIN"
             }

package/dist/collection/components/payouts-list/payouts-list-core.js

@@ -9,6 +9,11 @@ import { table, tableCell } from "../../styles/parts";
 import { TableClickActions } from "../../ui-components/table/event-types";
 export class PayoutsListCore {
     constructor() {
+        this.payouts = [];
+        this.subAccounts = [];
+        this.loading = true;
+        this.paging = pagingDefaults;
+        this.pagingParams = {};
         this.downloadCSV = (payoutId) => {
             this.getPayoutCSV({
                 payoutId,
@@ -40,17 +45,6 @@ export class PayoutsListCore {
             const payoutData = this.payouts.find((payout) => payout.id === clickedPayoutID);
             this.clickEvent.emit({ name: TableClickActions.row, data: payoutData });
         };
-        this.getPayouts = undefined;
-        this.getSubAccounts = undefined;
-        this.getPayoutCSV = undefined;
-        this.columns = undefined;
-        this.payouts = [];
-        this.payoutsTable = undefined;
-        this.subAccounts = [];
-        this.loading = true;
-        this.errorMessage = undefined;
-        this.paging = pagingDefaults;
-        this.pagingParams = {};
     }
     updateOnPropChange() {
         this.fetchData();
@@ -142,13 +136,14 @@ export class PayoutsListCore {
         return !this.showEmptyState && !this.showErrorState && !this.loading;
     }
     render() {
-        return (h("div", { key: 'ff5859c3d61ab7b2d532541c383c2478b9efc391' }, h("div", { key: 'cb50816020bfd324fae4f5f0d1a151ab04600b64', class: "table-wrapper", part: "table-wrapper" }, h("table", { key: '69cf5b76a95dd9396b97c6dd54aab8c067522102', class: "table table-hover", part: table }, h("thead", { key: '086161ba08d930efaf431571fa7670ad74a1ec88', class: "table-head sticky-top", part: "table-head" }, h("tr", { key: '659d524600aec47afa5dc75cce808da945408536', class: "table-light text-nowrap", part: "table-head-row" }, this.payoutsTable.columnData.map((column) => column))), h("tbody", { key: 'bf665357df28983b110565b8556f1cf1a022f164', class: "table-body" }, h(TableLoadingState, { key: 'c789d5b153a377ca1d2e0244e4480fe118ffa2d2', columnSpan: this.payoutsTable.columnKeys.length, isLoading: this.loading }), h(TableEmptyState, { key: '80ab61d7e68e50ad88ad5a7f8e11464418006a59', isEmpty: this.showEmptyState, columnSpan: this.payoutsTable.columnKeys.length }), h(TableErrorState, { key: '195c41c6e0a91d09ca0440002e2883fe49626c07', columnSpan: this.payoutsTable.columnKeys.length, errorMessage: this.errorMessage }), this.showRowData && this.payoutsTable.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: 'd9094830c7572cfbbfe0a17d55d9ad0daffd319f', class: "sticky-bottom" }, h("tr", { key: '658d6a380abc8085f5ec26b1423e0b9487b962d6', class: "table-light align-middle" }, h("td", { key: '962ddd1a6873a7206126e145d6772bacd4197cbf', part: tableCell, colSpan: this.payoutsTable.columnData.length }, h("pagination-menu", { key: '28c37545fe9fdce46302a9cc6d370d95e7d03d7b', paging: Object.assign(Object.assign({}, this.paging), { handleClickPrevious: this.handleClickPrevious, handleClickNext: this.handleClickNext }) })))))))));
+        return (h("div", { key: '68e0b1581a72a78c12fa0e6239d62920d3b5d9a2' }, h("div", { key: 'f59a292ac975c941520a841fa51c5610c8e60f54', class: "table-wrapper", part: "table-wrapper" }, h("table", { key: 'be74e83accf6a9de9c6505f0136bfdf68bd64586', class: "table table-hover", part: table }, h("thead", { key: '3e59e5053c2be342c3ba6bc1d28695cf302dadbf', class: "table-head sticky-top", part: "table-head" }, h("tr", { key: '1c714c3f40fdcf4e45c37ce2098cd90eb93c9121', class: "table-light text-nowrap", part: "table-head-row" }, this.payoutsTable.columnData.map((column) => column))), h("tbody", { key: '4fcbaed0667f3eaac4b7bfc628a2374f8978352e', class: "table-body" }, h(TableLoadingState, { key: '0dcf9c3bfbb228d93b9bac815704453b42aae923', columnSpan: this.payoutsTable.columnKeys.length, isLoading: this.loading }), h(TableEmptyState, { key: 'd0bd0eaf65faf8d1ce9b2634885fb0be0456459d', isEmpty: this.showEmptyState, columnSpan: this.payoutsTable.columnKeys.length }), h(TableErrorState, { key: 'ff4621c3efa8bb45214a8e571babe17bae0d05d3', columnSpan: this.payoutsTable.columnKeys.length, errorMessage: this.errorMessage }), this.showRowData && this.payoutsTable.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: 'eaf66860e8d302af6bb5e09ea843ce2a2938e06b', class: "sticky-bottom" }, h("tr", { key: '8b6f094a8ac40924a32f613cff0bbcc6b0e19def', class: "table-light align-middle" }, h("td", { key: '6d90ebe89ec368d70fed97dc19b8d20382f5b862', part: tableCell, colSpan: this.payoutsTable.columnData.length }, h("pagination-menu", { key: '836998c60c8e029131b0e83d45b9ce9fb4c36d8c', paging: Object.assign(Object.assign({}, this.paging), { handleClickPrevious: this.handleClickPrevious, handleClickNext: this.handleClickNext }) })))))))));
     }
     static get is() { return "payouts-list-core"; }
     static get properties() {
         return {
             "getPayouts": {
                 "type": "unknown",
+                "attribute": "get-payouts",
                 "mutable": false,
                 "complexType": {
                     "original": "Function",
@@ -165,10 +160,13 @@ export class PayoutsListCore {
                 "docs": {
                     "tags": [],
                     "text": ""
-                }
+                },
+                "getter": false,
+                "setter": false
             },
             "getSubAccounts": {
                 "type": "unknown",
+                "attribute": "get-sub-accounts",
                 "mutable": false,
                 "complexType": {
                     "original": "Function",
@@ -185,10 +183,13 @@ export class PayoutsListCore {
                 "docs": {
                     "tags": [],
                     "text": ""
-                }
+                },
+                "getter": false,
+                "setter": false
             },
             "getPayoutCSV": {
                 "type": "unknown",
+                "attribute": "get-payout-c-s-v",
                 "mutable": false,
                 "complexType": {
                     "original": "Function",
@@ -205,10 +206,13 @@ export class PayoutsListCore {
                 "docs": {
                     "tags": [],
                     "text": ""
-                }
+                },
+                "getter": false,
+                "setter": false
             },
             "columns": {
                 "type": "string",
+                "attribute": "columns",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -221,7 +225,8 @@ export class PayoutsListCore {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "columns",
+                "getter": false,
+                "setter": false,
                 "reflect": false
             }
         };

package/dist/collection/components/payouts-list/payouts-list-filters.js

@@ -12,8 +12,6 @@ export class PayoutsListFilters {
             const utcDate = convertToUTC(value, { setEndOfDay: true });
             this.setParamsOnChange(name, utcDate);
         };
-        this.createdAfter = undefined;
-        this.createdBefore = undefined;
     }
     componentWillLoad() {
         const propsToSet = {
@@ -28,8 +26,8 @@ export class PayoutsListFilters {
     }
     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 }))))));
     }
     static get is() { return "justifi-payouts-list-filters"; }
@@ -38,6 +36,7 @@ export class PayoutsListFilters {
         return {
             "createdAfter": {
                 "type": "string",
+                "attribute": "created-after",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -50,11 +49,13 @@ export class PayoutsListFilters {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "created-after",
+                "getter": false,
+                "setter": false,
                 "reflect": false
             },
             "createdBefore": {
                 "type": "string",
+                "attribute": "created-before",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -67,7 +68,8 @@ export class PayoutsListFilters {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "created-before",
+                "getter": false,
+                "setter": false,
                 "reflect": false
             }
         };

package/dist/collection/components/payouts-list/payouts-list.js

@@ -11,18 +11,13 @@ import { defaultColumnsKeys } from "./payouts-table";
 import { makeGetSubAccounts } from "../../actions/sub-account/get-subaccounts";
 export class PayoutsList {
     constructor() {
+        this.errorMessage = null;
+        this.apiOrigin = PROXY_API_ORIGIN;
+        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 = PROXY_API_ORIGIN;
-        this.columns = defaultColumnsKeys;
     }
     componentWillLoad() {
         checkPkgVersion();
@@ -70,7 +65,7 @@ export class PayoutsList {
         }
     }
     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 is() { return "justifi-payouts-list"; }
     static get encapsulation() { return "shadow"; }
@@ -78,6 +73,7 @@ export class PayoutsList {
         return {
             "accountId": {
                 "type": "string",
+                "attribute": "account-id",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -90,11 +86,13 @@ export class PayoutsList {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "account-id",
+                "getter": false,
+                "setter": false,
                 "reflect": false
             },
             "authToken": {
                 "type": "string",
+                "attribute": "auth-token",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -107,11 +105,13 @@ export class PayoutsList {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "auth-token",
+                "getter": false,
+                "setter": false,
                 "reflect": false
             },
             "apiOrigin": {
                 "type": "string",
+                "attribute": "api-origin",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -124,12 +124,14 @@ export class PayoutsList {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "api-origin",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
                 "defaultValue": "PROXY_API_ORIGIN"
             },
             "columns": {
                 "type": "string",
+                "attribute": "columns",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -142,7 +144,8 @@ export class PayoutsList {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "columns",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
                 "defaultValue": "defaultColumnsKeys"
             }

package/dist/collection/components/refund-payment/refund-loading.js

@@ -0,0 +1,6 @@
+import { h } from "@stencil/core";
+import { Skeleton, StyledHost } from "../../ui-components";
+const FormBlock = () => (h("div", { class: "row gap-3" }, h("div", { class: "col-12" }, h(Skeleton, { width: "100%", height: "40px" }))));
+export const RefundLoading = () => {
+    return (h(StyledHost, null, h("div", { class: "row gap-5" }, h(FormBlock, null), h(FormBlock, null), h(FormBlock, null))));
+};

package/dist/collection/components/refund-payment/refund-payment-schema.js

@@ -1,16 +1,31 @@
-import * as yup from "yup";
+import { object, string } from "yup";
 import { formatCurrency } from "../../utils/utils";
+import { RefundReasons } from "../../api";
+const amountValidation = (maxAmount) => {
+    const max = +maxAmount;
+    return (string()
+        .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 yup.object().shape({
-        amount: yup
-            .string()
-            .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 = object({
+        amount: amountValidation(maxRefundAmount),
+        description: string().optional(),
+        reason: string().optional()
+            .oneOf([
+            RefundReasons.customerRequest,
+            RefundReasons.duplicate,
+            RefundReasons.fraudulent,
+        ], 'Select a reason')
     });
+    return schema;
 };
 export default RefundPaymentSchema;