@justifi/webcomponents 6.10.4 → 6.12.0

package/dist/collection/components/modular-checkout/sub-components/justifi-card-form.js

@@ -0,0 +1,69 @@
+import { h } from "@stencil/core";
+import JustifiAnalytics from "../../../api/Analytics";
+import { checkPkgVersion } from "../../../utils/check-pkg-version";
+import { waitForConfig } from "../../config-provider/config-state";
+import { StyledHost } from "../../../ui-components";
+export class JustifiCardForm {
+    async componentWillLoad() {
+        await waitForConfig();
+        checkPkgVersion();
+        this.analytics = new JustifiAnalytics(this);
+    }
+    disconnectedCallback() {
+        var _a;
+        (_a = this.analytics) === null || _a === void 0 ? void 0 : _a.cleanup();
+    }
+    async validate() {
+        return this.cardFormElement.validate();
+    }
+    async tokenize({ clientId, paymentMethodMetadata, account, }) {
+        return this.cardFormElement.tokenize({ clientId, paymentMethodMetadata, account });
+    }
+    render() {
+        return (h(StyledHost, { key: '50a01710ce00b5821259ca5742df7d4dce97fba4' }, h("card-form", { key: 'bd5426a1aa6270dc45492115000bb5aac9466fd8', ref: (el) => (this.cardFormElement = el) })));
+    }
+    static get is() { return "justifi-card-form"; }
+    static get encapsulation() { return "shadow"; }
+    static get methods() {
+        return {
+            "validate": {
+                "complexType": {
+                    "signature": "() => Promise<any>",
+                    "parameters": [],
+                    "references": {
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
+                        }
+                    },
+                    "return": "Promise<any>"
+                },
+                "docs": {
+                    "text": "",
+                    "tags": []
+                }
+            },
+            "tokenize": {
+                "complexType": {
+                    "signature": "({ clientId, paymentMethodMetadata, account, }: { clientId: string; paymentMethodMetadata: any; account?: string; }) => Promise<any>",
+                    "parameters": [{
+                            "name": "__0",
+                            "type": "{ clientId: string; paymentMethodMetadata: any; account?: string; }",
+                            "docs": ""
+                        }],
+                    "references": {
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
+                        }
+                    },
+                    "return": "Promise<any>"
+                },
+                "docs": {
+                    "text": "",
+                    "tags": []
+                }
+            }
+        };
+    }
+}

package/dist/collection/components/modular-checkout/sub-components/justifi-checkout-summary.js

@@ -0,0 +1,12 @@
+import { h } from "@stencil/core";
+import { text } from "../../../styles/parts";
+import { formatCurrency } from "../../../utils/utils";
+import { checkoutStore } from "../../../store/checkout.store";
+import { StyledHost } from "../../../ui-components";
+export class JustifiCheckoutSummary {
+    render() {
+        return (h(StyledHost, { key: '43b48a771bd617b3b3481e0976aa50b6b63e2d6e' }, h("section", { key: 'e112a767fef56b095f002dfb272a43eda42ede46' }, h("div", { key: '079ce3aa4eb74004f5ecd3a634d2b42cf9c7a863' }, h("div", { key: '5d816254f104e238122080fcf43356fd7f01bcfd', part: text }, checkoutStore === null || checkoutStore === void 0 ? void 0 : checkoutStore.paymentDescription), h("div", { key: 'e7d28a3a4cce7399c1fb45194f4fad172e0a2751' }, h("span", { key: 'b1683801875c39a8de8d93e0cdc8778a669eebfd', part: text }, "Total"), "\u00A0", h("span", { key: 'ae2efd44a3ea54d77fcb284fee7361d0ba9b87e1', part: text }, formatCurrency(+(checkoutStore === null || checkoutStore === void 0 ? void 0 : checkoutStore.totalAmount))))))));
+    }
+    static get is() { return "justifi-checkout-summary"; }
+    static get encapsulation() { return "shadow"; }
+}

package/dist/collection/components/modular-checkout/sub-components/{google-pay.js → justifi-google-pay.js}

@@ -15,7 +15,7 @@ var GooglePayEventTypes;
     GooglePayEventTypes["paymentCanceled"] = "justifi.googlePay.paymentCanceled";
     GooglePayEventTypes["paymentError"] = "justifi.googlePay.paymentError";
 })(GooglePayEventTypes || (GooglePayEventTypes = {}));
