@justifi/webcomponents 6.12.3 → 6.13.0-rc.1

package/dist/cjs/justifi-qr-terminal.cjs.entry.js

@@ -0,0 +1,208 @@
+'use strict';
+
+var index = require('./index-p7cvUYAE.js');
+var checkoutActions = require('./checkout-actions-8-MUczKw.js');
+var checkout_service = require('./checkout.service-BYpinbSR.js');
+var Plaid = require('./Plaid-Aw35bhCX.js');
+var Analytics = require('./Analytics-Be2I_aiS.js');
+var checkPkgVersion = require('./check-pkg-version-BLLLh6v-.js');
+require('./utils-Dcde8Zpt.js');
+require('./Api-Bukk55YZ.js');
+require('./config-state-BIgGhhe9.js');
+require('./index-W-zoNiyM.js');
+require('./utils-BHi4j5rB.js');
+require('./dinero-BwNN_k7x.js');
+require('./Pagination-Dediz133.js');
+require('./Business-oBifyXkW.js');
+require('./package-gx36QXN1.js');
+
+const JustifiQrTerminal = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.checkoutCompleted = index.createEvent(this, "checkout-completed", 7);
+        this.checkoutExpired = index.createEvent(this, "checkout-expired", 7);
+        this.errorEvent = index.createEvent(this, "error-event", 7);
+        this.pollIntervalMs = 3000;
+        this.pollTimeoutMs = 600000;
+        this.terminalState = 'loading';
+        this.paymentStatus = '';
+        this.errorMessage = '';
+        this.pollIntervalHandle = null;
+        this.pollTimeoutHandle = null;
+        this.failedDismissHandle = null;
+        this.seenCompletionCreatedAts = new Set();
+        this.inFlight = false;
+    }
+    componentWillLoad() {
+        checkPkgVersion.checkPkgVersion();
+        this.analytics = new Analytics.JustifiAnalytics(this);
+        this.initialize();
+    }
+    disconnectedCallback() {
+        var _a;
+        this.stopAll();
+        (_a = this.analytics) === null || _a === void 0 ? void 0 : _a.cleanup();
+    }
+    propChanged() {
+        this.stopAll();
+        this.initialize();
+    }
+    suppressInnerErrors(event) {
+        // Suppress error-event bubbling from inner justifi-checkout-qr-code
+        event.stopPropagation();
+    }
+    get effectivePollInterval() {
+        return Math.max(1000, this.pollIntervalMs);
+    }
+    initialize() {
+        if (!this.authToken || !this.checkoutId) {
+            this.errorEvent.emit({
+                message: 'authToken and checkoutId are required',
+                errorCode: Plaid.ComponentErrorCodes.MISSING_PROPS,
+                severity: Plaid.ComponentErrorSeverity.ERROR,
+            });
+            return;
+        }
+        this.terminalState = 'loading';
+        this.getCheckout = checkoutActions.makeGetCheckout({
+            authToken: this.authToken,
+            checkoutId: this.checkoutId,
+            service: new checkout_service.CheckoutService(),
+        });
+        this.getCheckout({
+            onSuccess: ({ checkout }) => this.handleInitialLoad(checkout),
+            onError: ({ error, code, severity }) => {
+                this.terminalState = 'error';
+                this.errorMessage = error;
+                this.errorEvent.emit({ message: error, errorCode: code, severity });
+            },
+        });
+    }
+    handleInitialLoad(checkout) {
+        var _a;
+        switch (checkout.status) {
+            case Plaid.ICheckoutStatus.expired:
+                this.terminalState = 'expired';
+                this.checkoutExpired.emit({ checkoutId: this.checkoutId });
+                this.errorEvent.emit({
+                    message: Plaid.ComponentErrorMessages.CHECKOUT_EXPIRED,
+                    errorCode: Plaid.ComponentErrorCodes.CHECKOUT_EXPIRED,
+                    severity: Plaid.ComponentErrorSeverity.ERROR,
+                });
+                break;
+            case Plaid.ICheckoutStatus.completed:
+                this.terminalState = 'completed';
+                this.paymentStatus = this.resolvePaymentStatus(checkout);
+                this.checkoutCompleted.emit({ checkoutId: this.checkoutId, paymentStatus: this.paymentStatus });
+                break;
+            default:
+                ((_a = checkout.completions) !== null && _a !== void 0 ? _a : []).forEach((c) => this.seenCompletionCreatedAts.add(c.created_at));
+                this.terminalState = 'ready';
+                this.startPolling();
+                break;
+        }
+    }
+    startPolling() {
+        this.pollTimeoutHandle = setTimeout(() => {
+            this.stopAll();
+            this.terminalState = 'error';
+            this.errorMessage = 'Checkout polling timed out';
+            this.errorEvent.emit({
+                message: 'Checkout polling timed out',
+                errorCode: Plaid.ComponentErrorCodes.FETCH_ERROR,
+                severity: Plaid.ComponentErrorSeverity.ERROR,
+            });
+        }, this.pollTimeoutMs);
+        this.pollIntervalHandle = setInterval(() => this.tick(), this.effectivePollInterval);
+    }
+    tick() {
+        if (this.inFlight)
+            return;
+        this.inFlight = true;
+        this.getCheckout({
+            onSuccess: ({ checkout }) => {
+                this.inFlight = false;
+                this.handlePollResult(checkout);
+            },
+            onError: ({ error, code, severity }) => {
+                this.inFlight = false;
+                this.stopAll();
+                this.terminalState = 'error';
+                this.errorMessage = error;
+                this.errorEvent.emit({ message: error, errorCode: code, severity });
+            },
+        });
+    }
+    handlePollResult(checkout) {
+        var _a;
+        const completions = (_a = checkout.completions) !== null && _a !== void 0 ? _a : [];
+        const newFailures = completions.filter((c) => !this.seenCompletionCreatedAts.has(c.created_at) && c.payment_status === 'failed');
+        newFailures.forEach((c) => this.seenCompletionCreatedAts.add(c.created_at));
+        if (newFailures.length > 0) {
+            this.terminalState = 'payment-failed';
+            if (this.failedDismissHandle)
+                clearTimeout(this.failedDismissHandle);
+            this.failedDismissHandle = setTimeout(() => {
+                if (this.terminalState === 'payment-failed')
+                    this.terminalState = 'ready';
+            }, 3000);
+        }
+        if (checkout.status === Plaid.ICheckoutStatus.completed) {
+            this.stopAll();
+            this.terminalState = 'completed';
+            this.paymentStatus = this.resolvePaymentStatus(checkout);
+            this.checkoutCompleted.emit({ checkoutId: this.checkoutId, paymentStatus: this.paymentStatus });
+            return;
+        }
+        if (checkout.status === Plaid.ICheckoutStatus.expired) {
+            this.stopAll();
+            this.terminalState = 'expired';
+            this.checkoutExpired.emit({ checkoutId: this.checkoutId });
+            this.errorEvent.emit({
+                message: Plaid.ComponentErrorMessages.CHECKOUT_EXPIRED,
+                errorCode: Plaid.ComponentErrorCodes.CHECKOUT_EXPIRED,
+                severity: Plaid.ComponentErrorSeverity.ERROR,
+            });
+        }
+    }
+    resolvePaymentStatus(checkout) {
+        var _a, _b;
+        const completions = (_a = checkout.completions) !== null && _a !== void 0 ? _a : [];
+        const sorted = [...completions].sort((a, b) => new Date(b.updated_at).getTime() - new Date(a.updated_at).getTime());
+        const latestStatus = (_b = sorted[0]) === null || _b === void 0 ? void 0 : _b.payment_status;
+        if (latestStatus === Plaid.CompletionStatuses.succeeded)
+            return 'succeeded';
+        if (latestStatus == null) {
+            return checkout.successful_payment_id ? 'succeeded' : 'pending';
+        }
+        return 'pending';
+    }
+    stopAll() {
+        if (this.pollIntervalHandle) {
+            clearInterval(this.pollIntervalHandle);
+            this.pollIntervalHandle = null;
+        }
+        if (this.pollTimeoutHandle) {
+            clearTimeout(this.pollTimeoutHandle);
+            this.pollTimeoutHandle = null;
+        }
+        if (this.failedDismissHandle) {
+            clearTimeout(this.failedDismissHandle);
+            this.failedDismissHandle = null;
+        }
+        this.inFlight = false;
+    }
+    render() {
+        if (!this.authToken || !this.checkoutId)
+            return null;
+        return (index.h("div", null, this.terminalState === 'loading' && null, (this.terminalState === 'ready' || this.terminalState === 'payment-failed') && (index.h("div", null, index.h("justifi-checkout-qr-code", { checkoutId: this.checkoutId }), this.terminalState === 'payment-failed' && (index.h("p", null, "Payment failed. Please try again.")), this.terminalState === 'ready' && (index.h("p", null, "Scan to pay")))), this.terminalState === 'completed' && (index.h("div", null, this.paymentStatus === 'succeeded'
+            ? index.h("p", null, "Payment received")
+            : index.h("p", null, "Payment pending"))), this.terminalState === 'expired' && (index.h("p", null, "Checkout expired. Please create a new checkout.")), this.terminalState === 'error' && (index.h("p", null, this.errorMessage))));
+    }
+    static get watchers() { return {
+        "authToken": ["propChanged"],
+        "checkoutId": ["propChanged"]
+    }; }
+};
+
+exports.justifi_qr_terminal = JustifiQrTerminal;

