@justifi/webcomponents 4.20.1 → 4.21.0

package/dist/cjs/payment-details-core.cjs.entry.js

@@ -3,9 +3,9 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-fb499e95.js');
-const utils$1 = require('./utils-af1b60a9.js');
+const utils$1 = require('./utils-52fb7fa1.js');
 const utils = require('./utils-c1d2e426.js');
-const styledHost = require('./styled-host-9e0b67b3.js');
+const styledHost = require('./styled-host-1adf46c3.js');
 
 const PaymentDetailsCore = class {
     constructor(hostRef) {
@@ -45,14 +45,14 @@ const PaymentDetailsCore = class {
     }
     render() {
         var _a;
-        return (index.h(styledHost.StyledHost, { key: 'aaaea4076938af5a74197256dba1093265f0e2d6' }, this.loading && utils.LoadingState(), !this.loading && this.errorMessage && utils.ErrorState(this.errorMessage), !this.loading && !this.errorMessage &&
-            this.payment && (index.h("justifi-details", { key: '12f06fa05915380403e244cbed053d0c04bfa1d4', "error-message": this.errorMessage }, index.h(utils.EntityHeadInfo, { key: '4d496def6abfc728e6f184fb0729ac648fb2deaf', slot: "head-info", badge: index.h("span", { slot: 'badge', innerHTML: utils$1.MapPaymentStatusToBadge(this.payment.status) }), title: `${utils$1.formatCurrency(this.payment.amount)} ${(_a = this.payment) === null || _a === void 0 ? void 0 : _a.currency.toUpperCase()}` }, index.h(utils.EntityHeadInfoItem, { key: '78dcff13206646d594bdc80f6297d45dc9932694', classes: "border-1 border-end", title: "Updated At", value: `${utils$1.formatDate(this.payment.updated_at)} ${utils$1.formatTime(this.payment.updated_at)}` }), index.h(utils.EntityHeadInfoItem, { key: 'dfa0de667ebd28efd217b6bdf548b9b1b728b57e', classes: "border-1 border-end", title: "Created At", value: `${utils$1.formatDate(this.payment.created_at)} ${utils$1.formatTime(this.payment.created_at)}` }), index.h(utils.EntityHeadInfoItem, { key: 'b449b180034f28504007a9c2fb0598607dc00efb', title: "ID", value: this.payment.id })), index.h("div", { key: '62af84e244e38b24b32f791d13f1b21b49942597', slot: 'detail-sections' }, index.h(utils.DetailSectionTitle, { key: '0ddb0366b4ab737c7b08a37764b8ce2f7ec4a1e9', sectionTitle: "Details" }), index.h("div", { key: 'cb699194db16cb8608834779f560e882f6f9da7c', class: "d-table gap-2 w-100" }, index.h(utils.DetailItem, { key: '3b6eb4a8b782668951bba90be3b5d522f3f7c69b', title: "Amount", value: utils$1.formatCurrency(this.payment.amount) }), index.h(utils.DetailItem, { key: '7a59ab0b12a263c38c40a98acbff6492d370b28b', title: "Fees", value: utils$1.formatCurrency(this.payment.fee_amount) }), index.h(utils.DetailItem, { key: 'a9eaa5d1959425205c144dc2aa7c7fad77014290', title: "Refunded", value: utils$1.formatCurrency(this.payment.amount_refunded) }), index.h(utils.DetailItem, { key: 'd70c3a4bf48c9c69625d5f27f1095f9b0744a71e', title: "Net", value: utils$1.formatCurrency(this.payment.balance) }), index.h(utils.DetailItem, { key: '28f526b1adcd475c2ae88a8bf09ae4aea7935df6', title: "Status", value: utils$1.MapPaymentStatusToBadge(this.payment.status) }), index.h(utils.DetailItem, { key: '700f51d787f20f575e3e11aa72a8da29a9587c2a', title: "Payment ID", value: this.payment.id }), index.h(utils.DetailItem, { key: 'ea72ecc9c2f5055d4b0f6b37cd16cb318f9a797c', title: "Processing Fees", value: utils$1.formatCurrency(this.payment.fee_amount) }), index.h(utils.DetailItem, { key: '9d66af2c0c0baef4e8b7b021daf0b4d6adb267d2', title: "Statement Descriptor", value: this.payment.statement_descriptor }), index.h(utils.DetailItem, { key: '3f21501c1e08feeee1e7427a42faf1c5d1d9c84d', title: "Description", value: this.payment.description })), this.payment.payment_method.card && [
-            index.h(utils.DetailSectionTitle, { key: 'b7767b93e090c0195aca6c99b66b48d61b6134b3', sectionTitle: "Payment Method" }),
-            index.h("div", { key: 'a363c7a7e69932a8ffeddb5e0d53f7df13119a9a', class: "d-table gap-2 w-100" }, index.h(utils.DetailItem, { key: 'fb0e1f64fcec23e513590b3048593565685d8400', title: "ID", value: this.payment.payment_method.card.id }), index.h(utils.DetailItem, { key: 'bc181b1b94039e1aad341a8e563ba923976c806b', title: "Payment Type", value: "Card" }), index.h(utils.DetailItem, { key: '88b21dd2368b88232cd0f464c381d4423fe3c774', title: "Last 4 Numbers", value: this.payment.payment_method.lastFourDigits }), index.h(utils.DetailItem, { key: '040fd71315ead633f9c89e9a9dad906889759d77', title: "Brand", value: utils$1.snakeCaseToHumanReadable(this.payment.payment_method.card.brand) }), index.h(utils.DetailItem, { key: '35ebc74de2c5c8fafd95fc5b15ff4f2ca85220cc', title: "Cardholder", value: this.payment.payment_method.payersName }))
+        return (index.h(styledHost.StyledHost, { key: '0c00d8b9511be884b5455156295adc5a16e90d68' }, this.loading && utils.LoadingState(), !this.loading && this.errorMessage && utils.ErrorState(this.errorMessage), !this.loading && !this.errorMessage &&
+            this.payment && (index.h("justifi-details", { key: '84020bce088514c6922aa9f4c60fd36515b255f2', "error-message": this.errorMessage }, index.h(utils.EntityHeadInfo, { key: 'f86bc0807e905d95f92019a9f2e5431fa04f663d', slot: "head-info", badge: index.h("span", { slot: 'badge', innerHTML: utils$1.MapPaymentStatusToBadge(this.payment.status) }), title: `${utils$1.formatCurrency(this.payment.amount)} ${(_a = this.payment) === null || _a === void 0 ? void 0 : _a.currency.toUpperCase()}` }, index.h(utils.EntityHeadInfoItem, { key: '44d62082ccbb3b99e97a4a43c697c4c9de643983', classes: "border-1 border-end", title: "Updated At", value: `${utils$1.formatDate(this.payment.updated_at)} ${utils$1.formatTime(this.payment.updated_at)}` }), index.h(utils.EntityHeadInfoItem, { key: '20cbf3475cdc79e8160b7bee05cb1d7492bdbd22', classes: "border-1 border-end", title: "Created At", value: `${utils$1.formatDate(this.payment.created_at)} ${utils$1.formatTime(this.payment.created_at)}` }), index.h(utils.EntityHeadInfoItem, { key: 'bd008154f65e9133aa1d370f84925c5c0b15200b', title: "ID", value: this.payment.id })), index.h("div", { key: 'eba9206b8b934c5bf61d039640b6729bb7d1e61e', slot: 'detail-sections' }, index.h(utils.DetailSectionTitle, { key: '5f69927701e6295f339e071ce529e94870122c1c', sectionTitle: "Details" }), index.h("div", { key: 'd4dba46b241ba5ed150246f1d8dafcd64a9bb019', class: "d-table gap-2 w-100" }, index.h(utils.DetailItem, { key: '9fc3188f51f5ffb019f9253a62d962536a34d6cf', title: "Amount", value: utils$1.formatCurrency(this.payment.amount) }), index.h(utils.DetailItem, { key: '1c4e12cde8f7368f441d92cad4f3bcf1cc9e3d52', title: "Fees", value: utils$1.formatCurrency(this.payment.fee_amount) }), index.h(utils.DetailItem, { key: '9dc3a4d6c5911b48122e584cfaafee1d5ec757a8', title: "Refunded", value: utils$1.formatCurrency(this.payment.amount_refunded) }), index.h(utils.DetailItem, { key: 'a5fcb34e1af863504c4b54b024f2960e73bd9148', title: "Net", value: utils$1.formatCurrency(this.payment.balance) }), index.h(utils.DetailItem, { key: '2d7960988b5dfd90645c08399ceb658f33fb8e54', title: "Status", value: utils$1.MapPaymentStatusToBadge(this.payment.status) }), index.h(utils.DetailItem, { key: '92ae117d22f20074494a606af6eaca5b2cf51330', title: "Payment ID", value: this.payment.id }), index.h(utils.DetailItem, { key: '65dccd244aaca65369e2402c41c34614f95bcdd7', title: "Processing Fees", value: utils$1.formatCurrency(this.payment.fee_amount) }), index.h(utils.DetailItem, { key: 'b0b2516b604b1b60358b50a02094948200e472a1', title: "Statement Descriptor", value: this.payment.statement_descriptor }), index.h(utils.DetailItem, { key: 'd26d5d18b727831fa7d7f1cdc3dbcb5187170e9c', title: "Description", value: this.payment.description })), this.payment.payment_method.card && [
+            index.h(utils.DetailSectionTitle, { key: '415d1b2d0861d3eaaed37914fee27677d36d7f04', sectionTitle: "Payment Method" }),
+            index.h("div", { key: '56f0388177528afc4ab8acee6b1b884b93c6eaa1', class: "d-table gap-2 w-100" }, index.h(utils.DetailItem, { key: '04aac1ae9748061527f58144593a1ebd35f4c697', title: "ID", value: this.payment.payment_method.card.id }), index.h(utils.DetailItem, { key: '7a3e672ba11d55e9cafbda06ba141e7d9d489280', title: "Payment Type", value: "Card" }), index.h(utils.DetailItem, { key: '03a1001268a22552cdf65e60a08fd45db21f471b', title: "Last 4 Numbers", value: this.payment.payment_method.lastFourDigits }), index.h(utils.DetailItem, { key: 'df62f6d86a93d7c32eabade0ce0be19439bee824', title: "Brand", value: utils$1.snakeCaseToHumanReadable(this.payment.payment_method.card.brand) }), index.h(utils.DetailItem, { key: 'f80a25dfa9351a409483901d7e8b4fb298562c04', title: "Cardholder", value: this.payment.payment_method.payersName }))
         ], this.payment.payment_method.bank_account && [
-            index.h(utils.DetailSectionTitle, { key: 'f10eef0b4e4067fb78dbff16719a6f266f4e6bab', sectionTitle: "Payment Method" }),
-            index.h("div", { key: '6c1ef713b5dcabba5b516f3cbbd088d098873303', class: "d-table gap-2 w-100" }, index.h(utils.DetailItem, { key: '8880fd0fb2b16ee6f177aba15d6f4485c95af252', title: "ID", value: this.payment.payment_method.bank_account.id }), index.h(utils.DetailItem, { key: 'baa70304d2972f69ce8a5d077a076b16f986745b', title: "Last 4 Numbers", value: this.payment.payment_method.lastFourDigits }), index.h(utils.DetailItem, { key: 'dcb63b9258bea698bf2d165c611dfa05cb320f30', title: "Bank Name", value: this.payment.payment_method.bank_account.brand }), index.h(utils.DetailItem, { key: '806696c15aa5ef242c230d9c9aea642ddfdfd93d', title: "Account Owner", value: this.payment.payment_method.payersName }))
-        ], index.h(utils.DetailSectionTitle, { key: '83289d8f2cf57a624678260555f00af4ea96a566', sectionTitle: 'Metadata' }), index.h("div", { key: '02e248b962e0c06f4d83bae75a5759b234fea36b', class: "d-table gap-2 w-100" }, index.h(utils.CodeBlock, { key: '5d81879c7815102219ed010dab9f573ad6b7985d', metadata: this.payment.metadata })))))));
+            index.h(utils.DetailSectionTitle, { key: '87d0832646aa0b72c1bf999f0faf35165f12b61d', sectionTitle: "Payment Method" }),
+            index.h("div", { key: 'f92a4413b6f156bc4205a51c69d082623ab4fdc0', class: "d-table gap-2 w-100" }, index.h(utils.DetailItem, { key: '437ca707e081f3f6a8c199044f8b5c3a8d5c64ce', title: "ID", value: this.payment.payment_method.bank_account.id }), index.h(utils.DetailItem, { key: 'fb951661cc27c09858dbaa2819824fb67c026a3e', title: "Last 4 Numbers", value: this.payment.payment_method.lastFourDigits }), index.h(utils.DetailItem, { key: '34ef47bb23fc7c490afa84fdad3923ec371f954a', title: "Bank Name", value: this.payment.payment_method.bank_account.brand }), index.h(utils.DetailItem, { key: '0af5278b4449beb21e0c4e6af04f803e5b82dff7', title: "Account Owner", value: this.payment.payment_method.payersName }))
+        ], index.h(utils.DetailSectionTitle, { key: '9412b62344613441a40a9cd328e30eef2a024f6c', sectionTitle: 'Metadata' }), index.h("div", { key: '8553e41975e932bcb132284d3dcae576a21fedb7', class: "d-table gap-2 w-100" }, index.h(utils.CodeBlock, { key: '328e6815791d601ffe68af891ed46e0aff8d28c0', metadata: this.payment.metadata })))))));
     }
     static get watchers() { return {
         "getPaymentDetails": ["updateOnPropChange"]

package/dist/cjs/{payment.service-47e2d84e.js → payment.service-6f79aad2.js}

@@ -2,7 +2,7 @@
 
 const Api = require('./Api-b98b256f.js');
 require('./Pagination-0da8f095.js');
-require('./Payment-1a8a8ca6.js');
+require('./Payment-04a842f4.js');
 require('./Payout-a2dd7b01.js');
 const config = require('./config-05767cba.js');
 

package/dist/cjs/payments-list-core.cjs.entry.js

@@ -4,11 +4,11 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-fb499e95.js');
 const Pagination = require('./Pagination-0da8f095.js');
-require('./Payment-1a8a8ca6.js');
+require('./Payment-04a842f4.js');
 require('./Payout-a2dd7b01.js');
-const utils$1 = require('./utils-af1b60a9.js');
+const utils$1 = require('./utils-52fb7fa1.js');
 const exportedParts = require('./exported-parts-b18c68c2.js');
-const styledHost = require('./styled-host-9e0b67b3.js');
+const styledHost = require('./styled-host-1adf46c3.js');
 const tableLoadingState = require('./table-loading-state-8b406852.js');
 const utils = require('./utils-f8a6962c.js');
 
@@ -80,13 +80,13 @@ const PaymentsListCore = class {
     }
     get columnData() {
         return [
-            ['Made On', 'The date and time each payment was made'],
+            ['Date', 'The date and time each payment was made'],
             ['Amount', 'The dollar amount of each payment'],
+            ['Status', 'The current status of each payment'],
+            ['Type', 'The type of each payment'],
             ['Description', 'The payment description, if you provided one'],
-            ['Cardholder', 'The name associated with the payment method'],
+            ['Account Holder', 'The name associated with the payment method'],
             ['Payment Method', 'The brand and last 4 digits of the payment method'],
-            ['Status', 'The current status of each payment'],
-            ['Payment ID', 'The unique identifier of each payment'],
         ];
     }
     get rowData() {
@@ -98,15 +98,15 @@ const PaymentsListCore = class {
           <div class="fw-bold">${utils$1.formatTime(payment.created_at)}</div>
         `,
             },
-            utils$1.formatCurrency(payment.amount),
-            payment.description,
-            payment.payment_method.payersName,
-            payment.payment_method.lastFourDigits,
+            utils$1.formatCurrency(payment.amount, true, true),
             {
                 type: 'inner',
                 value: utils$1.MapPaymentStatusToBadge(payment.status),
             },
-            payment.id,
+            payment.paymentType,
+            payment.description,
+            payment.payment_method.payersName,
+            payment.payment_method.lastFourDigits,
         ]);
     }
     get showEmptyState() {
@@ -120,7 +120,7 @@ const PaymentsListCore = class {
     }
     render() {
         var _a, _b;
-        return (index.h(styledHost.StyledHost, { key: 'aa139e92669ea06532373a64f08a9926f9ddb4d0', exportparts: exportedParts.tableExportedParts }, index.h("payments-list-filters", { key: 'd5338eb8899dc99a9633cd892400fc4749edb4b6', params: this.params, setParamsOnChange: this.setParamsOnChange, clearParams: this.clearParams }), index.h("div", { key: 'dd452f6a2920ef50fb24324efdf65407f7d964f7', class: "table-wrapper" }, index.h("table", { key: '64d2d4304549595b80a45ee5684f7ac3cd296245', class: "table table-hover" }, index.h("thead", { key: '256145c2eea8ac35f1c83663cba68d85287f33fc', class: "table-head sticky-top", part: "table-head" }, index.h("tr", { key: '43a9d75516e80bb5cd04f2575370c863f6413528', class: "table-light text-nowrap", part: "table-head-row" }, (_a = this.columnData) === null || _a === void 0 ? void 0 : _a.map((column) => (index.h("th", { part: "table-head-cell", scope: "col", title: Array.isArray(column) ? column[1] : "" }, !Array.isArray(column) ? column : column[0]))))), index.h("tbody", { key: 'f95b3b11a9fe046a14a78aaa9f08a5522bead677', class: "table-body", part: "table-body" }, index.h(tableLoadingState.TableLoadingState, { key: 'f92ed5822f5f3946463b89ed746ab641cbf3b2b3', columnSpan: this.columnData.length, isLoading: this.loading }), index.h(tableLoadingState.TableEmptyState, { key: 'ddd2a229c0bb493480504ddcd855d2957b5acedd', isEmpty: this.showEmptyState, columnSpan: this.columnData.length }), index.h(tableLoadingState.TableErrorState, { key: '0a42c24d04d0cb23804e4a55d185cb9da4b205ab', columnSpan: this.columnData.length, errorMessage: this.errorMessage }), this.showRowData &&
+        return (index.h(styledHost.StyledHost, { key: 'c9b7ac6aadf6ff3e3c913ca3c35fb656665e79ec', exportparts: exportedParts.tableExportedParts }, index.h("payments-list-filters", { key: '36e602e9e8f607834f33a774fd171904592d28bb', params: this.params, setParamsOnChange: this.setParamsOnChange, clearParams: this.clearParams }), index.h("div", { key: '8ec5781a7884f9e785bc02dcc1037148a7553d1f', class: "table-wrapper" }, index.h("table", { key: 'b6f23a3e7f3d33839f72f76eaf388dc4b665fa5d', class: "table table-hover" }, index.h("thead", { key: 'eddf66479fe049392aa839786785f6e422e34292', class: "table-head sticky-top", part: "table-head" }, index.h("tr", { key: '5753f6b0f1ff3c860019398dd2e37be00720eee0', class: "table-light text-nowrap", part: "table-head-row" }, (_a = this.columnData) === null || _a === void 0 ? void 0 : _a.map((column) => (index.h("th", { part: "table-head-cell", scope: "col", title: Array.isArray(column) ? column[1] : "" }, !Array.isArray(column) ? column : column[0]))))), index.h("tbody", { key: '509aadeae776e891e06b8a558ddbdffd61109bef', class: "table-body", part: "table-body" }, index.h(tableLoadingState.TableLoadingState, { key: '7cdbec5333849e8430ff437a58282e83674f3a9f', columnSpan: this.columnData.length, isLoading: this.loading }), index.h(tableLoadingState.TableEmptyState, { key: 'e57c861b6c2628a9d7f5f0349ec16ddf25319352', isEmpty: this.showEmptyState, columnSpan: this.columnData.length }), index.h(tableLoadingState.TableErrorState, { key: 'e904618285b0ed49cd49976f3feb7184aff5649a', columnSpan: this.columnData.length, errorMessage: this.errorMessage }), this.showRowData &&
             this.rowData.map((data, index$1) => (index.h("tr", { "data-test-id": "table-row", "data-row-entity-id": this.entityId[index$1], onClick: this.rowClickHandler, part: `table-row ${index$1 % 2 ? "table-row-even" : "table-row-odd"}` }, data.map((dataEntry) => {
                 let nestedHtml = dataEntry === null || dataEntry === void 0 ? void 0 : dataEntry.type;
                 if (nestedHtml) {
@@ -129,7 +129,7 @@ const PaymentsListCore = class {
                 else {
                     return index.h("td", { part: "table-cell" }, dataEntry);
                 }
-            }))))), this.paging && (index.h("tfoot", { key: '20f135407c3d167359b1e2dd1f12b751b31ac80e', class: "sticky-bottom" }, index.h("tr", { key: 'dae4f695a77846739f2cc80f1e210f0d24d4671e', class: "table-light align-middle" }, index.h("td", { key: '6f2ed8b9b062a008f521aad3fe7f2ac923316955', part: "pagination-bar", colSpan: (_b = this.columnData) === null || _b === void 0 ? void 0 : _b.length }, index.h("pagination-menu", { key: '18c83657e78378ce8b59d6216479047f7728691f', paging: Object.assign(Object.assign({}, this.paging), { handleClickPrevious: this.handleClickPrevious, handleClickNext: this.handleClickNext }), params: this.params })))))))));
+            }))))), this.paging && (index.h("tfoot", { key: '5be3c247a0f19ccb4463ece1d7e2f973cd00162a', class: "sticky-bottom" }, index.h("tr", { key: '41714e1fca135c22a849983e71c1a93d7a6330e9', class: "table-light align-middle" }, index.h("td", { key: '8af7acb966f43f353c7590ab02525c9f3e01b379', part: "pagination-bar", colSpan: (_b = this.columnData) === null || _b === void 0 ? void 0 : _b.length }, index.h("pagination-menu", { key: 'e6ec8d634dfd8dca68e8a9e1fc41782046f2115a', paging: Object.assign(Object.assign({}, this.paging), { handleClickPrevious: this.handleClickPrevious, handleClickNext: this.handleClickNext }), params: this.params })))))))));
     }
     static get watchers() { return {
         "params": ["updateOnPropChange"],

package/dist/cjs/payments-list-filters_2.cjs.entry.js

@@ -17232,7 +17232,7 @@ const PaymentsListFilters = class {
         ];
     }
     render() {
-        return (index.h("table-filters-menu", { key: '490bab461b6e9f7d3d6296e0d7b59cd0379750a9', params: this.params, clearParams: this.clearParams }, index.h("div", { key: '03541b6698c5c7fd3f82133e5c391c1a88516a09', class: "grid-cols-2 gap-3 p-1" }, index.h("div", { key: 'da16493e48e338b7a44acdfd8adfc74536580c76', class: "p-2" }, index.h("form-control-text", { key: '5c3c66c184bc1753ce8a8c9dd8644a15338dba27', name: "payment_id", label: "Payment ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.params.payment_id })), index.h("div", { key: 'cc1637833295948df93b3fc5e3a9240b8c401840', class: "p-2" }, index.h("form-control-text", { key: '9201deffdc08ddadbcb4b1b817550116ce5e4eb9', name: "terminal_id", label: "Terminal ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.params.terminal_id })), index.h("div", { key: '8bba67af45d8ae3427c0df2fd7e3e01bfb081ade', class: "p-2" }, index.h("form-control-select", { key: '9744947523c0ba7f840946b9d21574d93b239efe', name: "payment_status", label: "Status", options: this.paymentStatusOptions, inputHandler: this.setParamsOnChange, defaultValue: this.params.payment_status })), index.h("div", { key: '3e15042ad46b11ea1ba086a284a32b7a661362d9', class: "p-2" }, index.h("form-control-date", { key: '4cb7f7356fb9a3e86834511eefd16c5b3334b976', name: "created_after", label: "Start Date", inputHandler: this.setParamsOnChange, defaultValue: this.params.created_after })), index.h("div", { key: '88315cc708c3e4e526e0a80f04a114bf0f9600bf', class: "p-2" }, index.h("form-control-date", { key: '537eee72fc813d0c73d830641db73eadabef5d18', name: "created_before", label: "End Date", inputHandler: this.setParamsOnChange, defaultValue: this.params.created_before })))));
+        return (index.h("table-filters-menu", { key: '96bffa87c69967fd1a5af7d171eb3836d82f994b', params: this.params, clearParams: this.clearParams }, index.h("div", { key: 'cf77c3d54377829e813b1ab53f4cbcbd38fe721b', class: "grid-cols-2 gap-3 p-1" }, index.h("div", { key: '8d0ce058ca9419e35202838d689c67266adc58e8', class: "p-2" }, index.h("form-control-text", { key: '7485f3e7366531240819370a62341b1e1cd1a647', name: "payment_id", label: "Payment ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.params.payment_id })), index.h("div", { key: '95a92490bb414ab5ee4ec5c9dc1ae49bf10f4adc', class: "p-2" }, index.h("form-control-text", { key: '6fec7cbb05410cafacb374221582301d819aac10', name: "terminal_id", label: "Terminal ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.params.terminal_id })), index.h("div", { key: '2d3bebafb9dc28c0e8a23a954af6019497d0b404', class: "p-2" }, index.h("form-control-select", { key: '48705b2cf089301674bf8147445ca00ebb9f1240', name: "payment_status", label: "Status", options: this.paymentStatusOptions, inputHandler: this.setParamsOnChange, defaultValue: this.params.payment_status })), index.h("div", { key: 'bfc71e6a99f805d00a777b3374a20ede9abd90ea', class: "p-2" }, index.h("form-control-date", { key: '69183a8905039fd6e021ac9da1dcbb2897009101', name: "created_after", label: "Start Date", inputHandler: this.setParamsOnChange, defaultValue: this.params.created_after, showTime: true, filterTimeZone: true })), index.h("div", { key: '9eabcbc9ec8156f3ad490c91e0d9fae9a51dc3cd', class: "p-2" }, index.h("form-control-date", { key: '838d06eebe74acdff6e6025da2d46a6fcca98d72', name: "created_before", label: "End Date", inputHandler: this.setParamsOnChange, defaultValue: this.params.created_before, showTime: true, filterTimeZone: true })))));
     }
 };
 
@@ -17255,7 +17255,7 @@ const TableFiltersMenu = class {
         this.menu.classList.remove('show');
     }
     render() {
-        return (index.h("div", { key: 'dd6aae6e43579e8f833b1f3f6a6227d2522d79ec', class: "d-flex gap-2" }, index.h("div", { key: '6decd268cf11d67c3f9e3c2b22e60cbdf328763a', class: "dropdown pb-3" }, index.h(button.Button, { key: 'af22247916f55da650da95006e3317316a4122f5', variant: "primary", type: "button dropdown-toggle", ref: (el) => (this.anchorButton = el), class: "btn btn-primary dropdown-toggle", "data-test-id": "open-filters-button", "data-bs-toggle": "dropdown" }, "Filters"), index.h("custom-popper", { key: '0516d664adf8feccb9dd9cb74023241867285bd6', offset: [20, 10], strategy: "fixed", anchorRef: this.anchorButton, trigger: "click" }, index.h("form", { key: 'd42f891b0b30fa152e03bfe3fbcb12da4707974b', class: "dropdown-menu", part: "dropdown-menu", "data-test-id": "filter-menu", ref: (el) => (this.menu = el), onSubmit: (e) => e.preventDefault() }, index.h("slot", { key: '77eb00715458275e6df23da973103046364f50aa' })))), index.h("div", { key: 'c9070c2d5ee453cf3a97908514877975c55813b8' }, index.h(button.Button, { key: '99b38ff5ac51ee21227832b2200f2dcdec40a70c', variant: "secondary", onClick: () => this.clearParams(), hidden: !this.showClearButton, "data-test-id": "clear-filters-button" }, "Clear Filters"))));
+        return (index.h("div", { key: 'aa914e16d2a733c8b7b6fee24225120d6901f0b5', class: "d-flex gap-2" }, index.h("div", { key: 'b53ff88da49d4060edfb1b96bf4577babf8e66f8', class: "dropdown pb-3" }, index.h(button.Button, { key: '176da3d69ae445dbc46e9c6602258ccb9bdeb515', variant: "primary", type: "button dropdown-toggle", ref: (el) => (this.anchorButton = el), class: "btn btn-primary dropdown-toggle", "data-test-id": "open-filters-button", "data-bs-toggle": "dropdown" }, "Filters"), index.h("custom-popper", { key: '562c6961a08e7b66518d9c2a283ddcb8a5787fa3', offset: [20, 10], strategy: "fixed", anchorRef: this.anchorButton, trigger: "click" }, index.h("form", { key: '28d51e3aaa14f8208c9680b65058d3fd9f85f4d7', class: "dropdown-menu", part: "dropdown-menu", "data-test-id": "filter-menu", ref: (el) => (this.menu = el), onSubmit: (e) => e.preventDefault() }, index.h("slot", { key: 'f00fb0dafac62c1a4283f1c2eb80c34dadaecd15' })))), index.h("div", { key: 'b8b9b9c7af5bfd7a20a34be4f28cda59a048f97a' }, index.h(button.Button, { key: '46746c3524824bf88120baf7e19c1687c3b8fa71', variant: "secondary", onClick: () => this.clearParams(), hidden: !this.showClearButton, "data-test-id": "clear-filters-button" }, "Clear Filters"))));
     }
     static get watchers() { return {
         "params": ["watchParamsHandler"]

package/dist/cjs/payout-details-core.cjs.entry.js

@@ -3,9 +3,9 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-fb499e95.js');
-const utils$1 = require('./utils-af1b60a9.js');
+const utils$1 = require('./utils-52fb7fa1.js');
 const utils = require('./utils-c1d2e426.js');
-const styledHost = require('./styled-host-9e0b67b3.js');
+const styledHost = require('./styled-host-1adf46c3.js');
 
 const PayoutDetailsCore = class {
     constructor(hostRef) {
@@ -59,7 +59,7 @@ const PayoutDetailsCore = class {
     }
     render() {
         var _a;
-        return (index.h(styledHost.StyledHost, { key: '3ab39ca75aa7f1db8daf8442d2ae9131085375ae' }, this.loading && utils.LoadingState(), !this.loading && this.errorMessage && utils.ErrorState(this.errorMessage), !this.loading && this.payout && (index.h("justifi-details", { key: 'c423b3e994e2ceb3b9f641752f1747aa8d8e7b4e', "error-message": this.errorMessage }, index.h(utils.EntityHeadInfo, { key: 'e39f07636edbe3527707c538f296133a24a92aa1', slot: "head-info", badge: index.h("span", { slot: 'badge', innerHTML: utils$1.MapPayoutStatusToBadge((_a = this.payout) === null || _a === void 0 ? void 0 : _a.status) }), title: `${utils$1.formatCurrency(this.payout.amount)} ${this.payout.currency.toUpperCase()}` }, index.h(utils.EntityHeadInfoItem, { key: '3424ff97b7a41fdbd784a982617af0ab2ff004e7', classes: "border-1 border-end", title: "Updated At", value: `${utils$1.formatDate(this.payout.updated_at)} ${utils$1.formatTime(this.payout.updated_at)}` }), index.h(utils.EntityHeadInfoItem, { key: 'c2584993d369514e2413c7d23a9b731eb2c9135a', classes: "border-1 border-end", title: "Created At", value: `${utils$1.formatDate(this.payout.created_at)} ${utils$1.formatTime(this.payout.created_at)}` }), index.h(utils.EntityHeadInfoItem, { key: '958856c1acbc34394d2fbc453d9e2dd1f437fe38', title: "ID", value: this.payout.id }), index.h("div", { key: 'dd097a51e1b02a7624614cb7f554789302e36bcd', class: "m-4" }, index.h("button", { key: 'f565ec22830ea1fd53e9f14d4f184a4a97e975ea', class: "btn btn-outline-secondary d-flex align-items-center", onClick: this.downloadCSV }, "Export CSV"))), index.h("div", { key: 'a12b5c5a78c1e21d905a8049537d8775765766d1', slot: 'detail-sections' }, index.h(utils.DetailSectionTitle, { key: 'b3ef435e2cce25f91e3d015098c199a95acfd76e', sectionTitle: "Details" }), index.h("div", { key: '585f9454474ce9b5691265cfe44309220b737a8a', class: "d-table gap-2 w-100" }, index.h(utils.DetailItem, { key: '20deb7901ee526c84966e43e020b7aec9ce2d014', title: "Date paid", value: utils$1.formatDate(this.payout.deposits_at) }), index.h(utils.DetailItem, { key: 'e0f17db65ed53f3c4b3eff511dcf44784e9d0be5', title: "Statement Description", value: this.payout.description }), index.h(utils.DetailItem, { key: '5c665c9b5eca28d09c46367156a586b64bb20ee5', title: "Payout Method", value: this.payout.delivery_method }), index.h(utils.DetailItem, { key: 'e0a39aad45a06185498256859947f8f64312bbc4', title: "Amount", value: utils$1.formatCurrency(this.payout.amount) }), index.h(utils.DetailItem, { key: 'd0fcad35843acf001cc73c0fe3f67ca85fa99007', title: "Fee", value: utils$1.formatCurrency(this.payout.fees_total) })), index.h(utils.DetailSectionTitle, { key: '08d127690a8e63e852cd23ed53cc83da77c9de46', sectionTitle: "Account" }), index.h("div", { key: '1ebc113b76f30abd208374a0cfaa60c3ac6c30d2', class: "d-table gap-2 w-100" }, index.h(utils.DetailItem, { key: 'f61baf5b0e38d0e1c31d9f32109d4eb87a1dcc51', title: "ID", value: this.payout.account_id }), index.h(utils.DetailItem, { key: '01aa558d404b8bb3d170812828ee0929e60bc2c9', title: "Account Type", value: this.payout.bank_account.account_type }), index.h(utils.DetailItem, { key: '8298458ba6dc9bcdaa7f992d530e179e3d8a3bc3', title: "Institution", value: this.payout.bank_account.account_type }), index.h(utils.DetailItem, { key: 'b15a016b489bd61f55670beec610f49c56659b87', title: "Routing Number", value: this.payout.bank_account.routing_number }), index.h(utils.DetailItem, { key: 'cd9e466eaadf645fcabad56c1ee2493e6f5ac11c', title: "Account Number", value: this.payout.bank_account.account_number_last4 })), index.h(utils.DetailSectionTitle, { key: 'b30058d0ebd67c91ba182e1e2231ff72d9adf5c5', sectionTitle: 'Metadata' }), index.h("div", { key: '02876e9c23abea853218c78b99e1b46795af7a93', class: "d-table gap-2 w-100" }, index.h(utils.CodeBlock, { key: '9e6dee3bda335ff836e650741a00b75800da7dab', metadata: this.payout.metadata })))))));
+        return (index.h(styledHost.StyledHost, { key: 'b538a72063f57deea45d1ce74c173156a499e08f' }, this.loading && utils.LoadingState(), !this.loading && this.errorMessage && utils.ErrorState(this.errorMessage), !this.loading && this.payout && (index.h("justifi-details", { key: '5ea45dac87ab9959a0d821c2d2cae5ee9cf0894b', "error-message": this.errorMessage }, index.h(utils.EntityHeadInfo, { key: '372a13f727ec9d0d375b37ae029a5ab2df3d72d3', slot: "head-info", badge: index.h("span", { slot: 'badge', innerHTML: utils$1.MapPayoutStatusToBadge((_a = this.payout) === null || _a === void 0 ? void 0 : _a.status) }), title: `${utils$1.formatCurrency(this.payout.amount)} ${this.payout.currency.toUpperCase()}` }, index.h(utils.EntityHeadInfoItem, { key: '9afd1e327235bb0d3a48697ea01b68a5516789c2', classes: "border-1 border-end", title: "Updated At", value: `${utils$1.formatDate(this.payout.updated_at)} ${utils$1.formatTime(this.payout.updated_at)}` }), index.h(utils.EntityHeadInfoItem, { key: 'f00add046d617c12540be0cfc4540808719e0e65', classes: "border-1 border-end", title: "Created At", value: `${utils$1.formatDate(this.payout.created_at)} ${utils$1.formatTime(this.payout.created_at)}` }), index.h(utils.EntityHeadInfoItem, { key: '239849324e65aa9eea6070c4fca8d2a85c490bb1', title: "ID", value: this.payout.id }), index.h("div", { key: '0f2ea65e410f9e89499e60b14b91005d3e98838d', class: "m-4" }, index.h("button", { key: '09b9efcd24c0aa3364be75f2ec07055a381f100a', class: "btn btn-outline-secondary d-flex align-items-center", onClick: this.downloadCSV }, "Export CSV"))), index.h("div", { key: 'a8ff31263826356fb0c0ea7dbc3433e04e45d413', slot: 'detail-sections' }, index.h(utils.DetailSectionTitle, { key: '47923246812e7ef3828fc33914c3f01cb6a38b31', sectionTitle: "Details" }), index.h("div", { key: '37bf9c3a58e2a2678bb96b6aaca739e032ea61b9', class: "d-table gap-2 w-100" }, index.h(utils.DetailItem, { key: '772024dd509058d54e6da5d3a6450a163774fd36', title: "Date paid", value: utils$1.formatDate(this.payout.deposits_at) }), index.h(utils.DetailItem, { key: '2925020997b1da4e263ae44ef55605765407c386', title: "Statement Description", value: this.payout.description }), index.h(utils.DetailItem, { key: 'e34388b87e09d4c94ca4463f3a5ede078f41d938', title: "Payout Method", value: this.payout.delivery_method }), index.h(utils.DetailItem, { key: '931e4fc84ad6932b40824cdbb8bf8909bacee2c7', title: "Amount", value: utils$1.formatCurrency(this.payout.amount) }), index.h(utils.DetailItem, { key: '38c1be3b0872d990dfafcdd796ed2a9be6a8bfa1', title: "Fee", value: utils$1.formatCurrency(this.payout.fees_total) })), index.h(utils.DetailSectionTitle, { key: '0057ad126e391f2f55307a3c6035c8feb1ca959b', sectionTitle: "Account" }), index.h("div", { key: '2d19e06db0a626313481f91a4602239634c846c7', class: "d-table gap-2 w-100" }, index.h(utils.DetailItem, { key: '147e30b77458b02cc0d996ba91e253dfa11e58a0', title: "ID", value: this.payout.account_id }), index.h(utils.DetailItem, { key: '32f4ffcd4c44e3adc97e94da99aaafa0412fe258', title: "Account Type", value: this.payout.bank_account.account_type }), index.h(utils.DetailItem, { key: '293bbea794dd126fbaada4b263f2b85ed0d9fbb4', title: "Institution", value: this.payout.bank_account.account_type }), index.h(utils.DetailItem, { key: '0dbb60bb773745657961d1a20a3621ba319436c0', title: "Routing Number", value: this.payout.bank_account.routing_number }), index.h(utils.DetailItem, { key: '5dbf5b3225b33cf7d6f838e0621eac4ace8351c9', title: "Account Number", value: this.payout.bank_account.account_number_last4 })), index.h(utils.DetailSectionTitle, { key: 'e89cdd81cb5ef15d964c0a00a0bbb2f57fadc5d2', sectionTitle: 'Metadata' }), index.h("div", { key: '6c3da5b9aeaef544d28504708af32219164c37ca', class: "d-table gap-2 w-100" }, index.h(utils.CodeBlock, { key: '0ad346c1bfb3639852b64fc3ab4906efad584f54', metadata: this.payout.metadata })))))));
     }
     static get watchers() { return {
         "getPayout": ["getPayoutWatcher"]

package/dist/cjs/payouts-list-core.cjs.entry.js

@@ -4,12 +4,12 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-fb499e95.js');
 const Pagination = require('./Pagination-0da8f095.js');
-require('./Payment-1a8a8ca6.js');
+require('./Payment-04a842f4.js');
 const Payout = require('./Payout-a2dd7b01.js');
-const utils = require('./utils-af1b60a9.js');
+const utils = require('./utils-52fb7fa1.js');
 const ComponentError = require('./ComponentError-233ac749.js');
 const exportedParts = require('./exported-parts-b18c68c2.js');
-const styledHost = require('./styled-host-9e0b67b3.js');
+const styledHost = require('./styled-host-1adf46c3.js');
 const tableLoadingState = require('./table-loading-state-8b406852.js');
 
 const DownloadIcon = (props) => (index.h("svg", Object.assign({ xmlns: 'http://www.w3.org/2000/svg', viewBox: '0 0 24 24' }, props),
@@ -154,8 +154,8 @@ const PayoutsListCore = class {
         return !this.showEmptyState && !this.showErrorState;
     }
     render() {
-        return (index.h(styledHost.StyledHost, { key: 'c160bca06a40b0bde1d0ecf3bbbf081535c23487', exportedparts: exportedParts.tableExportedParts }, index.h("div", { key: 'ba6b1418212fc79f2eb4a2c4835de9f2df7fd8e9', class: "row gy-3 mb-4" }, index.h("div", { key: '0c7323ec2551a29df6a9e273e53ca965b4422ce5', class: "col-2" }, index.h("form-control-date", { key: 'f3cd038ef750e1022e29dba96e201e669f0d2f84', name: "created_after", label: "Date from:", inputHandler: this.handleDateChange })), index.h("div", { key: '46f0a88e563ace9d4476940abec758721e40d217', class: "col-2" }, index.h("form-control-date", { key: 'c80de9111c3b4fb9c526c0668b4154753fd78ebd', name: "created_before", label: "Date to:", inputHandler: this.handleDateChange }))), index.h("div", { key: '570a74e2c87f2d685f932c5a0182a77a7cf296c0', class: "table-wrapper" }, index.h("table", { key: 'dba141a302aeb90c45bb64171870bf1cd097576b', class: "table table-hover" }, index.h("thead", { key: 'ea6fb0e3d3aecf89216d310bc66874602a64af40', class: "table-head sticky-top", part: "table-head" }, index.h("tr", { key: 'daa4eab66cdaad6af240704f24c1e22f9d1ff999', class: "table-light text-nowrap", part: "table-head-row" }, this.columnData.map((column) => (index.h("th", { part: "table-head-cell", scope: "col", title: Array.isArray(column) ? column[1] : '' }, Array.isArray(column) ? column[0] : column))))), index.h("tbody", { key: '1f7ffd08ce54fe4b47560e3465e18bd163065be0', class: "table-body", part: "table-body" }, index.h(tableLoadingState.TableLoadingState, { key: '8a2668b61449c0a16183bff5a2de120cb8898922', columnSpan: this.columnData.length, isLoading: this.loading }), index.h(tableLoadingState.TableEmptyState, { key: 'a419e933f349cc126afac309c0647a985590dfc5', isEmpty: this.showEmptyState, columnSpan: this.columnData.length }), index.h(tableLoadingState.TableErrorState, { key: 'b3a0267af5bdfdf7ca28caa4b2427437fb6f806f', columnSpan: this.columnData.length, errorMessage: this.errorMessage }), this.showRowData &&
-            this.rowData.map((data, index$1) => (index.h("tr", { "data-test-id": "table-row", "data-row-entity-id": this.entityId[index$1], onClick: this.rowClickHandler, part: `table-row ${index$1 % 2 ? 'table-row-even' : 'table-row-odd'}` }, data.map((dataEntry) => ((dataEntry === null || dataEntry === void 0 ? void 0 : dataEntry.type) ? (index.h("td", { part: "table-cell", innerHTML: dataEntry.value })) : (index.h("td", { part: "table-cell" }, dataEntry)))))))), this.paging && (index.h("tfoot", { key: '11aabf956abf100c8988c7fc0dc6fe1327b0a45d', class: "sticky-bottom" }, index.h("tr", { key: '37bf8a636469e15cb73d0730e2a2269decc83693', class: "table-light align-middle" }, index.h("td", { key: '785d2f4b39153842a9a9a0ab40ace7c2a35c6b6c', part: "pagination-bar", colSpan: this.columnData.length }, index.h("pagination-menu", { key: 'f39e621434687eab1b7fccdfda56cbecfe59d64d', paging: Object.assign(Object.assign({}, this.paging), { handleClickPrevious: this.handleClickPrevious, handleClickNext: this.handleClickNext }), params: this.params })))))))));
+        return (index.h(styledHost.StyledHost, { key: '832eff9b77800d6631c73559b61af3b8c5c1eb5b', exportedparts: exportedParts.tableExportedParts }, index.h("div", { key: 'b2a127643e0a48888c643f77d9235082502a2549', class: "row gy-3 mb-4" }, index.h("div", { key: '6b2ef796b48da76e816ed5090126bf6c891687ce', class: "col-2" }, index.h("form-control-date", { key: '52c7507bd47a665d8986cdde06a1e26f30a5f9e0', name: "created_after", label: "Date from:", inputHandler: this.handleDateChange })), index.h("div", { key: 'acb3307eec6b6d36b229d59683782bfbb2e65239', class: "col-2" }, index.h("form-control-date", { key: '294f40153e9eb61b53152763ff54e942620962a0', name: "created_before", label: "Date to:", inputHandler: this.handleDateChange }))), index.h("div", { key: '0d55a8fe0017a7fc3a3a675b11aeff9f0eb71cef', class: "table-wrapper" }, index.h("table", { key: 'c7fe79007a7ddb600117df904e376465abec406e', class: "table table-hover" }, index.h("thead", { key: '451a5f744c76a6b6beb2ad0cafd3677fd0f0b190', class: "table-head sticky-top", part: "table-head" }, index.h("tr", { key: 'c7b58d5e0a96536df39673f8ac928c0809fe7f64', class: "table-light text-nowrap", part: "table-head-row" }, this.columnData.map((column) => (index.h("th", { part: "table-head-cell", scope: "col", title: Array.isArray(column) ? column[1] : '' }, Array.isArray(column) ? column[0] : column))))), index.h("tbody", { key: '638cac393da61b6c73a7b287f5c9b13d0817390e', class: "table-body", part: "table-body" }, index.h(tableLoadingState.TableLoadingState, { key: 'dd768838da9b29c4f1e251eb27ba2c5b467a4a7d', columnSpan: this.columnData.length, isLoading: this.loading }), index.h(tableLoadingState.TableEmptyState, { key: '412fe6a904e37f095c5c7a0aeb2356b893cfef7b', isEmpty: this.showEmptyState, columnSpan: this.columnData.length }), index.h(tableLoadingState.TableErrorState, { key: '144bf2bf71789a1a29b638291ec5ca16ab31b2fc', columnSpan: this.columnData.length, errorMessage: this.errorMessage }), this.showRowData &&
+            this.rowData.map((data, index$1) => (index.h("tr", { "data-test-id": "table-row", "data-row-entity-id": this.entityId[index$1], onClick: this.rowClickHandler, part: `table-row ${index$1 % 2 ? 'table-row-even' : 'table-row-odd'}` }, data.map((dataEntry) => ((dataEntry === null || dataEntry === void 0 ? void 0 : dataEntry.type) ? (index.h("td", { part: "table-cell", innerHTML: dataEntry.value })) : (index.h("td", { part: "table-cell" }, dataEntry)))))))), this.paging && (index.h("tfoot", { key: '0df80be6f5c3e2cd18fa27c0ec2e1cb560348908', class: "sticky-bottom" }, index.h("tr", { key: '0d25309ea10e119e07e6d5438b70dd5a83b22f2b', class: "table-light align-middle" }, index.h("td", { key: '25a111ea022692ea8502ddfdf92dd9811fde6024', part: "pagination-bar", colSpan: this.columnData.length }, index.h("pagination-menu", { key: '5cc20eba110ab7c974dc43c8d20e94f6cb17ec81', paging: Object.assign(Object.assign({}, this.paging), { handleClickPrevious: this.handleClickPrevious, handleClickNext: this.handleClickNext }), params: this.params })))))))));
     }
     static get watchers() { return {
         "params": ["updateOnPropChange"],