-export class GooglePay {
+export class JustifiGooglePay {
     constructor() {
         this.environment = "TEST";
         this.iframeReady = false;

package/dist/collection/components/modular-checkout/sub-components/{plaid-payment-method.js → justifi-plaid-payment-method.js}

@@ -6,7 +6,7 @@ import { PlaidService } from "../../../api/services/plaid.service";
 import { ComponentErrorSeverity } from "../../../api/ComponentError";
 import { PAYMENT_METHODS } from "../ModularCheckout";
 import { PlaidErrorCodes, PLAID_ERROR_MESSAGES, PLAID_ERROR_SEVERITY, } from "../../../api/Plaid";
-export class PlaidPaymentMethod {
+export class JustifiPlaidPaymentMethod {
     constructor() {
         this.isAuthenticating = false;
         this.publicToken = null;
@@ -511,7 +511,7 @@ export class PlaidPaymentMethod {
         if (checkoutStore.bankAccountVerification !== true) {
             if (!this.hasLoggedDisabledWarning) {
                 // Log once per component lifecycle
-                console.warn('[PlaidPaymentMethod] bank_account_verification is disabled. Component will not render.');
+                console.warn('[JustifiPlaidPaymentMethod] bank_account_verification is disabled. Component will not render.');
                 this.hasLoggedDisabledWarning = true;
             }
             return null;

package/dist/collection/components/modular-checkout/sub-components/{saved-payment-methods.js → justifi-saved-payment-methods.js}

@@ -4,7 +4,7 @@ import { checkoutStore } from "../../../store/checkout.store";
 import { radioListItem } from "../../../styles/parts";
 import { CardBrandLabels } from "../../checkout/payment-method-option-utils";
 import { PAYMENT_METHODS } from "../ModularCheckout";
-export class SavedPaymentMethods {
+export class JustifiSavedPaymentMethods {
     constructor() {
         this.onPaymentMethodOptionClick = (paymentMethod) => (e) => {
             e.preventDefault();

package/dist/collection/components/modular-checkout/sub-components/{sezzle-payment-method.js → justifi-sezzle-payment-method.js}

@@ -9,7 +9,7 @@ const sezzleLogo = (h("img", { class: "sezzle-smart-button-logo-img", src: "http
         marginLeft: '5px',
         marginTop: '-5px',
     } }));
-export class SezzlePaymentMethod {
+export class JustifiSezzlePaymentMethod {
     constructor() {
         this.paymentMethodOptionId = PAYMENT_METHODS.SEZZLE;
         this.initializeSezzleCheckout = () => {

package/dist/collection/components/modular-checkout/sub-components/payment-method-option.js

@@ -3,7 +3,7 @@ import { radioListItem } from "../../../styles/parts";
 import { StyledHost } from "../../../ui-components";
 export class PaymentMethodOption {
     render() {
-        return (h(StyledHost, { key: 'cdf49c9446ea5fd6316523ecaf4f0f14be644e71', class: "payment-method" }, h("div", { key: '7de753f710389cbbb1d604ca5af97e1dfc5af2af', class: "radio-list-item p-3", part: radioListItem, onClick: this.clickHandler, hidden: this.radioButtonHidden }, h("form-control-radio", { key: '7a3bb855c441031d7685aa23212cc471947108ec', name: "paymentMethodType", value: this.paymentMethodOptionId, checked: this.isSelected, label: this.label }))));
+        return (h(StyledHost, { key: 'f6ea315f33580dcc2ea72448888637fa681d2f3f', class: "payment-method" }, h("div", { key: 'b9e8d0fa9b5444ce6f25f9719258e6b9b6b11f28', class: "radio-list-item p-3", part: radioListItem, onClick: this.clickHandler, hidden: this.radioButtonHidden }, h("form-control-radio", { key: '59bdbd03be9200a367b9c75c52815cbf12c36912', name: "paymentMethodType", value: this.paymentMethodOptionId, checked: this.isSelected, label: this.label }))));
     }
     static get is() { return "payment-method-option"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/order-terminals/{order-terminals.js → justifi-order-terminals.js}

@@ -14,7 +14,7 @@ import { TerminalService } from "../../api/services/terminal.service";
 import { TerminalOrder, TerminalOrderType } from "../../api/TerminalOrder";
 import { makeOrderTerminals } from "../../actions/terminal/order-terminals";
 import { formatPhoneNumber } from "../../utils/utils";
-export class OrderTerminals {
+export class JustifiOrderTerminals {
     constructor() {
         this.shipping = false;
         this.submitButtonText = 'Submit Order';
@@ -126,7 +126,7 @@ export class OrderTerminals {
         return (h("div", { class: "mt-3" }, h("div", { class: "text-end" }, "Order limit: ", this.orderLimit), h("div", { class: "d-flex justify-content-end mt-3" }, h("button", { class: "btn btn-primary submit-btn", onClick: this.submitOrder.bind(this), disabled: this.order.totalQuantity === 0 || this.submitting, part: buttonPrimary }, this.submitting ? 'Submitting...' : this.submitButtonText))));
     }
     render() {
-        return (h(StyledHost, { key: 'bb4aaf359b1511f493e10aeb574dfb33a5ca2834' }, h("div", { key: 'd09aef6864ba87fca3556f2e873dcf9ed2f988d4', part: text }, this.renderLoading(), this.renderBusinessDetails(), this.renderTerminals(), this.renderOrderSection())));
+        return (h(StyledHost, { key: 'b7af1ccc30f56ff64aece6cb8a72ab3936b0a883' }, h("div", { key: '3f8c548c83173ae6e09f681057bf9847c9f0a31d', part: text }, this.renderLoading(), this.renderBusinessDetails(), this.renderTerminals(), this.renderOrderSection())));
     }
     static get is() { return "justifi-order-terminals"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/order-terminals/terminal-quantity-selector/terminal-quantity-selector.js

@@ -18,7 +18,7 @@ export class TerminalQuantitySelector {
         };
     }
     render() {
-        return (h("div", { key: 'a42ef5839803d155254a702c2c1360130f6a2696', class: "rounded shadow-sm card p-2", part: card }, h("div", { key: 'c899514369d14d82bc549decf586fefe7c2d7133', class: "d-flex gap-3" }, h("div", { key: 'b64a26409fb27b6e651d1409beb17dd2fda22db2', class: "d-flex align-items-center" }, h("img", { key: '338b885781cc4c6bac788f6e5c09b8dce8ad9718', src: this.imageUrl, alt: this.modelName, height: 75, width: 75, part: image })), h("div", { key: '84d4c49f61efdffe630d6e2d7f9ba8054a145e8f', class: "d-flex flex-column flex-grow-1 gap-3 p-4 justify-content-center" }, h("div", { key: '1beb5d824164406d4cde1bf93f9a021f2b1e1a92', class: "row" }, h("div", { key: 'bef94d4dd8f998892f2b8b85806f6475570cfc2e', class: "col-6 d-flex gap-2" }, this.modelName, h("form-control-tooltip", { key: '518819ebbcac947edbf2a40f07df96cf23b891d1', helpText: this.description })), h("div", { key: 'c8c2ddba453cf6243c7c863623b1c1c6a91b0a68', class: "col-6 d-flex justify-content-end align-items-center" }, h("button", { key: '30c1b2026c9e502992b4fdb3183028cac12b9408', class: "p-0 minus btn", onClick: this.removeUnit, part: buttonLink }, "-"), h("div", { key: 'fd45345fd5536d30e181e9d99f551542c6703958', class: "w-25 text-center" }, this.selectedQuantity), h("button", { key: 'f58d777b02b8599fdd48c6d3474ffe25dcb9b13a', class: "p-0 plus btn", onClick: this.addUnit, part: buttonLink }, "+")))))));
+        return (h("div", { key: '8be4d665fc9a9d59623fa4fed1e659b55e79f598', class: "rounded shadow-sm card p-2", part: card }, h("div", { key: '007e76def4d3ffbac8734df4281857e5623043ad', class: "d-flex gap-3" }, h("div", { key: '30bea8b3eefbd08971568f06eb7718e83d964f1f', class: "d-flex align-items-center" }, h("img", { key: '4fd64ed37d53cda9c8f0bde15e4e24d310ef6fcb', src: this.imageUrl, alt: this.modelName, height: 75, width: 75, part: image })), h("div", { key: '6b61b5e6f3aaef6c4be94ea52c3b5eec4f6d5d0c', class: "d-flex flex-column flex-grow-1 gap-3 p-4 justify-content-center" }, h("div", { key: '593b1e00bd6aa3d99f677e6aaa34cf3b36a8401e', class: "row" }, h("div", { key: '98690539987c508c8e158bf7c3d3eb1eadc59ee7', class: "col-6 d-flex gap-2" }, this.modelName, h("form-control-tooltip", { key: 'f062a7cef0c23eda70c269639ef2a90114d21e75', helpText: this.description })), h("div", { key: '110e58b0aeff60bf4e2f8f1ea758a14002676bdb', class: "col-6 d-flex justify-content-end align-items-center" }, h("button", { key: '2617b5f6de942a23dd12ad8694e84b6ca213c963', class: "p-0 minus btn", onClick: this.removeUnit, part: buttonLink }, "-"), h("div", { key: '9bc6bd84bb4794e80de2e74ed68b7e8ab55a2508', class: "w-25 text-center" }, this.selectedQuantity), h("button", { key: '09a2aaa55627d5ee64639f729de9fb3d21e7244b', class: "p-0 plus btn", onClick: this.addUnit, part: buttonLink }, "+")))))));
     }
     static get is() { return "terminal-quantity-selector"; }
     static get properties() {

package/dist/collection/components/payment-details/{payment-details.js → justifi-payment-details.js}

@@ -5,7 +5,7 @@ import { ErrorState } from "../../ui-components/details/utils";
 import { ComponentErrorCodes, ComponentErrorSeverity } from "../../api/ComponentError";
 import JustifiAnalytics from "../../api/Analytics";
 import { checkPkgVersion } from "../../utils/check-pkg-version";
-export class PaymentDetails {
+export class JustifiPaymentDetails {
     constructor() {
         this.errorMessage = null;
         this.paymentService = new PaymentService();

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

@@ -48,16 +48,16 @@ export class PaymentDetailsCore {
         return this.payment.status;
     }
     render() {
-        return (h(StyledHost, { key: '26b8d1cf265226bcc4507dad0cc3504e953a9389' }, this.loading && h(PaymentDetailsLoading, { key: 'd2410b583c52ca4fdab80657c82b512c4e936b87' }), !this.loading && this.errorMessage && ErrorState(this.errorMessage), !this.loading && !this.errorMessage &&
-            this.payment && (h("justifi-details", { key: '9625a7b341ebab0736a5b1affd2507eaeb01aaea', errorMessage: this.errorMessage }, h(EntityHeadInfo, { key: 'e1da5f9932cb5ec4a9e9cbcc07637f16779e620f', slot: "head-info", badge: (h("div", { class: "d-flex gap-1" }, MapPaymentStatusToBadge(this.PaymentStatus), this.payment.expedited ? (h(Badge, { variant: BadgeVariant.WARNING, title: "Expedited", text: "Expedited" })) : null)), title: this.payment.formattedPaymentAmount(this.payment.amount) }, h(EntityHeadInfoItem, { key: '5bf927cf2ab51c8057ff5f1d14d1fdb0112da302', classes: "border-1 border-end", title: "Updated At", value: `${formatDate(this.payment.updated_at)} ${formatTime(this.payment.updated_at)}` }), h(EntityHeadInfoItem, { key: 'dae7b63a0018af7ad5ff0b01303629b27f9e8690', classes: "border-1 border-end", title: "Created At", value: `${formatDate(this.payment.created_at)} ${formatTime(this.payment.created_at)}` }), h(EntityHeadInfoItem, { key: '11c7090131fe05f995a34149e32167c50171ff4a', title: "ID", value: this.payment.id })), h("div", { key: 'ad1dafc96ed6041cc418f433dc2a941ccc1ed15e', slot: 'detail-sections' }, h(DetailSectionTitle, { key: '4fc7d43271b7d4da55126380431fd304ec6b95ca', sectionTitle: "Details" }), h("div", { key: 'e884cca29436ae3e05c07c402c01f680395aadf8', class: "d-flex flex-column gap-2 w-100" }, h(DetailItem, { key: 'd173c1ff5476adae63efd83c78cbd6da476893f3', title: "Amount", value: this.payment.formattedPaymentAmount(this.payment.amount) }), h(DetailItem, { key: 'c5307a082162dd6fde2e201916cb2d027b3ce1ff', title: "Fees", value: this.payment.formattedPaymentAmount(this.payment.fee_amount) }), h(DetailItem, { key: '3a8819d979eb5e49da51b80ac4cc40f9f7f06263', title: "Refunded", value: this.payment.formattedPaymentAmount(this.payment.amount_refunded) }), h(DetailItem, { key: '3850b861daf0191dc2f8ebea04fe7aba4ab53bed', title: "Net", value: this.payment.formattedPaymentAmount(this.payment.balance) }), h(DetailItem, { key: 'b48c9f01ec0fd622e4f01b6405cb4ca779113492', title: "Status", value: MapPaymentStatusToBadge(this.PaymentStatus) }), h(DetailItem, { key: '742432ff1e60ebc905ce10bfac6175855fa6ea69', title: "Payment ID", value: this.payment.id }), h(DetailItem, { key: 'aa9ff4ff17362b9b615dfbade88b89687e7a8791', title: "Processing Fees", value: this.payment.formattedPaymentAmount(this.payment.fee_amount) }), h(DetailItem, { key: '1e37b41e112a2e04e646f599f6b9b99a5259b8c2', title: "Statement Descriptor", value: this.payment.statement_descriptor }), h(DetailItem, { key: 'ec97d4f1f23083d7a780d0ccc71f4130a3553014', title: "Description", value: this.payment.description }), h(DetailItem, { key: '96b77660af6302edd62f73290811b517b39fb876', title: "Expedited", value: this.payment.expedited ? 'Yes' : 'No' })), this.payment.payment_method.card && [
-            h(DetailSectionTitle, { key: '29b79b7f832363f173a3e4befc31ac88ff574867', sectionTitle: "Payment Method" }),
-            h("div", { key: '206648ce629f705ab3483572dd2f01f1dd3bc03f', class: "d-flex flex-column gap-2 w-100" }, h(DetailItem, { key: '7c03a887918a0d9cb190c85c6dfedb89bee46b8b', title: "ID", value: this.payment.payment_method.card.id }), h(DetailItem, { key: '0cb8a2b0aed45ec1f9037bcb8c7df3fa7fe3a948', title: "Payment Type", value: "Card" }), h(DetailItem, { key: '6cf56554f1c2fe706191f3b101dbf2ecbbddf9db', title: "Last 4 Numbers", value: this.payment.payment_method.lastFourDigits }), h(DetailItem, { key: 'a8dec356cac117498cebd61cb59ff2b4bcfc0c4c', title: "Brand", value: snakeCaseToHumanReadable(this.payment.payment_method.card.brand) }), h(DetailItem, { key: '4703d991abab5ade33b1e5dd55d19290fe05ab72', title: "Cardholder", value: this.payment.payment_method.payersName }))
+        return (h(StyledHost, { key: '81d4c6cde1bb6ddb70d8722ebfdf6d6f5005747b' }, this.loading && h(PaymentDetailsLoading, { key: '9bf326f569a17739c402a63be63bc2bf3a6544b3' }), !this.loading && this.errorMessage && ErrorState(this.errorMessage), !this.loading && !this.errorMessage &&
+            this.payment && (h("justifi-details", { key: 'f9a3a08455b9ae47ae5aa966c461207e2d088aed', errorMessage: this.errorMessage }, h(EntityHeadInfo, { key: '672690ef1b2ed72f5058c9dc928239b7368f9bb6', slot: "head-info", badge: (h("div", { class: "d-flex gap-1" }, MapPaymentStatusToBadge(this.PaymentStatus), this.payment.expedited ? (h(Badge, { variant: BadgeVariant.WARNING, title: "Expedited", text: "Expedited" })) : null)), title: this.payment.formattedPaymentAmount(this.payment.amount) }, h(EntityHeadInfoItem, { key: 'd4bdb84ffd4358bbb1b2e0538228372c7deb4b04', classes: "border-1 border-end", title: "Updated At", value: `${formatDate(this.payment.updated_at)} ${formatTime(this.payment.updated_at)}` }), h(EntityHeadInfoItem, { key: '22bdd5e612b9bb01df51d6c43e8e4ed66d2d1756', classes: "border-1 border-end", title: "Created At", value: `${formatDate(this.payment.created_at)} ${formatTime(this.payment.created_at)}` }), h(EntityHeadInfoItem, { key: 'e761e4b44310db070e44516b9f9377d63c1936a7', title: "ID", value: this.payment.id })), h("div", { key: 'd8ea1feb8173869287044a6ae21e34079008c076', slot: 'detail-sections' }, h(DetailSectionTitle, { key: 'a8a7ed38614d5b2e669010e260bb503fc5b800bb', sectionTitle: "Details" }), h("div", { key: '1ba0a5b0b1e6a6191471917ee5a85e4dbec383eb', class: "d-flex flex-column gap-2 w-100" }, h(DetailItem, { key: 'b70001650082457bac2fd92f7ef2aa75b7166d66', title: "Amount", value: this.payment.formattedPaymentAmount(this.payment.amount) }), h(DetailItem, { key: '8d077da9e32994f566e8d197a7658a267b377c52', title: "Fees", value: this.payment.formattedPaymentAmount(this.payment.fee_amount) }), h(DetailItem, { key: '7fc90b4f839c779a86ea35385d19204aa0be646f', title: "Refunded", value: this.payment.formattedPaymentAmount(this.payment.amount_refunded) }), h(DetailItem, { key: 'cae64bf3b9e5253e8f24b6815991b7b0a15b8e1e', title: "Net", value: this.payment.formattedPaymentAmount(this.payment.balance) }), h(DetailItem, { key: 'ebd0009561bdc448473d0b046589309cd0475eae', title: "Status", value: MapPaymentStatusToBadge(this.PaymentStatus) }), h(DetailItem, { key: '4546a4b0989235700c102be283bb7a643ac2f0e3', title: "Payment ID", value: this.payment.id }), h(DetailItem, { key: 'e922907f30ef64edce276da039d01e8fff422f60', title: "Processing Fees", value: this.payment.formattedPaymentAmount(this.payment.fee_amount) }), h(DetailItem, { key: '99c6bf89353f13d9827c75f5fd0695abb8da4a90', title: "Statement Descriptor", value: this.payment.statement_descriptor }), h(DetailItem, { key: '002f89d38c8cf8ecc35778f5568e5b9747c1145c', title: "Description", value: this.payment.description }), h(DetailItem, { key: '74b7c6d15e8b6d90f58019a98b5c9f022cfb3d42', title: "Expedited", value: this.payment.expedited ? 'Yes' : 'No' })), this.payment.payment_method.card && [
+            h(DetailSectionTitle, { key: '3220637ac5aa9c4fc2875c0b90f31ff279c7e8d9', sectionTitle: "Payment Method" }),
+            h("div", { key: '8fbf45f2b6687fd2f7c17fa4edd5d847f61be772', class: "d-flex flex-column gap-2 w-100" }, h(DetailItem, { key: '4099153bca60f14809b3b44f7bf308a31092e75f', title: "ID", value: this.payment.payment_method.card.id }), h(DetailItem, { key: '81fe93ee6928fcd45330ffdaa873c3049567c37f', title: "Payment Type", value: "Card" }), h(DetailItem, { key: 'f5d245d31bca5dc6ce107b2fbe30f9e92c2a332f', title: "Last 4 Numbers", value: this.payment.payment_method.lastFourDigits }), h(DetailItem, { key: 'bc5238e8b662f9eab090aecb02f77642bf08390c', title: "Brand", value: snakeCaseToHumanReadable(this.payment.payment_method.card.brand) }), h(DetailItem, { key: '8bb3025658402c77cf8c87ff20ac48cea64c90c9', title: "Cardholder", value: this.payment.payment_method.payersName }))
         ], this.payment.payment_method.bank_account && [
-            h(DetailSectionTitle, { key: '6300a3fa99c4a0f81f0f8ff780aeb14b606a368e', sectionTitle: "Payment Method" }),
-            h("div", { key: '7b8fbfd356587b034791a0481f6cf54f31b99114', class: "d-flex flex-column gap-2 w-100" }, h(DetailItem, { key: 'badbdc33521816af3a38c193fd89995b720dd53a', title: "ID", value: this.payment.payment_method.bank_account.id }), h(DetailItem, { key: 'cdeff3c4459c2d29a48b631fa6ca6c81ba55dd6f', title: "Last 4 Numbers", value: this.payment.last_four_digits }), h(DetailItem, { key: '2724fa6601bb5024b326853194764114115f0be2', title: "Bank Name", value: this.payment.payment_method.bank_account.brand }), h(DetailItem, { key: '236459bc401e59140bce119a0c5a12ea49d8835b', title: "Account Owner", value: this.payment.payment_method.payersName }))
+            h(DetailSectionTitle, { key: 'adf1a3bf8e286efda6ed5a10ffd53396d2a7889e', sectionTitle: "Payment Method" }),
+            h("div", { key: '79c8eb07641a38b415c27596b4e098a8877494da', class: "d-flex flex-column gap-2 w-100" }, h(DetailItem, { key: '2223dbf545eaf75843eeba9528d738dc22fcc5c9', title: "ID", value: this.payment.payment_method.bank_account.id }), h(DetailItem, { key: '876d87e60944f094c72911a2d1d946332fad45ee', title: "Last 4 Numbers", value: this.payment.last_four_digits }), h(DetailItem, { key: '680dd8fc3b295ef8814f729400c94f0cb319b8df', title: "Bank Name", value: this.payment.payment_method.bank_account.brand }), h(DetailItem, { key: '4460c0c9d4aec592d3ec47839dcf59a479b9c175', title: "Account Owner", value: this.payment.payment_method.payersName }))
         ], this.payment.metadata && [
-            h(DetailSectionTitle, { key: 'c80b4d1bd4dbc5f51848cfb1e886cd4c1c3f4026', sectionTitle: 'Metadata' }),
-            h("div", { key: 'bf7066df65a34cbb510aa3fdef414b27b622ff59', class: "d-table gap-2 w-100" }, h(CodeBlock, { key: '3a127cdeac5403079a3c822aeb40d6812e3fa914', metadata: this.payment.metadata }))
+            h(DetailSectionTitle, { key: '798c2f7054c1ba741b25e3fad461b8c40e5b8eac', sectionTitle: 'Metadata' }),
+            h("div", { key: 'a1400cea6005f844338da47c23b39e63772d07f5', class: "d-table gap-2 w-100" }, h(CodeBlock, { key: '8e724ef263cd29e9ea14549e9a59768428d5d908', metadata: this.payment.metadata }))
         ])))));
     }
     static get is() { return "payment-details-core"; }

package/dist/collection/components/payment-transactions-list/{payment-transactions-list.js → justifi-payment-transactions-list.js}

@@ -8,7 +8,7 @@ import { Table } from "../../utils/table";
 import { StyledHost, TableEmptyState, TableErrorState, TableLoadingState } from "../../ui-components";
 import { defaultColumnsKeys, paymentTransactionTableCells, paymentTransactionTableColumns } from "./payment-transactions-table";
 import { TableWrapper, TableComponent, TableHead, TableHeadRow, TableBody, TableRow, TableFoot, TableFootRow, TableFootCell, TableClickActions } from "../../ui-components";
-export class PaymentTransactionsList {
+export class JustifiPaymentTransactionsList {
     constructor() {
         this.balanceTransactions = [];
         this.isLoading = true;
@@ -91,7 +91,7 @@ export class PaymentTransactionsList {
         return !this.showEmptyState && !this.showErrorState && !this.isLoading;
     }
     render() {
-        return (h(StyledHost, { key: '7aaa611cf9d23ff9244d8df54e57daa3ec08a635' }, h(TableWrapper, { key: 'd3f5244cfe909030c6072c7fdc4a5740029a4c17' }, h(TableComponent, { key: 'b0dc2044e5ee11b5d6a8298ed219c33f2bc42a35' }, h(TableHead, { key: '6a91d2b6968a6e969be3861c85b829c1ca5f899e' }, h(TableHeadRow, { key: 'ae84fd9d80b84054bfa1012137affa5c83b2be39' }, this.transactionsTable.columnData.map((column) => column))), h(TableBody, { key: '6a5cdec3190bb80ed3f78f295d07271838260fce' }, h(TableLoadingState, { key: '9fef843fa67a8049d77432d75f89446a2abe5ccc', columnSpan: this.transactionsTable.columnKeys.length, isLoading: this.isLoading }), h(TableEmptyState, { key: '3be23e217a98d0b2727dabc783134996ef0f9084', isEmpty: this.showEmptyState, columnSpan: this.transactionsTable.columnKeys.length }), h(TableErrorState, { key: '791ff61e65fb2f4e6a83f7d5142565b4a89106b5', columnSpan: this.transactionsTable.columnKeys.length, errorMessage: this.errorMessage }), this.showRowData && this.transactionsTable.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: '898e2236fbed139f8196452463e3f248c01608d4' }, h(TableFootRow, { key: '9b416e1f6122d095b7516816ed686fe116479512' }, h(TableFootCell, { key: '6a12ce5ee3c5f28058ee5796cb174ef9fa4505b5', colSpan: this.transactionsTable.columnData.length }, h("pagination-menu", { key: '06984f04a928213ecbb6b3bf5acd3cb3a48e901f', paging: Object.assign(Object.assign({}, this.paging), { handleClickPrevious: this.handleClickPrevious, handleClickNext: this.handleClickNext }) })))))))));
+        return (h(StyledHost, { key: 'a19c2fd2ee5e86741dc02524ecfed08b03618fba' }, h(TableWrapper, { key: 'bf3137a2cabba02117b1716bfd8c3c5c67a430d2' }, h(TableComponent, { key: '923ca41a66c00ca874035a5fdbe95b7ed8f9205c' }, h(TableHead, { key: 'd749c9ee6c1f67969ff7270ce69c2d9766823797' }, h(TableHeadRow, { key: 'eade74e1213af11303eaf2141c083cd1178bb31f' }, this.transactionsTable.columnData.map((column) => column))), h(TableBody, { key: 'b046a3dd815360e924d8a4453fdaa2a0511f9d5a' }, h(TableLoadingState, { key: 'e2f8868ce1b0a2a40f2ba747776a17a12abfd61b', columnSpan: this.transactionsTable.columnKeys.length, isLoading: this.isLoading }), h(TableEmptyState, { key: '3a4d16aef99b051db8b4c945b304168b563d604a', isEmpty: this.showEmptyState, columnSpan: this.transactionsTable.columnKeys.length }), h(TableErrorState, { key: 'e9e7541ba9089540cc8bae209b4ad74312a9d33c', columnSpan: this.transactionsTable.columnKeys.length, errorMessage: this.errorMessage }), this.showRowData && this.transactionsTable.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: '72fac1223a4b9275d67d8600e0b90ba8d9d0e280' }, h(TableFootRow, { key: '7cbc13568ee060be02bef6ee271d2d2d3a8445b9' }, h(TableFootCell, { key: '0c458ce2f24f9327fbd733b828429f77de3590f5', colSpan: this.transactionsTable.columnData.length }, h("pagination-menu", { key: '6a93bc23fad5490a811c13d69f6d851d33e4a922', paging: Object.assign(Object.assign({}, this.paging), { handleClickPrevious: this.handleClickPrevious, handleClickNext: this.handleClickNext }) })))))))));
     }
     static get is() { return "justifi-payment-transactions-list"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/payments-list/{payments-list-filters.js → justifi-payments-list-filters.js}

@@ -3,8 +3,8 @@ import { debounce } from "lodash";
 import { filterParams, propsParams, clearParams } from "./payments-list-params-state";
 import { StyledHost } from "../../ui-components";
 import { convertToLocal, convertToUTC } from "../../utils/utils";
-import { paymentsListFilterMenu, createdAfterPaymentsListFilterParam, createdBeforePaymentsListFilterParam, paymentIdPaymentsListFilterParam, paymentStatusPaymentsListFilterParam, paymentModePaymentsListFilterParam, checkoutIdPaymentsListFilterParam, accountHolderPaymentsListFilterParam, terminalIdPaymentsListFilterParam } from "../../styles/parts";
-export class PaymentsListFilters {
+import { filterMenu, filterParam } from "../../styles/parts";
+export class JustifiPaymentsListFilters {
     constructor() {
         this.setParamsOnChange = (name, value) => {
             filterParams[name] = value;
@@ -54,9 +54,9 @@ export class PaymentsListFilters {
     }
     render() {
         const filterMenuParams = Object.assign({}, filterParams);
-        return (h(StyledHost, { key: '13aa135857848a72567599a2639488287ca39081' }, h("table-filters-menu", { key: 'ed4dd2ea5f26428f41fd54a477893dcb0fc149e1', params: filterMenuParams, clearParams: clearParams, part: paymentsListFilterMenu }, h("div", { key: '95eef3a3710f97e04626ebb8bee42229a63f3c5c', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: 'd803be62dd29001b14343e2c8319a9301c00d8dc', class: "p-2" }, h("form-control-text", { key: 'e7a6da04a9eb9b2d6fdbe4bbb22c98b96ccf5030', name: "payment_id", label: "Payment ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.paymentId || filterParams.payment_id, disabled: !!this.paymentId, part: paymentIdPaymentsListFilterParam })), h("div", { key: '3e36de2950a53a3db08f8647573c4032624d453b', class: "p-2" }, h("form-control-text", { key: '28d556adfd29c3d73f59de2cbf8bf78d34ca5766', name: "terminal_id", label: "Terminal ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.terminalId || filterParams.terminal_id, disabled: !!this.terminalId, part: terminalIdPaymentsListFilterParam })), h("div", { key: 'e7645f939effafa3d9b300829b53521d4c9c758f', class: "p-2" }, h("form-control-select", { key: 'bb5e03857df5c49fe74fa518c5b81f86d3dd2885', name: "payment_status", label: "Status", options: this.paymentStatusOptions, inputHandler: this.setParamsOnChange, defaultValue: this.paymentStatus || filterParams.payment_status || '', disabled: !!this.paymentStatus, part: paymentStatusPaymentsListFilterParam })), h("div", { key: '181a66501584fadb10fee74215086bc215b271eb', class: "p-2" }, h("form-control-select", { key: '1e96d536e0aa91eb31b228710de7a3815717d003', name: "payment_mode", label: "Payment Mode", options: this.paymentModeOptions, inputHandler: this.setParamsOnChange, defaultValue: this.paymentMode || filterParams.payment_mode || '', disabled: !!this.paymentMode, part: paymentModePaymentsListFilterParam })), h("div", { key: '7512ec47150ba5112486fec46fc99b7c2a04e7dc', class: "p-2" }, h("form-control-text", { key: 'a2065eaa53b1ef12752c3969cb4dd8ff2694bd1d', name: "checkout_id", label: "Checkout ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.checkoutId || filterParams.checkout_id, disabled: !!this.checkoutId, part: checkoutIdPaymentsListFilterParam })), h("div", { key: 'c7921a2cd0bd2fe17b831052c4114b3e061a584d', class: "p-2" }, h("form-control-text", { key: 'f8176d5b682e37df29d03bc5bd48ab4ded36e179', name: "account_holder", label: "Account Holder", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.accountHolder || filterParams.account_holder, disabled: !!this.accountHolder, part: accountHolderPaymentsListFilterParam })), h("div", { key: 'fca79a82790ae8739872d9178ac1ae44f94a1513', class: "p-2" }, h("form-control-date", { key: 'e1a750350ec30a339c33d0b76bc6b7f045eb198b', name: "created_after", label: "Created After", inputHandler: this.handleDateInput, defaultValue: convertToLocal(this.createdAfter, { showInputDateTime: true }) ||
-                convertToLocal(filterParams.created_after, { showInputDateTime: true }), showTime: true, disabled: !!this.createdAfter, part: createdAfterPaymentsListFilterParam })), h("div", { key: '18c93fdeec815743397ccbf1b8ed59144128d0ef', class: "p-2" }, h("form-control-date", { key: 'ded94e6169a8c3189e059353361b597926721cc1', name: "created_before", label: "Created Before", inputHandler: this.handleDateInput, defaultValue: convertToLocal(this.createdBefore, { showInputDateTime: true }) ||
-                convertToLocal(filterParams.created_before, { showInputDateTime: true }), showTime: true, disabled: !!this.createdBefore, part: createdBeforePaymentsListFilterParam }))))));
+        return (h(StyledHost, { key: '58db842ae1759b5094edf8e435d095b7245ce1d0' }, h("table-filters-menu", { key: '14ddd037f43a36139d6ba360cd380e71d003bff9', params: filterMenuParams, clearParams: clearParams, part: filterMenu }, h("div", { key: 'cbd3a2f65e735f0b87641969b5ecd0b14951f886', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: '1965d56f641720e98adf80ecb1dcd7f22a1a28ec', class: "p-2" }, h("form-control-text", { key: '20f901f3b1d19412769b2c50fc3d4fede612afa4', name: "payment_id", label: "Payment ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.paymentId || filterParams.payment_id, disabled: !!this.paymentId, part: filterParam })), h("div", { key: '4f7350e4947b75eea5fe2707f7318ac8f3e187fa', class: "p-2" }, h("form-control-text", { key: '5063baec0022ef94d09013ff212e039ff1ec4b9c', name: "terminal_id", label: "Terminal ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.terminalId || filterParams.terminal_id, disabled: !!this.terminalId, part: filterParam })), h("div", { key: '74d4f02d79738741f03780066394d75e7482db4b', class: "p-2" }, h("form-control-select", { key: 'fd4e649331f7593ebf79de3209a8cde89f55b291', name: "payment_status", label: "Status", options: this.paymentStatusOptions, inputHandler: this.setParamsOnChange, defaultValue: this.paymentStatus || filterParams.payment_status || '', disabled: !!this.paymentStatus, part: filterParam })), h("div", { key: '8254027040cc3d7e957d8f106e5d9cce17474db2', class: "p-2" }, h("form-control-select", { key: '9ca53fe90ab689a4e718872a7856b8706cfab705', name: "payment_mode", label: "Payment Mode", options: this.paymentModeOptions, inputHandler: this.setParamsOnChange, defaultValue: this.paymentMode || filterParams.payment_mode || '', disabled: !!this.paymentMode, part: filterParam })), h("div", { key: 'c1e5d44a266aa2d1d13d8be91616357a3b19a02e', class: "p-2" }, h("form-control-text", { key: '61635cdcca233f137ecdb7ea7c605bd9487cd6a9', name: "checkout_id", label: "Checkout ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.checkoutId || filterParams.checkout_id, disabled: !!this.checkoutId, part: filterParam })), h("div", { key: '2f8dc8e4e8f1d75efb4487a90e9f00b17f0dc6f1', class: "p-2" }, h("form-control-text", { key: '80267ba174109ed9635f59c275ecadac999838eb', name: "account_holder", label: "Account Holder", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.accountHolder || filterParams.account_holder, disabled: !!this.accountHolder, part: filterParam })), h("div", { key: '55067505b4e93354acdb29e78b823ff908ce9feb', class: "p-2" }, h("form-control-date", { key: 'd4930b8f5d7a71995ee3c5e63e8ffb25f1157340', name: "created_after", label: "Created After", inputHandler: this.handleDateInput, defaultValue: convertToLocal(this.createdAfter, { showInputDateTime: true }) ||
+                convertToLocal(filterParams.created_after, { showInputDateTime: true }), showTime: true, disabled: !!this.createdAfter, part: filterParam })), h("div", { key: 'fd92ce3e10a1a48e95c031476df9e4c7723724d1', class: "p-2" }, h("form-control-date", { key: '29818ce8be32260087b26230546627d9cfff72ad', name: "created_before", label: "Created Before", inputHandler: this.handleDateInput, defaultValue: convertToLocal(this.createdBefore, { showInputDateTime: true }) ||
+                convertToLocal(filterParams.created_before, { showInputDateTime: true }), showTime: true, disabled: !!this.createdBefore, part: filterParam }))))));
     }
     static get is() { return "justifi-payments-list-filters"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/payments-list/{payments-list.js → justifi-payments-list.js}

@@ -6,7 +6,7 @@ import JustifiAnalytics from "../../api/Analytics";
 import { checkPkgVersion } from "../../utils/check-pkg-version";
 import { StyledHost } from "../../ui-components";
 import { defaultColumnsKeys } from "./payments-table";
-export class PaymentsList {
+export class JustifiPaymentsList {
     constructor() {
         this.errorMessage = null;
         this.columns = defaultColumnsKeys;
@@ -46,7 +46,7 @@ export class PaymentsList {
         }
     }
     render() {
-        return (h(StyledHost, { key: '7e8061d89c07cea6f86c61156bf82be507908bb4' }, h("payments-list-core", { key: '940a26c6b1590e4b95136262a116892281645c1d', getPayments: this.getPayments, "onError-event": this.handleErrorEvent, columns: this.columns })));
+        return (h(StyledHost, { key: 'a8562a3d7d7d1efda16f86c1bccbd3417fe8f198' }, h("payments-list-core", { key: '03a88647d46be6ea09bdd26dc226a4faa1bddf72', getPayments: this.getPayments, "onError-event": this.handleErrorEvent, columns: this.columns })));
     }
     static get is() { return "justifi-payments-list"; }
     static get encapsulation() { return "shadow"; }

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

@@ -84,7 +84,7 @@ export class PaymentsListCore {
         return !this.showEmptyState && !this.showErrorState && !this.loading;
     }
     render() {
-        return (h(TableWrapper, { key: 'b694ec89a330819723a9c5a093515c5e594fd811' }, h(TableComponent, { key: 'b0e7f6fa8d4eebb697c0b78a638c9bd61146eb1c' }, h(TableHead, { key: '9952bf57d182e3530d8c0cdd9abc68f50633853e' }, h(TableHeadRow, { key: 'ac5beb9ed786566aadd04e8802c967760c90ba3c' }, this.paymentsTable.columnData.map((column) => column))), h(TableBody, { key: 'c167c67965757d73b3d433861a974d4ed499cae1' }, h(TableLoadingState, { key: '456ad5dd06da225fc593361fc2fb244312b6dbd5', columnSpan: this.paymentsTable.columnData.length, isLoading: this.loading }), h(TableEmptyState, { key: '11cc043cf73eef3d520504285ffa13e21df0963a', isEmpty: this.showEmptyState, columnSpan: this.paymentsTable.columnData.length }), h(TableErrorState, { key: 'c98ab4e30ceb0cc8c8c0c239a8fbb8d4a7a63477', columnSpan: this.paymentsTable.columnData.length, errorMessage: this.errorMessage }), this.showRowData && this.paymentsTable.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: 'c5f2334f863b4da3be4a05220bb90358c0df1dfc' }, h(TableFootRow, { key: '229efe9952902c693e19c5d22f589e2b404e8e16' }, h(TableFootCell, { key: 'b99252aa7653b8bed555998f6178a88c47c78d17', colSpan: this.paymentsTable.columnData.length }, h("pagination-menu", { key: 'b6312dfc56e4ce169c4f52cc867ffb11013c3817', paging: Object.assign(Object.assign({}, this.paging), { handleClickPrevious: this.handleClickPrevious, handleClickNext: this.handleClickNext }) }))))))));
+        return (h(TableWrapper, { key: 'cb0670480c9debdb07cc85643517be3e3eec1c02' }, h(TableComponent, { key: 'c8c191f752d92763d609b0ea63b267e5f612ecea' }, h(TableHead, { key: '3effeb476774075b9ce0f61a456b2887b4140d8e' }, h(TableHeadRow, { key: '5a31ba0211417388a08ab75271d4cd39300e2f49' }, this.paymentsTable.columnData.map((column) => column))), h(TableBody, { key: '53805d81a29b319bc91dc3356638e8307d371d8a' }, h(TableLoadingState, { key: '36eae2bcd5135b2f9d2f222974f431a4378a5aef', columnSpan: this.paymentsTable.columnData.length, isLoading: this.loading }), h(TableEmptyState, { key: 'edc30a10dc2e1e9b2316d96a60c1915c243c5f6d', isEmpty: this.showEmptyState, columnSpan: this.paymentsTable.columnData.length }), h(TableErrorState, { key: '6ea908dda99c8669a72b7886bb1b987f8297bb2c', columnSpan: this.paymentsTable.columnData.length, errorMessage: this.errorMessage }), this.showRowData && this.paymentsTable.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: 'da0bf1d3966ad88658d2fb2562a84fc0d73378dd' }, h(TableFootRow, { key: 'a57c80fffbba11566b3092cab3dbff2db90da698' }, h(TableFootCell, { key: 'fea921b006d05a26759cbdc28888ac57f9bd34c9', colSpan: this.paymentsTable.columnData.length }, h("pagination-menu", { key: 'f23790e00890a70ef676678fab14da5beef2e02d', paging: Object.assign(Object.assign({}, this.paging), { handleClickPrevious: this.handleClickPrevious, handleClickNext: this.handleClickNext }) }))))))));
     }
     static get is() { return "payments-list-core"; }
     static get properties() {

package/dist/collection/components/payout-details/{payout-details.js → justifi-payout-details.js}

@@ -6,7 +6,7 @@ import { ComponentErrorCodes, ComponentErrorSeverity } from "../../api/Component
 import JustifiAnalytics from "../../api/Analytics";
 import { makeGetPayoutCSV } from "./get-payout-csv";
 import { checkPkgVersion } from "../../utils/check-pkg-version";
-export class PayoutDetails {
+export class JustifiPayoutDetails {
     constructor() {
         this.enableRecordClick = false;
         this.errorMessage = null;

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

@@ -64,9 +64,9 @@ export class PayoutDetailsCore {
     }
     render() {
         var _a;
-        return (h(StyledHost, { key: '6720c8a6f5919d8f563cd9e21a93d64de0916060' }, this.loading && h(PayoutDetailsLoading, { key: '26214ad3e6d784f4810155addcf19b9e4b869269' }), !this.loading && this.errorMessage && ErrorState(this.errorMessage), !this.loading && this.payout && (h("justifi-details", { key: 'fd810d7c04562bd4aa21681b9473bf32c84bb368', errorMessage: this.errorMessage }, h(EntityHeadInfo, { key: '2d379a2836fc98964b048a284eaa0d3b51f404fa', 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: '43b43e3c1d35bba3111c202310a2a96f1a916e9f', classes: "border-1 border-end", title: "Updated At", value: `${formatDate(this.payout.updated_at)} ${formatTime(this.payout.updated_at)}` }), h(EntityHeadInfoItem, { key: '68203b090ad2aab3aaf0a2070a0a5b5a8f471fc0', classes: "border-1 border-end", title: "Created At", value: `${formatDate(this.payout.created_at)} ${formatTime(this.payout.created_at)}` }), h(EntityHeadInfoItem, { key: 'd427383d0b66287d36ec142b3edfdf89d1ff53d6', title: "ID", value: this.payout.id }), h("div", { key: '172eaee1f1f66c361e366e8c1422d158c44991ca', class: "m-4" }, h(Button, { key: '59e3f95f23d29681bb36b297e954140d3e056474', variant: "outline-secondary", class: "btn btn-outline-secondary d-flex align-items-center", onClick: this.downloadCSV }, "Export CSV"))), h("div", { key: 'a32accc21bcf9c8b7db906b62fc0dc179d126e10', slot: 'detail-sections' }, h(DetailSectionTitle, { key: '46c8fa58f696bed5628a129b8c956aa3ccc7a8a9', sectionTitle: "Details" }), h("div", { key: '43cea4c35521d0ec45b2eb73f0ec3aa4cbe076bb', class: "d-flex flex-column gap-2 w-100" }, h(DetailItem, { key: 'e19c95cbced986d7e0aa7dd5a59d0e3425c1a492', title: "Date paid", value: formatDate(this.payout.deposits_at) }), h(DetailItem, { key: 'e64dbb1e230816f589600d97bece2aaecf7e3837', title: "Statement Description", value: this.payout.description }), h(DetailItem, { key: '0009fb64dccd61d1941dc80c5613d54316e6e8fc', title: "Payout Method", value: this.formatMethod(this.payout.delivery_method) }), h(DetailItem, { key: '933746728601556d77e135f031d5bbce4227beb3', title: "Amount", value: this.payout.formattedPaymentAmount(this.payout.amount) }), h(DetailItem, { key: 'a2dac791b686fc7ca35da5a51a64c5e47fb94fa6', title: "Fee", value: this.payout.formattedPaymentAmount(this.payout.fees_total) })), h(DetailSectionTitle, { key: 'f2334d9d641f6f096a7fa4d3d04fe496c19fcf2d', sectionTitle: "Account" }), h("div", { key: 'f76e30ebbe32c0d37ebcf205371b5e40cd4be768', class: "d-flex flex-column gap-2 w-100" }, h(DetailItem, { key: '0878dca0ec871ce45a3bf548fd987596d98a2bb3', title: "ID", value: this.payout.account_id, onClick: this.enableRecordClick ? () => this.handleRecordClick(this.payout.account_id) : undefined }), h(DetailItem, { key: '7c751efac65871cdc8041cb0645cb11f30e9e188', title: "Account Type", value: this.payout.bank_account.account_type }), h(DetailItem, { key: 'e4a169e43cda405be68e07ec191e981f8fb32d13', title: "Institution", value: this.payout.bank_account.account_type }), h(DetailItem, { key: '7740bd18dca90ec0f64de729712a49e4c510056a', title: "Routing Number", value: this.payout.bank_account.routing_number }), h(DetailItem, { key: 'a7798c561869ebfa212b724af432f304654d4c3f', title: "Account Number", value: `**** ${this.payout.bank_account.account_number_last4}` })), this.payout.metadata && [
-            h(DetailSectionTitle, { key: '4e2a9585769fc5ebe1dc57e78781568bad07d004', sectionTitle: 'Metadata' }),
-            h("div", { key: '26258eaf4e250e200cf4515c283ef1fa6085fb88', class: "d-table gap-2 w-100" }, h(CodeBlock, { key: 'fe30682ce11c5a7dc9d401ba7af42b1a33ce437f', metadata: this.payout.metadata }))
+        return (h(StyledHost, { key: 'a8287bc7876fb6bc5c3d008ed567517f3867d224' }, this.loading && h(PayoutDetailsLoading, { key: '167de1bc4e1cd6ff9541cc2938b76a11c22ef5a0' }), !this.loading && this.errorMessage && ErrorState(this.errorMessage), !this.loading && this.payout && (h("justifi-details", { key: '855a958fef35272476d3627ab9090d878a931754', errorMessage: this.errorMessage }, h(EntityHeadInfo, { key: '3959ca35b2079b9c706e3d1ff61eff11908fd6fb', 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: 'dbf66f3e3182c064d25c5d954c94e5d9b33daedd', classes: "border-1 border-end", title: "Updated At", value: `${formatDate(this.payout.updated_at)} ${formatTime(this.payout.updated_at)}` }), h(EntityHeadInfoItem, { key: '6002a1271f9d8760b3b32ac58051ebcc349b3587', classes: "border-1 border-end", title: "Created At", value: `${formatDate(this.payout.created_at)} ${formatTime(this.payout.created_at)}` }), h(EntityHeadInfoItem, { key: '758cd5857f0bd662c1024e6a832af89682e6e04c', title: "ID", value: this.payout.id }), h("div", { key: '157f055fcde2d4f2459f9b0137d2336042060a2c', class: "m-4" }, h(Button, { key: 'b06499ec539625811d59a49247412a5e895d5a2b', variant: "outline-secondary", class: "btn btn-outline-secondary d-flex align-items-center", onClick: this.downloadCSV }, "Export CSV"))), h("div", { key: '3d9cfd34a6e287a036d9dbefebb6bccf9826f02a', slot: 'detail-sections' }, h(DetailSectionTitle, { key: '48dd8b899bb05a2ad9391dff4fc680d5217c2f57', sectionTitle: "Details" }), h("div", { key: '1ac554fc5cfd6d9bcd6c4bcf8c457fbe994d2012', class: "d-flex flex-column gap-2 w-100" }, h(DetailItem, { key: '579805f2dda9731924a1664d5e94688bcb9d4737', title: "Date paid", value: formatDate(this.payout.deposits_at) }), h(DetailItem, { key: '77e4f3c7c765f15e8db99be575d88a0a7eb133db', title: "Statement Description", value: this.payout.description }), h(DetailItem, { key: 'f17feb8d95a4a984b60c4cc4e5c6fdf256fd20ed', title: "Payout Method", value: this.formatMethod(this.payout.delivery_method) }), h(DetailItem, { key: '97f137eed7da0d7c97f60c6c5af09b3e3178961e', title: "Amount", value: this.payout.formattedPaymentAmount(this.payout.amount) }), h(DetailItem, { key: '434af541071ec379a70a7df53a2c53cded500391', title: "Fee", value: this.payout.formattedPaymentAmount(this.payout.fees_total) })), h(DetailSectionTitle, { key: 'f5faa48919e5f643d7056e8aca9f4874eed9d7a5', sectionTitle: "Account" }), h("div", { key: 'c78e1f2434c2de86b9e5bc22eba93ef23a7202d8', class: "d-flex flex-column gap-2 w-100" }, h(DetailItem, { key: '5daa43dfed4eab38c42fce4863690b7b9e6d87b9', title: "ID", value: this.payout.account_id, onClick: this.enableRecordClick ? () => this.handleRecordClick(this.payout.account_id) : undefined }), h(DetailItem, { key: '833178ee477cb751682b26e547500081517be7e4', title: "Account Type", value: this.payout.bank_account.account_type }), h(DetailItem, { key: '22fd85f14c1c3943f5405a85aa6f711af30d5035', title: "Institution", value: this.payout.bank_account.account_type }), h(DetailItem, { key: 'bfbcd75ff6ddcae0d4384a12e56900569f838e17', title: "Routing Number", value: this.payout.bank_account.routing_number }), h(DetailItem, { key: 'bb8da6a4483c081b10a3dab4594b0cdda40f3536', title: "Account Number", value: `**** ${this.payout.bank_account.account_number_last4}` })), this.payout.metadata && [
+            h(DetailSectionTitle, { key: '5e91b3074150b712ad9a7bd1237cead97b6e29db', sectionTitle: 'Metadata' }),
+            h("div", { key: '3f18620337f22267404f0f400ebd3f19f54ca2fa', class: "d-table gap-2 w-100" }, h(CodeBlock, { key: '931f6c2649336a7e5da27cc41460bdc9a5b99304', metadata: this.payout.metadata }))
         ])))));
     }
     static get is() { return "payout-details-core"; }

package/dist/collection/components/payout-transactions-list/{payout-transactions-list.js → justifi-payout-transactions-list.js}

@@ -9,7 +9,7 @@ import { StyledHost, TableEmptyState, TableErrorState, TableLoadingState } from
 import { defaultColumnsKeys, payoutTransactionTableCells, payoutTransactionTableColumns } from "./payout-transactions-table";
 import { configState } from "../config-provider/config-state";
 import { TableWrapper, TableComponent, TableHead, TableHeadRow, TableBody, TableRow, TableFoot, TableFootRow, TableFootCell, TableClickActions } from "../../ui-components";
-export class PayoutTransactionsList {
+export class JustifiPayoutTransactionsList {
     constructor() {
         this.balanceTransactions = [];
         this.isLoading = true;
@@ -95,7 +95,7 @@ export class PayoutTransactionsList {
         return Object.assign({ payout_id: this.payoutId, limit: '15' }, this.pagingParams);
     }
     render() {
-        return (h(StyledHost, { key: '751cbfab0ac4ebff575c0d6e6677bea57498f720' }, h(TableWrapper, { key: 'c5e9ae5f08e8011efd13b8e8fc920af25ab6cd80' }, h(TableComponent, { key: 'c2dc2e83a70c9a888d7b24eedca47444fdd7df23' }, h(TableHead, { key: 'f6031a02be719e94d5b5f6e9b780bf11fa94024a' }, h(TableHeadRow, { key: 'efcbc758449f7949f206cf3406ea63913687ef16' }, this.transactionsTable.columnData.map((column) => column))), h(TableBody, { key: '3e02a4b3d30c0e448ac8487ff1b10f0801c56972' }, h(TableLoadingState, { key: 'b2039804780914b796451e229a6d59e76987c8aa', columnSpan: this.transactionsTable.columnKeys.length, isLoading: this.isLoading }), h(TableEmptyState, { key: '020af52a09946e6711556e850a5bd973d0b8433d', isEmpty: this.showEmptyState, columnSpan: this.transactionsTable.columnKeys.length }), h(TableErrorState, { key: '299646c62cd4dc45d3c2ba02eb71be4506b2d11a', columnSpan: this.transactionsTable.columnKeys.length, errorMessage: this.errorMessage }), this.showRowData && this.transactionsTable.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: '488b386f6f1bf9fd27a862a0061dabe9c567266a' }, h(TableFootRow, { key: '3d83e2c8b5b966ef54fbd9835cef7950c090d2af' }, h(TableFootCell, { key: 'cf4751107a9db70b50b010c1e0c31e9015d63fd8', colSpan: this.transactionsTable.columnData.length }, h("pagination-menu", { key: '44e53f6fff05692d572bea438c06b3ec47a6fa00', paging: Object.assign(Object.assign({}, this.paging), { handleClickPrevious: this.handleClickPrevious, handleClickNext: this.handleClickNext }) })))))))));
+        return (h(StyledHost, { key: '417f224dbed2219cfffc1d51ed1610f8c17251cf' }, h(TableWrapper, { key: '79cec94e004bd1e0ddbc98856a51db756d22c870' }, h(TableComponent, { key: '4f1fc1cca1cbd21895a7b44b765f2f19481fe11e' }, h(TableHead, { key: '6b9f02ab6fc0e05cfed7b596c5fbe0090caa1c5b' }, h(TableHeadRow, { key: '4d6af26a445e4e4be884e254aee56ca3a2f5e928' }, this.transactionsTable.columnData.map((column) => column))), h(TableBody, { key: 'dc3847e822b42ad1ec3276a765e550010b3494ba' }, h(TableLoadingState, { key: 'e1d7dc0671c53340bac10fb6a8cba21d3491565d', columnSpan: this.transactionsTable.columnKeys.length, isLoading: this.isLoading }), h(TableEmptyState, { key: '5c0cb4eea3003c0d2b46fd8fa76b2e3cd6e06d1f', isEmpty: this.showEmptyState, columnSpan: this.transactionsTable.columnKeys.length }), h(TableErrorState, { key: '271edb981660d808298f3cd38c5b56bb975e20cf', columnSpan: this.transactionsTable.columnKeys.length, errorMessage: this.errorMessage }), this.showRowData && this.transactionsTable.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: '0413ee414642f7201e2de86b683d53ea8ecdcf3e' }, h(TableFootRow, { key: 'cb9f2f5a9343dd12a2a6ab8294e2d545ad553836' }, h(TableFootCell, { key: 'fcdcae20878346b0dd0225b9ef22083fb0d1dddd', colSpan: this.transactionsTable.columnData.length }, h("pagination-menu", { key: 'c6a2062f2bf46bddf452e72c18cc31e8d8628721', paging: Object.assign(Object.assign({}, this.paging), { handleClickPrevious: this.handleClickPrevious, handleClickNext: this.handleClickNext }) })))))))));
     }
     static get is() { return "justifi-payout-transactions-list"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/payouts-list/{payouts-list-filters.js → justifi-payouts-list-filters.js}

@@ -3,8 +3,8 @@ import { filterParams, propsParams, clearParams } from "./payouts-list-params-st
 import { StyledHost } from "../../ui-components";
 import { convertToLocal, convertToUTC } from "../../utils/utils";
 import { PayoutStatusesSafeNames } from "../../api";
-import { createdAfterPayoutsListFilterParam, createdBeforePayoutsListFilterParam, statusPayoutsListFilterParam, payoutsListFilterMenu } from "../../styles/parts";
-export class PayoutsListFilters {
+import { filterMenu, filterParam } from "../../styles/parts";
+export class JustifiPayoutsListFilters {
     constructor() {
         this.setParamsOnChange = (name, value) => {
             filterParams[name] = value;
@@ -39,9 +39,9 @@ export class PayoutsListFilters {
     }
     render() {
         const filterMenuParams = Object.assign({}, filterParams);
-        return (h(StyledHost, { key: '3f9c92bb1c8343a585994ed1c5ca83167bb727f4' }, h("table-filters-menu", { key: '24541b92ce3c7849672a102423ba9a255766ab6c', params: filterMenuParams, clearParams: clearParams, part: payoutsListFilterMenu }, h("div", { key: '4ff34c77d5e7604fdc7ce94a61c4d169b14365e5', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: 'f4b1a23f8751fce9885cd8d7b05d4a688b4a71e3', class: "p-2" }, h("form-control-select", { key: '37759ec95ccf6aec5a5259bdb182fd06897cb3c0', name: "status", label: "Status", options: this.statusOptions, inputHandler: this.setParamsOnChange, defaultValue: this.status || filterParams.status || '', disabled: !!this.status, part: statusPayoutsListFilterParam })), h("div", { key: 'cc32187e2c4653b822e8de20305e771fea23e273', class: "p-2" }, h("form-control-date", { key: '69e75011e03b6adcfd1c5b9719c37102f7720804', name: "created_after", label: "Created After", inputHandler: this.handleDateInput, defaultValue: convertToLocal(this.createdAfter, { showInputDate: true }) ||
-                convertToLocal(filterParams.created_after, { showInputDate: true }), disabled: !!this.createdAfter, part: createdAfterPayoutsListFilterParam })), h("div", { key: '9067d3377545bff47484289ef9e2a83eb40a76f6', class: "p-2" }, h("form-control-date", { key: '427582860a555d14a0e947e41c0f3d1417e83eeb', name: "created_before", label: "Created Before", inputHandler: this.handleDateInput, defaultValue: convertToLocal(this.createdBefore, { showInputDate: true }) ||
-                convertToLocal(filterParams.created_before, { showInputDate: true }), disabled: !!this.createdBefore, part: createdBeforePayoutsListFilterParam }))))));
+        return (h(StyledHost, { key: '8be08663402766ca7c59a8e13a5dd6c375921274' }, h("table-filters-menu", { key: 'a93fc8c2a91a6cd751e9a666534a3fa011e8035a', params: filterMenuParams, clearParams: clearParams, part: filterMenu }, h("div", { key: '550cc64313b40f3a86022bdf1c5381b9bcccb61d', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: 'c7a331add778b6089b42faac0cf9647af3dff0d0', class: "p-2" }, h("form-control-select", { key: '60ad687908b8bb7b08ff3b84d8feec19e1508d1a', name: "status", label: "Status", options: this.statusOptions, inputHandler: this.setParamsOnChange, defaultValue: this.status || filterParams.status || '', disabled: !!this.status, part: filterParam })), h("div", { key: '1144dab54cc77610ab2a7d12cb5ea22d615e5831', class: "p-2" }, h("form-control-date", { key: '1570cffe6b35742441c081314f4c5fb0dc8e4be4', name: "created_after", label: "Created After", inputHandler: this.handleDateInput, defaultValue: convertToLocal(this.createdAfter, { showInputDate: true }) ||
+                convertToLocal(filterParams.created_after, { showInputDate: true }), disabled: !!this.createdAfter, part: filterParam })), h("div", { key: '1fba24a82ce558bf2362eba2745be47dca4f7024', class: "p-2" }, h("form-control-date", { key: 'd52f8bdbb1616aa7951a669e0fa1a76b64ef1f3c', name: "created_before", label: "Created Before", inputHandler: this.handleDateInput, defaultValue: convertToLocal(this.createdBefore, { showInputDate: true }) ||
+                convertToLocal(filterParams.created_before, { showInputDate: true }), disabled: !!this.createdBefore, part: filterParam }))))));
     }
     static get is() { return "justifi-payouts-list-filters"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/payouts-list/{payouts-list.js → justifi-payouts-list.js}

@@ -9,7 +9,7 @@ import { SubAccountService } from "../../api/services/subaccounts.service";
 import { StyledHost } from "../../ui-components";
 import { defaultColumnsKeys } from "./payouts-table";
 import { makeGetSubAccounts } from "../../actions/sub-account/get-subaccounts";
-export class PayoutsList {
+export class JustifiPayoutsList {
     constructor() {
         this.errorMessage = null;
         this.columns = defaultColumnsKeys;
@@ -64,7 +64,7 @@ export class PayoutsList {
         }
     }
     render() {
-        return (h(StyledHost, { key: '482b4781f039e885ce1782e2817739fbc79994e5' }, h("payouts-list-core", { key: 'f38ce3000c1b7bc7f93aa5a1a4e87858f39d1456', getPayouts: this.getPayouts, getPayoutCSV: this.getPayoutCSV, getSubAccounts: this.getSubAccounts, "onError-event": this.handleOnError, columns: this.columns })));
+        return (h(StyledHost, { key: '6b277749b0f621327a6614cbdeffe595637b92b1' }, h("payouts-list-core", { key: '1c589706ad38c7e8e74f82ab29b431e6028a19bd', getPayouts: this.getPayouts, getPayoutCSV: this.getPayoutCSV, getSubAccounts: this.getSubAccounts, "onError-event": this.handleOnError, columns: this.columns })));
     }
     static get is() { return "justifi-payouts-list"; }
     static get encapsulation() { return "shadow"; }

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

@@ -135,7 +135,7 @@ export class PayoutsListCore {
         return !this.showEmptyState && !this.showErrorState && !this.loading;
     }
     render() {
-        return (h(TableWrapper, { key: '9d4901c03d1675ddd796f39e0cdcf26ca00429a1' }, h(TableComponent, { key: '33b4fcacd131e6c0da270794ba0468b2fd56da06' }, h(TableHead, { key: '75c31aa3ba376963ede6772cad99d4b1300aafd7' }, h(TableHeadRow, { key: '68c2afe4d5c0a0454d93a3524081d56dd40cebe4' }, this.payoutsTable.columnData.map((column) => column))), h(TableBody, { key: 'cb63360e078916afcf693edc8044f16b591c044a' }, h(TableLoadingState, { key: '7d70f2f379238562c067d2167f689bc312f00775', columnSpan: this.payoutsTable.columnKeys.length, isLoading: this.loading }), h(TableEmptyState, { key: '5ad3d0c6bcda30cc3717c5665b7c97d07893a013', isEmpty: this.showEmptyState, columnSpan: this.payoutsTable.columnKeys.length }), h(TableErrorState, { key: '5fea02bcfc56b40b99cb16bd29d7657629273374', 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: '93eeae7b266e3973f4ec11ad645fb870711c855d' }, h(TableFootRow, { key: '9a4e32b57717b2245b66e23ac909ffe97edf6f96' }, h(TableFootCell, { key: '6d4ce9cc708528176c8d574bddc291f2440fe262', colSpan: this.payoutsTable.columnData.length }, h("pagination-menu", { key: '0ae57a77ebfde889ddc540886b3b7c7d74a3d133', paging: Object.assign(Object.assign({}, this.paging), { handleClickPrevious: this.handleClickPrevious, handleClickNext: this.handleClickNext }) }))))))));
+        return (h(TableWrapper, { key: 'fc1f3f0ae5303b725825fb85511c1b82d1859e51' }, h(TableComponent, { key: '39cc756942ee907a4f28d393f9394f3b2fe8de65' }, h(TableHead, { key: '14a32b75bcc3c5acf3ebb991138551158e77f1f0' }, h(TableHeadRow, { key: '54994adbec3b9e989e310061342fb39254f676e8' }, this.payoutsTable.columnData.map((column) => column))), h(TableBody, { key: '589a1bd6a80eb70597905cb5158c7fb957f139c4' }, h(TableLoadingState, { key: '04e43f7dc4762d202dc1e8a6eacf398ca4f0a491', columnSpan: this.payoutsTable.columnKeys.length, isLoading: this.loading }), h(TableEmptyState, { key: '4111b8f9acdf91495661001feab7f608611b3fcc', isEmpty: this.showEmptyState, columnSpan: this.payoutsTable.columnKeys.length }), h(TableErrorState, { key: 'de53388b6812ea1663140799c9e1278e0bfb1a05', 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: '6d4b26f00c3610881e0984f8cc12ce81b400b5f4' }, h(TableFootRow, { key: '874f4bb62fae785bf940b6ad14dd352c4c76ec81' }, h(TableFootCell, { key: '27283f9f1bbf3608d094da4b72bb3aadcf0e3e88', colSpan: this.payoutsTable.columnData.length }, h("pagination-menu", { key: '746ef2cfbdab63f03fa1910999d7da0dcdd5d108', paging: Object.assign(Object.assign({}, this.paging), { handleClickPrevious: this.handleClickPrevious, handleClickNext: this.handleClickNext }) }))))))));
     }
     static get is() { return "payouts-list-core"; }
     static get properties() {

package/dist/collection/components/refund-payment/{refund-payment.js → justifi-refund-payment.js}

@@ -14,7 +14,7 @@ import { RefundService } from "../../api/services/refund.service";
 import { makePostVoid } from "../../actions/void/void-actions";
 import { VoidService } from "../../api/services/void.service";
 import { RefundLoading } from "./refund-loading";
-export class RefundPayment {
+export class JustifiRefundPayment {
     constructor() {
         this.refundPayload = {};
         this.displayAmount = '';

package/dist/collection/components/terminal-orders-list/{terminal-orders-list-filters.js → justifi-terminal-orders-list-filters.js}

@@ -1,10 +1,11 @@
 import { h } from "@stencil/core";
+import { debounce } from "lodash";
 import { filterParams, propsParams, clearParams } from "./terminal-orders-list-params-state";
 import { StyledHost } from "../../ui-components";
 import { TerminalOrderStatus, TerminalOrderType } from "../../api";
 import { convertToLocal, convertToUTC } from "../../utils/utils";
-import { terminalOrdersListFilterMenu, orderStatusTerminalOrdersListFilterParam, orderTypeTerminalOrdersListFilterParam, createdAfterTerminalOrdersListFilterParam, createdBeforeTerminalOrdersListFilterParam } from "../../styles/parts";
-export class TerminalOrdersListFilters {
+import { filterMenu, filterParam } from "../../styles/parts";
+export class JustifiTerminalOrdersListFilters {
     constructor() {
         this.setParamsOnChange = (name, value) => {
             filterParams[name] = value;
@@ -15,11 +16,13 @@ export class TerminalOrdersListFilters {
         };
     }
     componentWillLoad() {
+        this.debouncedSetParamsOnChange = debounce(this.setParamsOnChange, 300);
         const propsToSet = {
             order_status: this.orderStatus,
             order_type: this.orderType,
             created_after: this.createdAfter,
-            created_before: this.createdBefore
+            created_before: this.createdBefore,
+            company_name: this.companyName
         };
         Object.entries(propsToSet).forEach(([key, value]) => {
             if (value) {
@@ -47,9 +50,9 @@ export class TerminalOrdersListFilters {
     }
     render() {
         const filterMenuParams = Object.assign({}, filterParams);
-        return (h(StyledHost, { key: 'e10311bf0cdb5aab7ec7a96a05216bc39231db77' }, h("table-filters-menu", { key: '9402f8bd704c5d76504f0c7b3da78b51c519f69d', params: filterMenuParams, clearParams: clearParams, part: terminalOrdersListFilterMenu }, h("div", { key: '87af1b11432fc9dab0ce81e763e417e04d024dcc', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: 'b12db0f4cb4dd0256406db39cd585fbcb301f6e9', class: "p-2" }, h("form-control-select", { key: '50137d63a0f8fbf71fd0c49cb9227f180a5a4277', name: "order_status", label: "Order Status", options: this.terminalOrderStatusOptions, inputHandler: this.setParamsOnChange, defaultValue: this.orderStatus || filterParams.order_status || '', disabled: !!this.orderStatus, part: orderStatusTerminalOrdersListFilterParam })), h("div", { key: 'aa5c6e5115a8e5fc0394fc36823a229643659968', class: "p-2" }, h("form-control-select", { key: '4b5d54c20275ff4951f9f26d780dfeab609a7b0e', name: "order_type", label: "Order Type", options: this.terminalOrderTypeOptions, inputHandler: this.setParamsOnChange, defaultValue: this.orderType || filterParams.order_type || '', disabled: !!this.orderType, part: orderTypeTerminalOrdersListFilterParam })), h("div", { key: '6f1f85268e131865bcfc27395ca90b86f9e9aa30', class: "p-2" }, h("form-control-date", { key: '4c2173c3992e6dfd10d133c106e2b706d3ad6d10', name: "created_after", label: "Created After", inputHandler: this.handleDateInput, defaultValue: convertToLocal(this.createdAfter, { showInputDateTime: true }) ||
-                convertToLocal(filterParams.created_after, { showInputDateTime: true }), showTime: true, disabled: !!this.createdAfter, part: createdAfterTerminalOrdersListFilterParam })), h("div", { key: 'cc629832d18b1de06b3f513ca80648e4cf10f439', class: "p-2" }, h("form-control-date", { key: 'a4bb24199f37fce8f3971262fbe9cd62af7a18f5', name: "created_before", label: "Created Before", inputHandler: this.handleDateInput, defaultValue: convertToLocal(this.createdBefore, { showInputDateTime: true }) ||
-                convertToLocal(filterParams.created_before, { showInputDateTime: true }), showTime: true, disabled: !!this.createdBefore, part: createdBeforeTerminalOrdersListFilterParam }))))));
+        return (h(StyledHost, { key: '07b1d17154c1591edc84a5b629ec5ff7497415b5' }, h("table-filters-menu", { key: '9e135185e74772ff22ceca20edba9181e78894bb', params: filterMenuParams, clearParams: clearParams, part: filterMenu }, h("div", { key: 'b9643f722c20fef5e06922397574cd420bb82966', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: 'eadd681467e5f2bb89a643bf21f04070e50448a9', class: "p-2" }, h("form-control-select", { key: '9d631821783b5b1a2fc0ba9de0d2643cf07d3361', name: "order_status", label: "Order Status", options: this.terminalOrderStatusOptions, inputHandler: this.setParamsOnChange, defaultValue: this.orderStatus || filterParams.order_status || '', disabled: !!this.orderStatus, part: filterParam })), h("div", { key: 'd9cc60a5dd75d49bd1b4ec7ac9adbae5d8e7cb26', class: "p-2" }, h("form-control-select", { key: '5789baffe41c67a53586e79fdf14005ff60314c3', name: "order_type", label: "Order Type", options: this.terminalOrderTypeOptions, inputHandler: this.setParamsOnChange, defaultValue: this.orderType || filterParams.order_type || '', disabled: !!this.orderType, part: filterParam })), h("div", { key: '7856f1979f696ab205a067f205cf5dead033fe31', class: "p-2" }, h("form-control-date", { key: '4a715c7f582fe3261bf1ae0523a27f987855e88b', name: "created_after", label: "Created After", inputHandler: this.handleDateInput, defaultValue: convertToLocal(this.createdAfter, { showInputDateTime: true }) ||
+                convertToLocal(filterParams.created_after, { showInputDateTime: true }), showTime: true, disabled: !!this.createdAfter, part: filterParam })), h("div", { key: '29244342d9660ab59be8ac6ebcac10bb29233f2b', class: "p-2" }, h("form-control-date", { key: 'a061f8553db0a901cb533ec2726850392bc155eb', name: "created_before", label: "Created Before", inputHandler: this.handleDateInput, defaultValue: convertToLocal(this.createdBefore, { showInputDateTime: true }) ||
+                convertToLocal(filterParams.created_before, { showInputDateTime: true }), showTime: true, disabled: !!this.createdBefore, part: filterParam })), h("div", { key: '11c34b1ab7f619b7ee1d236952b295d39ff44010', class: "p-2" }, h("form-control-text", { key: '129e422e5e90ea6fc54c0cdfbd28c361dbf79227', name: "company_name", label: "Company Name", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.companyName || filterParams.company_name, disabled: !!this.companyName, part: filterParam }))))));
     }
     static get is() { return "justifi-terminal-orders-list-filters"; }
     static get encapsulation() { return "shadow"; }
@@ -142,6 +145,25 @@ export class TerminalOrdersListFilters {
                 "setter": false,
                 "reflect": false,
                 "attribute": "created-before"
+            },
+            "companyName": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "company-name"
             }
         };
     }

package/dist/collection/components/terminal-orders-list/{terminal-orders-list.js → justifi-terminal-orders-list.js}

@@ -6,7 +6,7 @@ import { makeGetTerminalOrders } from "../../actions/terminal/get-terminal-order
 import { TerminalOrderService } from "../../api/services/terminal_orders.service";
 import { ComponentErrorCodes, ComponentErrorSeverity } from "../../api";
 import JustifiAnalytics from "../../api/Analytics";
-export class TerminalOrdersList {
+export class JustifiTerminalOrdersList {
     constructor() {
         this.errorMessage = null;
         this.columns = defaultColumnsKeys;
@@ -43,7 +43,7 @@ export class TerminalOrdersList {
         }
     }
     render() {
-        return (h(StyledHost, { key: '19a055907283ae2a126bdb2a509c3a4a991521f2' }, h("terminal-orders-list-core", { key: '04df9d1ce1cca14b07e879137abbced011d02486', getTerminalOrders: this.getTerminalOrders, "onError-event": this.handleErrorEvent, columns: this.columns })));
+        return (h(StyledHost, { key: 'f7854de93d0916c5d01cd14772715290bd149d09' }, h("terminal-orders-list-core", { key: '965d8e73e7def3508b59bf35940872f05ebe8c80', getTerminalOrders: this.getTerminalOrders, "onError-event": this.handleErrorEvent, columns: this.columns })));
     }
     static get is() { return "justifi-terminal-orders-list"; }
     static get encapsulation() { return "shadow"; }