package/dist/cjs/justifi-refund-payment.cjs.entry.js

@@ -4,25 +4,24 @@ var index = require('./index-p7cvUYAE.js');
 var index_esm = require('./index.esm-C1ZPG85l.js');
 var utils = require('./utils-BHi4j5rB.js');
 require('./config-state-BIgGhhe9.js');
-var Plaid = require('./Plaid-BlSGeGpn.js');
+var Plaid = require('./Plaid-Aw35bhCX.js');
 require('./Pagination-Dediz133.js');
 require('./Business-oBifyXkW.js');
-require('./Dispute-CruQTF6_.js');
 var button = require('./button-CR9Rl1-o.js');
 var styledHost = require('./styled-host-DAi5SuFa.js');
 require('./event-types-YOY5TKUN.js');
-var payment_service = require('./payment.service-sZKlg2Jq.js');
-var getPaymentDetails = require('./get-payment-details-DL5FmIyF.js');
-var Analytics = require('./Analytics-DcqsdFaD.js');
-var checkPkgVersion = require('./check-pkg-version-DFTQGZz1.js');
-var utils$1 = require('./utils-DbTucCTO.js');
+var payment_service = require('./payment.service-fy5bXXmA.js');
+var getPaymentDetails = require('./get-payment-details-BB5aa48u.js');
+var Analytics = require('./Analytics-Be2I_aiS.js');
+var checkPkgVersion = require('./check-pkg-version-BLLLh6v-.js');
+var utils$1 = require('./utils-Dcde8Zpt.js');
 var Api = require('./Api-Bukk55YZ.js');
 var skeleton = require('./skeleton-DvRCiQlA.js');
 require('./_commonjsHelpers-BJu3ubxk.js');
 require('./dinero-BwNN_k7x.js');
 require('./index-W-zoNiyM.js');
 require('./parts-BXshb_S-.js');
