@justifi/webcomponents 6.12.1-rc.4 → 6.12.1

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

@@ -1,199 +0,0 @@
-import { h } from "@stencil/core";
-import { capitalizeFirstLetter, formatDate, formatTime } from "../../utils/utils";
-import { CodeBlock, DetailItem, DetailSectionTitle, EntityHeadInfo, EntityHeadInfoItem, ErrorState } from "../../ui-components/details/utils";
-import { Button, StyledHost } from "../../ui-components";
-import { MapPayoutStatusToBadge } from "../payouts-list/payouts-status";
-import PayoutDetailsLoading from "./payout-details-loading";
-import { Badge, BadgeVariant } from "../../ui-components/badge/badge";
-export class PayoutDetailsCore {
-    constructor() {
-        this.enableRecordClick = false;
-        this.loading = true;
-        this.errorMessage = null;
-        this.downloadCSV = () => {
-            this.getPayoutCSV({
-                payoutId: this.payout.id,
-                onError: ({ error, code, severity }) => {
-                    this.errorMessage = error;
-                    this.errorEvent.emit({
-                        message: error,
-                        errorCode: code,
-                        severity,
-                    });
-                },
-            });
-        };
-        this.handleRecordClick = (id) => {
-            this.recordClickEvent.emit({
-                id,
-                type: 'account'
-            });
-        };
-    }
-    componentWillLoad() {
-        if (this.getPayout) {
-            this.fetchData();
-        }
-    }
-    getPayoutWatcher() {
-        this.fetchData();
-    }
-    fetchData() {
-        this.loading = true;
-        this.getPayout({
-            onSuccess: (payout) => {
-                this.errorMessage = null;
-                this.payout = payout;
-                this.loading = false;
-            },
-            onError: ({ error, code, severity }) => {
-                this.errorMessage = error;
-                this.errorEvent.emit({
-                    message: error,
-                    errorCode: code,
-                    severity,
-                });
-                this.loading = false;
-            },
-        });
-    }
-    formatMethod(deliveryMethod) {
-        if (deliveryMethod === "ach")
-            return "ACH";
-        return capitalizeFirstLetter(deliveryMethod);
-    }
-    render() {
-        var _a;
-        return (h(StyledHost, { key: '5331ce4651dd61c74b44010b88f272db42bbac16' }, this.loading && h(PayoutDetailsLoading, { key: '09f7bfcf6a4b9f34a9ef6f2600c4f3755b4abe84' }), !this.loading && this.errorMessage && ErrorState(this.errorMessage), !this.loading && this.payout && (h("justifi-details", { key: 'd76eaca9611e7c03d6d7d90d5bfcdc951cc626da', errorMessage: this.errorMessage }, h(EntityHeadInfo, { key: '099f51fbdb7a97e0d894437a945822d71973d322', slot: "head-info", badge: (h("div", { class: "d-flex gap-1" }, MapPayoutStatusToBadge((_a = this.payout) === null || _a === void 0 ? void 0 : _a.status), this.payout.settlement_priority === 'expedited' ? (h(Badge, { variant: BadgeVariant.WARNING, title: "Expedited", text: "Expedited" })) : (h(Badge, { variant: BadgeVariant.SECONDARY, title: "Standard", text: "Standard" })))), title: this.payout.formattedPaymentAmount(this.payout.amount) }, h(EntityHeadInfoItem, { key: '214a3726416272452258345d04d05792ad90115c', classes: "border-1 border-end", title: "Updated At", value: `${formatDate(this.payout.updated_at)} ${formatTime(this.payout.updated_at)}` }), h(EntityHeadInfoItem, { key: '9b6354d8a9e4b0eeec25a98047a0ab0748a5a3a2', classes: "border-1 border-end", title: "Created At", value: `${formatDate(this.payout.created_at)} ${formatTime(this.payout.created_at)}` }), h(EntityHeadInfoItem, { key: '91a07437ba0c01c1ff8d65309bfac5d2376fd693', title: "ID", value: this.payout.id }), h("div", { key: 'e73f76a1d3c6027eefe17ab1312948cdd5e1a958', class: "m-4" }, h(Button, { key: 'e64df6ed69aa41984a42ceda86fa3636fd90c6e8', variant: "outline-secondary", class: "btn btn-outline-secondary d-flex align-items-center", onClick: this.downloadCSV }, "Export CSV"))), h("div", { key: 'f95c3ab2d35aaf44577aafd63d8179e8de592b58', slot: 'detail-sections' }, h(DetailSectionTitle, { key: 'd0aae2552c2dc391d3b15971aa894a484fccbc2b', sectionTitle: "Details" }), h("div", { key: '22fee577f33a1e004d41ac81b478201637d96637', class: "d-flex flex-column gap-2 w-100" }, h(DetailItem, { key: 'd9bec4d7732334c2434b1e22954f85ad4a7af5d3', title: "Date paid", value: formatDate(this.payout.deposits_at) }), h(DetailItem, { key: '9e5fed1e45d2a532102bd47209036faddd38158e', title: "Statement Description", value: this.payout.description }), h(DetailItem, { key: '5313693f696e36f850b9f606ab9de8e4d24a0372', title: "Payout Method", value: this.formatMethod(this.payout.delivery_method) }), h(DetailItem, { key: '101f2d983df8e548391dc762ea06ed0c5979e466', title: "Amount", value: this.payout.formattedPaymentAmount(this.payout.amount) }), h(DetailItem, { key: '900b5dd485dd8b9ff6e5e49261afe742406c3f4c', title: "Fee", value: this.payout.formattedPaymentAmount(this.payout.fees_total) })), h(DetailSectionTitle, { key: 'ba09532b05fe7c3ef19f80908966a2ed1aec753c', sectionTitle: "Account" }), h("div", { key: '1322b4fb4868fbbad73a23ac534a66848e34e135', class: "d-flex flex-column gap-2 w-100" }, h(DetailItem, { key: '87e877e09482023959e09fdb30e1c339ecc195ef', title: "ID", value: this.payout.account_id, onClick: this.enableRecordClick ? () => this.handleRecordClick(this.payout.account_id) : undefined }), h(DetailItem, { key: '3457500267dc994aad32c675544fe6adc599c114', title: "Account Type", value: this.payout.bank_account.account_type }), h(DetailItem, { key: '32204b3a5448f2ad9c6cc3cfd621fe8076051f4b', title: "Institution", value: this.payout.bank_account.account_type }), h(DetailItem, { key: '87d31d5a177a5da328e653ea036ae16ec66838e3', title: "Routing Number", value: this.payout.bank_account.routing_number }), h(DetailItem, { key: '12b7c34a74afe9e54516f19d6ec5b344bf84b74f', title: "Account Number", value: `**** ${this.payout.bank_account.account_number_last4}` })), this.payout.metadata && [
-            h(DetailSectionTitle, { key: '73d264aa4b0e2fe8d980246dc35d78c350cf1c85', sectionTitle: 'Metadata' }),
-            h("div", { key: 'c405ec9594ddc8eb474f75837e4d5ef1b81f786b', class: "d-table gap-2 w-100" }, h(CodeBlock, { key: 'bfff7ebf154e20f3c35fb415de21ed80eb6f4ae9', metadata: this.payout.metadata }))
-        ])))));
-    }
-    static get is() { return "payout-details-core"; }
-    static get properties() {
-        return {
-            "getPayout": {
-                "type": "unknown",
-                "mutable": false,
-                "complexType": {
-                    "original": "Function",
-                    "resolved": "Function",
-                    "references": {
-                        "Function": {
-                            "location": "global",
-                            "id": "global::Function"
-                        }
-                    }
-                },
-                "required": true,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false
-            },
-            "getPayoutCSV": {
-                "type": "unknown",
-                "mutable": false,
-                "complexType": {
-                    "original": "Function",
-                    "resolved": "Function",
-                    "references": {
-                        "Function": {
-                            "location": "global",
-                            "id": "global::Function"
-                        }
-                    }
-                },
-                "required": true,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false
-            },
-            "enableRecordClick": {
-                "type": "boolean",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "enable-record-click",
-                "defaultValue": "false"
-            }
-        };
-    }
-    static get states() {
-        return {
-            "payout": {},
-            "loading": {},
-            "errorMessage": {}
-        };
-    }
-    static get events() {
-        return [{
-                "method": "errorEvent",
-                "name": "error-event",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "complexType": {
-                    "original": "ComponentErrorEvent",
-                    "resolved": "ComponentErrorEvent",
-                    "references": {
-                        "ComponentErrorEvent": {
-                            "location": "import",
-                            "path": "../../api/ComponentEvents",
-                            "id": "src/api/ComponentEvents.ts::ComponentErrorEvent"
-                        }
-                    }
-                }
-            }, {
-                "method": "recordClickEvent",
-                "name": "record-click-event",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "complexType": {
-                    "original": "RecordClickEvent",
-                    "resolved": "RecordClickEvent",
-                    "references": {
-                        "RecordClickEvent": {
-                            "location": "import",
-                            "path": "../../api/ComponentEvents",
-                            "id": "src/api/ComponentEvents.ts::RecordClickEvent"
-                        }
-                    }
-                }
-            }];
-    }
-    static get watchers() {
-        return [{
-                "propName": "getPayout",
-                "methodName": "getPayoutWatcher"
-            }];
-    }
-}

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