-require('./package-bM0MyhTf.js');
+require('./package-gx36QXN1.js');
 
 const amountValidation = (maxAmount) => {
     const max = +maxAmount;

package/dist/cjs/justifi-season-interruption-insurance.cjs.entry.js

@@ -2,13 +2,12 @@
 
 var index = require('./index-p7cvUYAE.js');
 var Api = require('./Api-Bukk55YZ.js');
-var Plaid = require('./Plaid-BlSGeGpn.js');
+var Plaid = require('./Plaid-Aw35bhCX.js');
 require('./Pagination-Dediz133.js');
 require('./Business-oBifyXkW.js');
-require('./Dispute-CruQTF6_.js');
-var utils = require('./utils-DbTucCTO.js');
-var Analytics = require('./Analytics-DcqsdFaD.js');
-var checkPkgVersion = require('./check-pkg-version-DFTQGZz1.js');
+var utils = require('./utils-Dcde8Zpt.js');
+var Analytics = require('./Analytics-Be2I_aiS.js');
+var checkPkgVersion = require('./check-pkg-version-BLLLh6v-.js');
 var checkout_store = require('./checkout.store-CztwuCnG.js');
 var utils$1 = require('./utils-BHi4j5rB.js');
 var insuranceState = require('./insurance-state-Xe2auE-N.js');
@@ -18,7 +17,7 @@ require('./event-types-YOY5TKUN.js');
 var skeleton = require('./skeleton-DvRCiQlA.js');
 require('./config-state-BIgGhhe9.js');
 require('./index-W-zoNiyM.js');
-require('./package-bM0MyhTf.js');
+require('./package-gx36QXN1.js');
 require('./index-CajjbB9t.js');
 require('./dinero-BwNN_k7x.js');
 

package/dist/cjs/justifi-skeleton.cjs.entry.js

@@ -10,7 +10,7 @@ const JustifiSkeleton = class {
         index.registerInstance(this, hostRef);
     }
     render() {
-        return (index.h(styledHost.StyledHost, { key: 'd19fcf55df4b5b001d31af93c263fef39fc0d160' }, index.h(skeleton.Skeleton, { key: '9ab49d76aa71146287fff2013050e008342f0275', component: this.component, height: this.height, width: this.width, className: this.class, styles: this.customStyle })));
+        return (index.h(styledHost.StyledHost, { key: 'c995981caeae785829f1ef75454b2759243e8adb' }, index.h(skeleton.Skeleton, { key: '9c63cf385499820bb1acd3503e126363485684f6', component: this.component, height: this.height, width: this.width, className: this.class, styles: this.customStyle })));
     }
 };
 

package/dist/cjs/justifi-terminal-orders-list-filters.cjs.entry.js

@@ -8,10 +8,9 @@ var styledHost = require('./styled-host-DAi5SuFa.js');
 require('./event-types-YOY5TKUN.js');
 require('./config-state-BIgGhhe9.js');
 var utils = require('./utils-BHi4j5rB.js');
-var Plaid = require('./Plaid-BlSGeGpn.js');
+var Plaid = require('./Plaid-Aw35bhCX.js');
 require('./Pagination-Dediz133.js');
 require('./Business-oBifyXkW.js');
-require('./Dispute-CruQTF6_.js');
 require('./_commonjsHelpers-BJu3ubxk.js');
 require('./index-W-zoNiyM.js');
 require('./dinero-BwNN_k7x.js');
@@ -62,9 +61,9 @@ const JustifiTerminalOrdersListFilters = class {
     }
     render() {
         const filterMenuParams = Object.assign({}, terminalOrdersListParamsState.filterParams);
-        return (index.h(styledHost.StyledHost, { key: 'cc09bb58c13ab0b26d92eb164cf6bc43a3c96c63' }, index.h("table-filters-menu", { key: '08369c471d891184e36dd6c5aae8842e0df5c01a', params: filterMenuParams, clearParams: terminalOrdersListParamsState.clearParams, part: parts.filterMenu }, index.h("div", { key: 'addd8a1cf74ae9e80cc8e4374a36400204c81400', class: "grid-cols-2 gap-3 p-1" }, index.h("div", { key: 'b74cf4d1d13a0a6250000c8f7f0845f4c907e488', class: "p-2" }, index.h("form-control-select", { key: 'b1b060b64f67695bb395488fa23dcbf6373b419b', name: "order_status", label: "Order Status", options: this.terminalOrderStatusOptions, inputHandler: this.setParamsOnChange, defaultValue: this.orderStatus || terminalOrdersListParamsState.filterParams.order_status || '', disabled: !!this.orderStatus, part: parts.filterParam })), index.h("div", { key: 'a3c06691181d01d6a664016b4add0784b23ab06c', class: "p-2" }, index.h("form-control-select", { key: '376039e2f10fbcc9ed008611d4976cf6412c16a4', name: "order_type", label: "Order Type", options: this.terminalOrderTypeOptions, inputHandler: this.setParamsOnChange, defaultValue: this.orderType || terminalOrdersListParamsState.filterParams.order_type || '', disabled: !!this.orderType, part: parts.filterParam })), index.h("div", { key: 'f03c94412b7861d255dfdef98a4c2fad14e96cfa', class: "p-2" }, index.h("form-control-date", { key: 'd7588c4ecda9480881e0f67e0418b1e475db188c', name: "created_after", label: "Created After", inputHandler: this.handleDateInput, defaultValue: utils.convertToLocal(this.createdAfter, { showInputDateTime: true }) ||
-                utils.convertToLocal(terminalOrdersListParamsState.filterParams.created_after, { showInputDateTime: true }), showTime: true, disabled: !!this.createdAfter, part: parts.filterParam })), index.h("div", { key: '76f0cee7430e846a479478c903d892ac05490787', class: "p-2" }, index.h("form-control-date", { key: 'ce0f99ebfa8a82111689ae6ee4cc1d8bd141d657', name: "created_before", label: "Created Before", inputHandler: this.handleDateInput, defaultValue: utils.convertToLocal(this.createdBefore, { showInputDateTime: true }) ||
-                utils.convertToLocal(terminalOrdersListParamsState.filterParams.created_before, { showInputDateTime: true }), showTime: true, disabled: !!this.createdBefore, part: parts.filterParam })), index.h("div", { key: '5c06fefb50c8c987a8e55623cba70a39cc64bbe1', class: "p-2" }, index.h("form-control-text", { key: '0a24516bbf665784e5c13a16b0b38be2bafb684b', name: "company_name", label: "Company Name", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.companyName || terminalOrdersListParamsState.filterParams.company_name, disabled: !!this.companyName, part: parts.filterParam }))))));
+        return (index.h(styledHost.StyledHost, { key: '05cb917a4f8573a7b2296b7f5eab4d8196fd291b' }, index.h("table-filters-menu", { key: '2dbd9b8b18c77fab46e010a75150d9addb50f2e2', params: filterMenuParams, clearParams: terminalOrdersListParamsState.clearParams, part: parts.filterMenu }, index.h("div", { key: 'cde85cfbaf0a8964fec8559da8f49ec05117adcc', class: "grid-cols-2 gap-3 p-1" }, index.h("div", { key: '51f107f1b8fb27bf1efb05b1421b8623fbd759f0', class: "p-2" }, index.h("form-control-select", { key: '97b151015f75b866867921aaa7c8ad8fb299d68f', name: "order_status", label: "Order Status", options: this.terminalOrderStatusOptions, inputHandler: this.setParamsOnChange, defaultValue: this.orderStatus || terminalOrdersListParamsState.filterParams.order_status || '', disabled: !!this.orderStatus, part: parts.filterParam })), index.h("div", { key: '0a25022bd038dbbb21ddc8ca10f69cee88824597', class: "p-2" }, index.h("form-control-select", { key: '0df794e038df12ee6707616b93c4d39dfe76d287', name: "order_type", label: "Order Type", options: this.terminalOrderTypeOptions, inputHandler: this.setParamsOnChange, defaultValue: this.orderType || terminalOrdersListParamsState.filterParams.order_type || '', disabled: !!this.orderType, part: parts.filterParam })), index.h("div", { key: 'd108794b60a691b0071359082ce6e6a1fc04543d', class: "p-2" }, index.h("form-control-date", { key: 'f36c5dc32d48d7c0986fe95c2c496fcd32de189c', name: "created_after", label: "Created After", inputHandler: this.handleDateInput, defaultValue: utils.convertToLocal(this.createdAfter, { showInputDateTime: true }) ||
+                utils.convertToLocal(terminalOrdersListParamsState.filterParams.created_after, { showInputDateTime: true }), showTime: true, disabled: !!this.createdAfter, part: parts.filterParam })), index.h("div", { key: 'd1be3f6dc5ade503cb1a15089d491fa46391fa8b', class: "p-2" }, index.h("form-control-date", { key: '5dfe0ab05fb5f9297f2434aa26c83ad4831c3f73', name: "created_before", label: "Created Before", inputHandler: this.handleDateInput, defaultValue: utils.convertToLocal(this.createdBefore, { showInputDateTime: true }) ||
+                utils.convertToLocal(terminalOrdersListParamsState.filterParams.created_before, { showInputDateTime: true }), showTime: true, disabled: !!this.createdBefore, part: parts.filterParam })), index.h("div", { key: '13039fea471c09505187e8ea1bfbe67ced259572', class: "p-2" }, index.h("form-control-text", { key: 'b7b4307513b3f73c860138863da80ea372f2d726', name: "company_name", label: "Company Name", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.companyName || terminalOrdersListParamsState.filterParams.company_name, disabled: !!this.companyName, part: parts.filterParam }))))));
     }
 };
 

package/dist/cjs/justifi-terminal-orders-list.cjs.entry.js

@@ -2,24 +2,93 @@
 
 var index = require('./index-p7cvUYAE.js');
 var styledHost = require('./styled-host-DAi5SuFa.js');
-require('./event-types-YOY5TKUN.js');
-var checkPkgVersion = require('./check-pkg-version-DFTQGZz1.js');
-var terminalOrdersTable = require('./terminal-orders-table-Cz6qvzVE.js');
+var table = require('./table-DjbNv28p.js');
+var eventTypes = require('./event-types-YOY5TKUN.js');
+var checkPkgVersion = require('./check-pkg-version-BLLLh6v-.js');
+var parts = require('./parts-BXshb_S-.js');
+var utils = require('./utils-BHi4j5rB.js');
 require('./config-state-BIgGhhe9.js');
-require('./dinero-BwNN_k7x.js');
-var Plaid = require('./Plaid-BlSGeGpn.js');
-require('./Pagination-Dediz133.js');
+var Plaid = require('./Plaid-Aw35bhCX.js');
+var Pagination = require('./Pagination-Dediz133.js');
 require('./Business-oBifyXkW.js');