@@ -1,298 +0,0 @@
-import { h } from "@stencil/core";
-import { pagingDefaults } from "../../api";
-import { ComponentErrorCodes, ComponentErrorSeverity } from "../../api/ComponentError";
-import { TableEmptyState, TableErrorState, TableLoadingState } from "../../ui-components";
-import { payoutTableCells, payoutTableColumns } from "./payouts-table";
-import { Table } from "../../utils/table";
-import { getRequestParams, onQueryParamsChange } from "./payouts-list-params-state";
-import { TableWrapper, TableComponent, TableHead, TableHeadRow, TableBody, TableRow, TableFoot, TableFootRow, TableFootCell, TableClickActions } from "../../ui-components";
-export class PayoutsListCore {
-    constructor() {
-        this.payouts = [];
-        this.subAccounts = [];
-        this.loading = true;
-        this.paging = pagingDefaults;
-        this.pagingParams = {};
-        this.downloadCSV = (payoutId) => {
-            this.getPayoutCSV({
-                payoutId,
-                onError: () => {
-                    this.errorEvent.emit({
-                        errorCode: ComponentErrorCodes.FETCH_ERROR,
-                        message: 'Failed to download CSV',
-                        severity: ComponentErrorSeverity.ERROR,
-                    });
-                },
-            });
-        };
-        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 clickedRow = e.target.closest('tr');
-            const clickedPayoutID = clickedRow.dataset.rowEntityId;
-            if (!clickedPayoutID)
-                return;
-            const clickedCSV = clickedRow.querySelector('a');
-            if (clickedCSV === e.target)
-                return;
-            const payoutData = this.payouts.find((payout) => payout.id === clickedPayoutID);
-            this.clickEvent.emit({ name: TableClickActions.row, data: payoutData });
-        };
-    }
-    updateOnPropChange() {
-        this.fetchData();
-    }
-    componentWillLoad() {
-        this.payoutsTable = new Table(this.payouts, this.columns, payoutTableColumns, payoutTableCells(this.downloadCSV));
-        if (this.getPayouts && this.getSubAccounts) {
-            this.fetchData();
-        }
-        onQueryParamsChange('set', () => {
-            this.pagingParams = {};
-        });
-        onQueryParamsChange('reset', () => {
-            this.pagingParams = {};
-            this.errorMessage = '';
-        });
-    }
-    fetchData() {
-        this.loading = true;
-        this.getPayouts({
-            params: this.payoutParams,
-            onSuccess: ({ payouts, pagingInfo }) => {
-                this.payouts = payouts;
-                this.paging = pagingInfo;
-                this.payoutsTable.collectionData = this.payouts;
-                const shouldFetchSubAccounts = this.payoutsTable.columnKeys.includes('sub_account_name');
-                if (shouldFetchSubAccounts) {
-                    this.fetchSubAccounts();
-                }
-                else {
-                    this.loading = false;
-                }
-            },
-            onError: ({ error, code, severity }) => {
-                this.errorMessage = error;
-                this.errorEvent.emit({
-                    errorCode: code,
-                    message: error,
-                    severity,
-                });
-                this.loading = false;
-            },
-        });
-    }
-    async fetchSubAccounts() {
-        this.getSubAccounts({
-            params: this.subAccountParams,
-            onSuccess: ({ subAccounts }) => {
-                this.subAccounts = subAccounts;
-                this.payouts = this.payouts.map((payout) => {
-                    var _a;
-                    payout.sub_account_name = (_a = this.subAccounts.find((subAccount) => subAccount.id === payout.account_id)) === null || _a === void 0 ? void 0 : _a.name;
-                    return payout;
-                });
-                this.loading = false;
-            },
-            onError: ({ error, code, severity }) => {
-                this.errorMessage = error;
-                this.errorEvent.emit({
-                    errorCode: code,
-                    message: error,
-                    severity,
-                });
-                this.loading = false;
-            },
-        });
-    }
-    get payoutParams() {
-        const requestParams = getRequestParams();
-        const params = Object.assign(Object.assign({}, requestParams), this.pagingParams);
-        return params;
-    }
-    get subAccountParams() {
-        let accountIdNumbers = this.payouts.map((payout) => payout.account_id);
-        let uniqueAccountIds = [...new Set(accountIdNumbers)];
-        let accountIdString = uniqueAccountIds.join(',');
-        return { sub_account_id: accountIdString };
-    }
-    get entityId() {
-        return this.payouts.map((payout) => payout.id);
-    }
-    get showEmptyState() {
-        return !this.loading && !this.errorMessage && this.payoutsTable.rowData.length < 1;
-    }
-    get showErrorState() {
-        return !this.loading && !!this.errorMessage;
-    }
-    get showRowData() {
-        return !this.showEmptyState && !this.showErrorState && !this.loading;
-    }
-    render() {
-        return (h(TableWrapper, { key: '80772a12f138c9906749887058f49079ab857b6a' }, h(TableComponent, { key: '4ed3a5f0773518df02e003790885825e6c8bf0bd' }, h(TableHead, { key: 'a3ae17b83b6e90b6dc7558a45983550b2fb674f2' }, h(TableHeadRow, { key: '5bda85f446fb33e71c2982722162ac46547bb5f3' }, this.payoutsTable.columnData.map((column) => column))), h(TableBody, { key: '4188485efb53c82422c23d11aa133a071d5d9bfe' }, h(TableLoadingState, { key: '27aa3602348859491c7badcceb031176a35fa0c9', columnSpan: this.payoutsTable.columnKeys.length, isLoading: this.loading }), h(TableEmptyState, { key: 'f2b225ebe95336f28d6782e18840a94434231ecf', isEmpty: this.showEmptyState, columnSpan: this.payoutsTable.columnKeys.length }), h(TableErrorState, { key: 'ac5cc1731b9e08ef3d636ec24a47e64b34e3469e', columnSpan: this.payoutsTable.columnKeys.length, errorMessage: this.errorMessage }), this.showRowData && this.payoutsTable.rowData.map((data, index) => (h(TableRow, { "data-test-id": "table-row", "data-row-entity-id": this.entityId[index], onClick: this.rowClickHandler }, data)))), this.paging && (h(TableFoot, { key: '2dc513bfc54becb7e9ce21bed9380271a8b7ee40' }, h(TableFootRow, { key: 'e6b3e957d63914752853bacfd78a18e5edd50eb9' }, h(TableFootCell, { key: 'd1821d41d39bbccc0c0b535a02c490f81c91c634', colSpan: this.payoutsTable.columnData.length }, h("pagination-menu", { key: 'f5e770c21ebfc032d6147d7a49cfaad1cae053a9', 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",
-                "mutable": false,
-                "complexType": {
-                    "original": "Function",
-                    "resolved": "Function",
-                    "references": {
-                        "Function": {
-                            "location": "global",
-                            "id": "global::Function"
-                        }
-                    }
-                },
-                "required": true,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false
-            },
-            "getSubAccounts": {
-                "type": "unknown",
-                "mutable": false,
-                "complexType": {
-                    "original": "Function",
-                    "resolved": "Function",
-                    "references": {
-                        "Function": {
-                            "location": "global",
-                            "id": "global::Function"
-                        }
-                    }
-                },
-                "required": true,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false
-            },
-            "getPayoutCSV": {
-                "type": "unknown",
-                "mutable": false,
-                "complexType": {
-                    "original": "Function",
-                    "resolved": "Function",
-                    "references": {
-                        "Function": {
-                            "location": "global",
-                            "id": "global::Function"
-                        }
-                    }
-                },
-                "required": true,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false
-            },
-            "columns": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": true,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "columns"
-            }
-        };
-    }
-    static get states() {
-        return {
-            "payouts": {},
-            "payoutsTable": {},
-            "subAccounts": {},
-            "loading": {},
-            "errorMessage": {},
-            "paging": {},
-            "pagingParams": {}
-        };
-    }
-    static get events() {
-        return [{
-                "method": "clickEvent",
-                "name": "click-event",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "complexType": {
-                    "original": "ComponentClickEvent",
-                    "resolved": "ComponentClickEvent",
-                    "references": {
-                        "ComponentClickEvent": {
-                            "location": "import",
-                            "path": "../../api/ComponentEvents",
-                            "id": "src/api/ComponentEvents.ts::ComponentClickEvent"
-                        }
-                    }
-                }
-            }, {
-                "method": "errorEvent",
-                "name": "error-event",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "complexType": {
-                    "original": "ComponentErrorEvent",
-                    "resolved": "ComponentErrorEvent",
-                    "references": {
-                        "ComponentErrorEvent": {
-                            "location": "import",
-                            "path": "../../api/ComponentEvents",
-                            "id": "src/api/ComponentEvents.ts::ComponentErrorEvent"
-                        }
-                    }
-                }
-            }];
-    }
-    static get watchers() {
-        return [{
-                "propName": "pagingParams",
-                "methodName": "updateOnPropChange"
-            }, {
-                "propName": "getPayouts",
-                "methodName": "updateOnPropChange"
-            }, {
-                "propName": "getSubAccounts",
-                "methodName": "updateOnPropChange"
-            }];
-    }
-}