-require('./Dispute-CruQTF6_.js');
-var utils = require('./utils-DbTucCTO.js');
+var badge = require('./badge-GBNtUypt.js');
+require('./dinero-BwNN_k7x.js');
+var utils$1 = require('./utils-Dcde8Zpt.js');
 var Api = require('./Api-Bukk55YZ.js');
-var Analytics = require('./Analytics-DcqsdFaD.js');
-require('./package-bM0MyhTf.js');
-require('./parts-BXshb_S-.js');
-require('./utils-BHi4j5rB.js');
-require('./badge-GBNtUypt.js');
+var Analytics = require('./Analytics-Be2I_aiS.js');
+var terminalOrdersListParamsState = require('./terminal-orders-list-params-state-vGJZ6Oe2.js');
+require('./spinner-C6ZGOB2P.js');
+require('./package-gx36QXN1.js');
 require('./index-W-zoNiyM.js');
 
+const MapTerminalOrderStatusToBadge = (status) => {
+    const statusToBadgeProps = {
+        submitted: {
+            variant: badge.BadgeVariant.PRIMARY,
+            title: 'This order is submitted',
+            text: 'Submitted',
+        },
+        completed: {
+            variant: badge.BadgeVariant.SUCCESS,
+            title: 'This order has been completed',
+            text: 'Completed',
+        },
+        created: {
+            variant: badge.BadgeVariant.SECONDARY,
+            title: 'This order is created',
+            text: 'Created',
+        },
+        in_progress: {
+            variant: badge.BadgeVariant.PRIMARY,
+            title: 'This order is in progress',
+            text: 'In Progress',
+        },
+        on_hold: {
+            variant: badge.BadgeVariant.WARNING,
+            title: 'This order is on hold',
+            text: 'On Hold',
+        },
+        canceled: {
+            variant: badge.BadgeVariant.DANGER,
+            title: 'This order is canceled',
+            text: 'Canceled',
+        }
+    };
+    const badgeProps = statusToBadgeProps[status];
+    return index.h(badge.Badge, Object.assign({}, badgeProps));
+};
+
+const defaultColumnsKeys = 'created_at,updated_at,order_status,quantity';
+const terminalOrdersTableColumns = {
+    created_at: () => (index.h("th", { part: parts.tableHeadCell, scope: "col", title: "The date and time the order was created" }, "Created At")),
+    updated_at: () => (index.h("th", { part: parts.tableHeadCell, scope: "col", title: "The date and time the order was last updated" }, "Updated At")),
+    order_status: () => (index.h("th", { part: parts.tableHeadCell, scope: "col", title: "The current status of the order" }, "Order Status")),
+    business_id: () => (index.h("th", { part: parts.tableHeadCell, scope: "col", title: "The business ID associated with the order" }, "Business ID")),
+    company_name: () => (index.h("th", { part: parts.tableHeadCell, scope: "col", title: "The business name associated with the order" }, "Business Name")),
+    provider: () => (index.h("th", { part: parts.tableHeadCell, scope: "col", title: "The provider associated with the order" }, "Provider")),
+    order_type: () => (index.h("th", { part: parts.tableHeadCell, scope: "col", title: "The type of order" }, "Order Type")),
+    quantity: () => (index.h("th", { part: parts.tableHeadCell, scope: "col", title: "The number of terminals associated with the order" }, "Order Quantity")),
+};
+const terminalOrdersTableCells = {
+    created_at: (terminalOrder, index$1) => (index.h("td", { part: parts.getAlternateTableCellPart(index$1) }, index.h("div", { class: "fw-bold" }, utils.convertToLocal(terminalOrder.created_at, { showDisplayDate: true })), index.h("div", { class: "fw-bold" }, utils.convertToLocal(terminalOrder.created_at, { showTime: true })))),
+    updated_at: (terminalOrder, index$1) => (index.h("td", { part: parts.getAlternateTableCellPart(index$1) }, index.h("div", { class: "fw-bold" }, utils.convertToLocal(terminalOrder.updated_at, { showDisplayDate: true })), index.h("div", { class: "fw-bold" }, utils.convertToLocal(terminalOrder.updated_at, { showTime: true })))),
+    order_status: (terminalOrder, index$1) => (index.h("td", { part: parts.getAlternateTableCellPart(index$1) }, MapTerminalOrderStatusToBadge(terminalOrder.order_status))),
+    business_id: (terminalOrder, index$1) => (index.h("td", { part: parts.getAlternateTableCellPart(index$1) }, terminalOrder.business_id)),
+    company_name: (terminalOrder, index$1) => (index.h("td", { part: parts.getAlternateTableCellPart(index$1) }, terminalOrder.company_name)),
+    provider: (terminalOrder, index$1) => (index.h("td", { part: parts.getAlternateTableCellPart(index$1) }, terminalOrder.provider)),
+    order_type: (terminalOrder, index$1) => {
+        let orderType;
+        if (terminalOrder.order_type === Plaid.TerminalOrderType.boardingOnly) {
+            orderType = 'Boarding Only';
+        }
+        else if (terminalOrder.order_type === Plaid.TerminalOrderType.boardingShipping) {
+            orderType = 'Boarding & Shipping';
+        }
+        return (index.h("td", { part: parts.getAlternateTableCellPart(index$1) }, orderType));
+    },
+    quantity: (terminalOrder, index$1) => (index.h("td", { part: parts.getAlternateTableCellPart(index$1) }, terminalOrder.terminals.length)),
+};
+
 const makeGetTerminalOrders = ({ id, authToken, service }) => async ({ params, onSuccess, onError, final }) => {
     var _a, _b;
     try {
@@ -30,8 +99,8 @@ const makeGetTerminalOrders = ({ id, authToken, service }) => async ({ params, o
             onSuccess({ terminalOrders, pagingInfo });
         }
         else {
-            const responseError = utils.getErrorMessage(response.error);
-            const code = utils.getErrorCode((_b = response.error) === null || _b === void 0 ? void 0 : _b.code);
+            const responseError = utils$1.getErrorMessage(response.error);
+            const code = utils$1.getErrorCode((_b = response.error) === null || _b === void 0 ? void 0 : _b.code);
             return onError({
                 error: responseError,
                 code,
@@ -40,7 +109,7 @@ const makeGetTerminalOrders = ({ id, authToken, service }) => async ({ params, o
         }
     }
     catch (error) {
-        const code = utils.getErrorCode(error === null || error === void 0 ? void 0 : error.code);
+        const code = utils$1.getErrorCode(error === null || error === void 0 ? void 0 : error.code);
         return onError({
             error: error.message || error,
             code,
@@ -64,30 +133,66 @@ class TerminalOrderService {
 const JustifiTerminalOrdersList = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
+        this.clickEvent = index.createEvent(this, "click-event", 7);
         this.errorEvent = index.createEvent(this, "error-event", 7);
-        this.errorMessage = null;
-        this.columns = terminalOrdersTable.defaultColumnsKeys;
-        this.handleErrorEvent = (event) => {
-            this.errorMessage = event.detail.message;
-            this.errorEvent.emit(event.detail);
+        this.columns = defaultColumnsKeys;
+        this.terminalOrders = [];
+        this.loading = true;
+        this.paging = Pagination.pagingDefaults;
+        this.pagingParams = {};
+        this.handleClickPrevious = (beforeCursor) => {
+            this.pagingParams = { before_cursor: beforeCursor };
+            this.clickEvent.emit({ name: eventTypes.TableClickActions.previous });
+        };
+        this.handleClickNext = (afterCursor) => {
+            this.pagingParams = { after_cursor: afterCursor };
+            this.clickEvent.emit({ name: eventTypes.TableClickActions.next });
+        };
+        this.rowClickHandler = (e) => {
+            const clickedOrderId = e.target.closest('tr').dataset.rowEntityId;
+            if (!clickedOrderId)
+                return;
+            const orderData = this.terminalOrders.find((order) => order.id === clickedOrderId);
+            this.clickEvent.emit({ name: eventTypes.TableClickActions.row, data: orderData });
         };
     }
     componentWillLoad() {
         checkPkgVersion.checkPkgVersion();
         this.analytics = new Analytics.JustifiAnalytics(this);
+        this.terminalOrdersTable = new table.Table(this.terminalOrders, this.columns, terminalOrdersTableColumns, terminalOrdersTableCells);
         this.initializeGetData();
+        if (this.getTerminalOrders) {
+            this.fetchData();
+        }
+        terminalOrdersListParamsState.onQueryParamsChange('set', () => {
+            this.pagingParams = {};
+        });
+        terminalOrdersListParamsState.onQueryParamsChange('reset', () => {
+            this.pagingParams = {};
+            this.errorMessage = '';
+        });
     }
     disconnectedCallback() {
         var _a;
         (_a = this.analytics) === null || _a === void 0 ? void 0 : _a.cleanup();
     }
-    ;
+    authPropChanged() {
+        this.initializeGetData();
+        if (this.getTerminalOrders) {
+            this.fetchData();
+        }
+    }
+    pagingOrColumnsChanged() {
+        if (this.getTerminalOrders) {
+            this.fetchData();
+        }
+    }
     initializeGetData() {
         if (this.accountId && this.authToken) {
             this.getTerminalOrders = makeGetTerminalOrders({
                 id: this.accountId,
                 authToken: this.authToken,
-                service: new TerminalOrderService()
+                service: new TerminalOrderService(),
             });
         }
         else {
@@ -99,9 +204,58 @@ const JustifiTerminalOrdersList = class {
             });
         }
     }
+    fetchData() {
+        if (!this.getTerminalOrders) {
+            return;
+        }
+        this.loading = true;
+        this.getTerminalOrders({
+            params: this.terminalOrderParams,
+            onSuccess: async ({ terminalOrders, pagingInfo }) => {
+                this.terminalOrders = terminalOrders;
+                this.paging = pagingInfo;
+                this.terminalOrdersTable.collectionData = this.terminalOrders;
+            },
+            onError: ({ error, code, severity }) => {
+                this.errorMessage = error;
+                this.errorEvent.emit({
+                    errorCode: code,
+                    message: error,
+                    severity,
+                });
+            },
+            final: () => {
+                this.loading = false;
+            },
+        });
+    }
+    get terminalOrderParams() {
+        const requestParams = terminalOrdersListParamsState.getRequestParams();
+        const params = Object.assign(Object.assign({}, requestParams), this.pagingParams);
+        return params;
+    }
+    get entityId() {
+        return this.terminalOrders.map((terminalOrder) => terminalOrder.id);
+    }
+    get showEmptyState() {
+        return !this.loading && !this.errorMessage && this.terminalOrdersTable.rowData.length < 1;
+    }
+    get showErrorState() {
+        return !this.loading && !!this.errorMessage;
+    }
+    get showRowData() {
+        return !this.showEmptyState && !this.showErrorState && !this.loading;
+    }
     render() {
-        return (index.h(styledHost.StyledHost, { key: '65330929a53f4e5e07177541460ccce864edd3ec' }, index.h("terminal-orders-list-core", { key: '79d4bc028395ede9b9f2e2c12729cc20532ef251', getTerminalOrders: this.getTerminalOrders, "onError-event": this.handleErrorEvent, columns: this.columns })));
+        return (index.h(styledHost.StyledHost, { key: 'e544fa99091ff8e0601388c4663f536304caef7c' }, index.h(table.TableWrapper, { key: 'df2a311d1052b284d458f29a87ea5a78db145406' }, index.h(table.TableComponent, { key: '9d3d6997f5fa8581fafa34e13a9981e75075ccc3' }, index.h(table.TableHead, { key: '30ee9315492e30913de3ef73db7c4e13e6a0d5bc' }, index.h(table.TableHeadRow, { key: 'f8fd993e7f19e3ac6b41e8eaff849a7ab66b2d41' }, this.terminalOrdersTable.columnData.map((column) => column))), index.h(table.TableBody, { key: '75ddd58ba3a713b8f38a6e40de06d26ed06d63a7' }, index.h(table.TableLoadingState, { key: '4509782ba93ff9d5d9057a23daa9720da4ec0f0e', columnSpan: this.terminalOrdersTable.columnKeys.length, isLoading: this.loading }), index.h(table.TableEmptyState, { key: '8aed10b38ac78e9ce3e5c8f96c2eb143412f3661', isEmpty: this.showEmptyState, columnSpan: this.terminalOrdersTable.columnKeys.length }), index.h(table.TableErrorState, { key: '94f11381660568de3181fe7c70335e7c264c9e44', columnSpan: this.terminalOrdersTable.columnKeys.length, errorMessage: this.errorMessage }), this.showRowData &&
+            this.terminalOrdersTable.rowData.map((data, index$1) => (index.h(table.TableRow, { "data-test-id": "table-row", "data-row-entity-id": this.entityId[index$1], onClick: this.rowClickHandler }, data)))), this.paging && (index.h(table.TableFoot, { key: 'c980e0fc6b236973e6bdf4ab0a5beece872ed4e6' }, index.h(table.TableFootRow, { key: 'c6431bfb8e38839d48b2d7fb8d85a8c64981f057' }, index.h(table.TableFootCell, { key: '6c7fc01e316acfcee6e33b583b97b040ce88efaf', colSpan: this.terminalOrdersTable.columnData.length }, index.h("pagination-menu", { key: '2ac492d001dc88663b575258a8828964b20d6d68', paging: Object.assign(Object.assign({}, this.paging), { handleClickPrevious: this.handleClickPrevious, handleClickNext: this.handleClickNext }) })))))))));
     }
+    static get watchers() { return {
+        "accountId": ["authPropChanged"],
+        "authToken": ["authPropChanged"],
+        "pagingParams": ["pagingOrColumnsChanged"],
+        "columns": ["pagingOrColumnsChanged"]
+    }; }
 };
 
 exports.justifi_terminal_orders_list = JustifiTerminalOrdersList;

package/dist/cjs/justifi-terminals-list-filters.cjs.entry.js

@@ -8,10 +8,9 @@ var parts = require('./parts-BXshb_S-.js');
 var styledHost = require('./styled-host-DAi5SuFa.js');
 require('./event-types-YOY5TKUN.js');
 require('./config-state-BIgGhhe9.js');
-var Plaid = require('./Plaid-BlSGeGpn.js');
+var Plaid = require('./Plaid-Aw35bhCX.js');
 require('./Pagination-Dediz133.js');
 require('./Business-oBifyXkW.js');
-require('./Dispute-CruQTF6_.js');
 require('./_commonjsHelpers-BJu3ubxk.js');
 require('./dinero-BwNN_k7x.js');
 require('./index-W-zoNiyM.js');
@@ -57,7 +56,7 @@ const JustifiTerminalsListFilters = class {
     }
     render() {
         const filterMenuParams = Object.assign({}, terminalsListParamsState.filterParams);
-        return (index.h(styledHost.StyledHost, { key: '77a3937540cd75a7cc51a90b1cd7c7c52ae870b2' }, index.h("table-filters-menu", { key: '4a725bfe0b79d0046eea2f7b3e3fe295b5384b94', params: filterMenuParams, clearParams: terminalsListParamsState.clearParams, part: parts.filterMenu }, index.h("div", { key: '0cb6fcedf45371c68b8b37e8b832ca3e9b48789e', class: "grid-cols-2 gap-3 p-1" }, index.h("div", { key: '602fc95acdd62112bc53f858073e936f9bf5e48d', class: "p-2" }, index.h("form-control-text", { key: 'c4e8dc476d2d8d80f2367ab6f8a5e5db17a72f15', name: "terminal_id", label: "Terminal ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.terminalId || terminalsListParamsState.filterParams.terminal_id, disabled: !!this.terminalId, part: parts.filterParam })), index.h("div", { key: 'e83b3b3ef5f1509286cabaee9faeb96cd7d9e15a', class: "p-2" }, index.h("form-control-text", { key: '2f6eb9224740f327ce5019d93d879c231df8b0ee', name: "terminal_order_id", label: "Terminal Order ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.terminalOrderId || terminalsListParamsState.filterParams.terminal_order_id, disabled: !!this.terminalOrderId, part: parts.filterParam })), index.h("div", { key: '942179e72ce3b8fea5c2cd2dd28aeecd586bdb6c', class: "p-2" }, index.h("form-control-text", { key: 'adb7eaab71834c2c619a09f9053dd8374a8bdfcc', name: "provider_id", label: "Device ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.providerId || terminalsListParamsState.filterParams.provider_id, disabled: !!this.providerId, part: parts.filterParam })), index.h("div", { key: 'c15d630d0c3500d26720db63cbf90098b837ee24', class: "p-2" }, index.h("form-control-text", { key: '93f4e6c1e5c8f7e853111e74e25946fd683c5a17', name: "serial_number", label: "Serial Number", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.serialNumber || terminalsListParamsState.filterParams.serial_number, disabled: !!this.serialNumber, part: parts.filterParam })), index.h("div", { key: '6a269a0c2fb90fb4e00b05d4aeee3fff4ab4e967', class: "p-2" }, index.h("form-control-select", { key: 'f6d9e45354d5c3d8894fe442d0bef490bafb20de', name: "status", label: "Status", options: this.terminalStatusOptions, inputHandler: this.setParamsOnChange, defaultValue: this.terminalStatus || terminalsListParamsState.filterParams.status || '', disabled: !!this.terminalStatus, part: parts.filterParam })), index.h("div", { key: 'ea70b109bd231bd085bb2cb8388d8010e0c5aa79', class: "p-2" }, index.h("form-control-date", { key: '256cddfb0e68590bc8d8403aa8a033ad40d613fe', name: "created_after", label: "Created After", inputHandler: this.handleDateInput, defaultValue: utils.convertToLocal(this.createdAfter || terminalsListParamsState.filterParams.created_after, { showInputDateTime: true }), showTime: true, disabled: !!this.createdAfter, part: parts.filterParam })), index.h("div", { key: '1be9bf8d68c691f09d40db9c45d78ed923fb3d86', class: "p-2" }, index.h("form-control-date", { key: '79d48b277064373e3faf999ae8771a44b35de1cb', name: "created_before", label: "Created Before", inputHandler: this.handleDateInput, defaultValue: utils.convertToLocal(this.createdBefore || terminalsListParamsState.filterParams.created_before, { showInputDateTime: true }), showTime: true, disabled: !!this.createdBefore, part: parts.filterParam }))))));
+        return (index.h(styledHost.StyledHost, { key: 'fbdb69bdc60f2c3c9caacf287229ee3d0644fcfb' }, index.h("table-filters-menu", { key: '7f6649444863079f885aff24d554077800b42021', params: filterMenuParams, clearParams: terminalsListParamsState.clearParams, part: parts.filterMenu }, index.h("div", { key: '7277b0cf678494ca3c227abeb76a03e5bd80c522', class: "grid-cols-2 gap-3 p-1" }, index.h("div", { key: '06a3a26492844e37536f1d8d074af69078a70074', class: "p-2" }, index.h("form-control-text", { key: 'f37cc48a754dd0ef12405f3cbcfb10a9c099eb56', name: "terminal_id", label: "Terminal ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.terminalId || terminalsListParamsState.filterParams.terminal_id, disabled: !!this.terminalId, part: parts.filterParam })), index.h("div", { key: '8a3638c23a774c566cfee5aba8b17ab9c7ec9419', class: "p-2" }, index.h("form-control-text", { key: '113ded1ef867fcdab00f8c048b56219d6c5fe51d', name: "terminal_order_id", label: "Terminal Order ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.terminalOrderId || terminalsListParamsState.filterParams.terminal_order_id, disabled: !!this.terminalOrderId, part: parts.filterParam })), index.h("div", { key: '32dbef16165a0a762ad206eb5ce495b898770052', class: "p-2" }, index.h("form-control-text", { key: '0d5827915c2962d78975d7c648b874cd8346043d', name: "provider_id", label: "Device ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.providerId || terminalsListParamsState.filterParams.provider_id, disabled: !!this.providerId, part: parts.filterParam })), index.h("div", { key: '01442ae3aeb6613caaadf3e7f92a910970b315da', class: "p-2" }, index.h("form-control-text", { key: '5b8ab5d31ef77609b8d5656a8e5a4e31c8b010a6', name: "serial_number", label: "Serial Number", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.serialNumber || terminalsListParamsState.filterParams.serial_number, disabled: !!this.serialNumber, part: parts.filterParam })), index.h("div", { key: 'e6b5bae11d8e9e72fe48626ce3663b0c65186700', class: "p-2" }, index.h("form-control-select", { key: 'df256ff824ae41eb65c2276481d8d6b63d3bc5a5', name: "status", label: "Status", options: this.terminalStatusOptions, inputHandler: this.setParamsOnChange, defaultValue: this.terminalStatus || terminalsListParamsState.filterParams.status || '', disabled: !!this.terminalStatus, part: parts.filterParam })), index.h("div", { key: '452b838d823484cb79569fde263228c0b5ac1e04', class: "p-2" }, index.h("form-control-date", { key: 'cd6705ac2ffce5496382b5ded1973784f863ac4e', name: "created_after", label: "Created After", inputHandler: this.handleDateInput, defaultValue: utils.convertToLocal(this.createdAfter || terminalsListParamsState.filterParams.created_after, { showInputDateTime: true }), showTime: true, disabled: !!this.createdAfter, part: parts.filterParam })), index.h("div", { key: 'fd396d846e420a5f750ce371c04c883a7e478b44', class: "p-2" }, index.h("form-control-date", { key: '852c044ce6154fc5f4382a0dd55b287e4b6370ac', name: "created_before", label: "Created Before", inputHandler: this.handleDateInput, defaultValue: utils.convertToLocal(this.createdBefore || terminalsListParamsState.filterParams.created_before, { showInputDateTime: true }), showTime: true, disabled: !!this.createdBefore, part: parts.filterParam }))))));
     }
 };