@justifi/webcomponents 5.7.6 → 6.0.0-rc.1

package/dist/esm/{Api-Bes3KkG6.js → Api-N_veT2p6.js}

@@ -1,5 +1,5 @@
 import { w as waitForConfig, c as configState } from './config-state-BrllxiM0.js';
-import { g as generateId } from './utils-DIxPWgIk.js';
+import { g as generateId } from './utils-lb8p1Exq.js';
 
 const Api = () => {
     async function getAuthorizationHeader(authToken) {

package/dist/esm/{ComponentError-SdntD1xf.js → ComponentError-Cjcsf8ku.js}

@@ -6,10 +6,14 @@ var ComponentErrorCodes;
     ComponentErrorCodes["POST_ERROR"] = "post-error";
     ComponentErrorCodes["UNKNOWN_ERROR"] = "unknown-error";
     ComponentErrorCodes["TOKENIZE_ERROR"] = "tokenize-error";
+    ComponentErrorCodes["COMPLETE_CHECKOUT_ERROR"] = "complete-checkout-error";
+    ComponentErrorCodes["CHECKOUT_ALREADY_COMPLETED"] = "checkout-already-completed";
+    ComponentErrorCodes["CHECKOUT_EXPIRED"] = "checkout-expired";
     ComponentErrorCodes["NOT_AUTHENTICATED"] = "not-authenticated";
     ComponentErrorCodes["INVALID_PARAMETER"] = "invalid-parameter";
     ComponentErrorCodes["PROVISIONING_REQUESTED"] = "provisioning-already-requested";
     ComponentErrorCodes["INVALID_REFUND_AMOUNT"] = "invalid-refund-amount";
+    ComponentErrorCodes["VALIDATION_ERROR"] = "validation-error";
 })(ComponentErrorCodes || (ComponentErrorCodes = {}));
 var ComponentErrorSeverity;
 (function (ComponentErrorSeverity) {
@@ -17,5 +21,11 @@ var ComponentErrorSeverity;
     ComponentErrorSeverity["WARNING"] = "warning";
     ComponentErrorSeverity["ERROR"] = "error";
 })(ComponentErrorSeverity || (ComponentErrorSeverity = {}));
+var ComponentErrorMessages;
+(function (ComponentErrorMessages) {
+    ComponentErrorMessages["NOT_AUTHENTICATED"] = "Not authenticated. Please provide a valid auth token, checkout id, and account id.";
+    ComponentErrorMessages["CHECKOUT_ALREADY_COMPLETED"] = "Checkout already completed. Please create a new checkout.";
+    ComponentErrorMessages["CHECKOUT_EXPIRED"] = "Checkout expired. Please create a new checkout.";
+})(ComponentErrorMessages || (ComponentErrorMessages = {}));
 
-export { ComponentErrorSeverity as C, ComponentErrorCodes as a };
+export { ComponentErrorSeverity as C, ComponentErrorCodes as a, ComponentErrorMessages as b };

package/dist/esm/{Dispute-7MWRbTXI.js → Dispute-BH0Xfn-F.js}

@@ -54,4 +54,4 @@ class DisputeResponse {
     }
 }
 
-export { DisputeStatus as D, Dispute as a };
+export { Dispute as D, DisputeStatus as a };

package/dist/esm/{Refund-CISeDJoW.js → Refund-Di6J0oN2.js}

@@ -1,4 +1,246 @@
-import { f as formatCurrency } from './utils-DIxPWgIk.js';
+import { f as formatCurrency } from './utils-lb8p1Exq.js';
+import { a as DisputeStatus } from './Dispute-BH0Xfn-F.js';
+
+class Completion {
+    constructor(data) {
+        this.payment_mode = ICheckoutPaymentMode[data.payment_mode];
+        this.payment_token = data.payment_token;
+        this.payment_status = data.payment_status;
+        this.payment_response = data.payment_response;
+        this.payment_error_code = data.payment_error_code;
+        this.payment_error_description = data.payment_error_description;
+        this.checkout_id = data.checkout_id;
+        this.additional_transactions = data.additional_transactions;
+        this.payment_id = data.payment_id;
+        this.payment_method_id = data.payment_method_id;
+        this.status = data.status;
+        this.created_at = data.created_at;
+        this.updated_at = data.updated_at;
+    }
+}
+class Checkout {
+    constructor(data) {
+        var _a;
+        this.id = data.id;
+        this.description = data.description;
+        this.payment_intent_id = data.payment_intent_id;
+        this.account_id = data.account_id;
+        this.platform_account_id = data.platform_account_id;
+        this.payment_amount = data.payment_amount;
+        this.payment_client_id = data.payment_client_id;
+        this.payment_description = data.payment_description;
+        this.payment_methods = data.payment_methods;
+        this.payment_method_group_id = data.payment_method_group_id;
+        this.payment_settings = data.payment_settings;
+        this.bnpl = data.bnpl;
+        this.total_amount = data.total_amount;
+        this.insurance_amount = data.insurance_amount;
+        this.status = ICheckoutStatus[data.status];
+        this.payment_currency = data.payment_currency;
+        this.mode = data.mode;
+        this.statement_descriptor = data.statement_descriptor;
+        this.application_fees = data.application_fees;
+        this.successful_payment_id = data.successful_payment_id;
+        this.created_at = data.created_at;
+        this.updated_at = data.updated_at;
+        this.completions = (_a = data.completions) === null || _a === void 0 ? void 0 : _a.map((completion) => new Completion(completion));
+    }
+    get payment_mode() {
+        var _a, _b, _c, _d, _e, _f;
+        let paymentMode;
+        if (!this.completions || this.completions.length === 0) {
+            return ICheckoutPaymentMode.unknown;
+        }
+        const sortedCompletions = this.completions.sort((a, b) => {
+            return (new Date(b.updated_at).getTime() - new Date(a.updated_at).getTime());
+        });
+        const lastCompletion = sortedCompletions[0];
+        if (lastCompletion.payment_mode) {
+            paymentMode = lastCompletion.payment_mode;
+        }
+        else if ((_c = (_b = (_a = lastCompletion.payment_response) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.payment_method) === null || _c === void 0 ? void 0 : _c.card) {
+            paymentMode = ICheckoutPaymentMode.card;
+        }
+        else if ((_f = (_e = (_d = lastCompletion.payment_response) === null || _d === void 0 ? void 0 : _d.data) === null || _e === void 0 ? void 0 : _e.payment_method) === null || _f === void 0 ? void 0 : _f.bank_account) {
+            paymentMode = ICheckoutPaymentMode.bank_account;
+        }
+        return paymentMode;
+    }
+    formattedPaymentAmount(amount) {
+        return formatCurrency(amount, this.payment_currency);
+    }
+}
+var ICheckoutPaymentMode;
+(function (ICheckoutPaymentMode) {
+    ICheckoutPaymentMode["bnpl"] = "Buy Now Pay Later";
+    ICheckoutPaymentMode["ecom"] = "E-commerce";
+    ICheckoutPaymentMode["card"] = "Card";
+    ICheckoutPaymentMode["bank_account"] = "Bank Account";
+    ICheckoutPaymentMode["card_present"] = "Card Present";
+    ICheckoutPaymentMode["unknown"] = "";
+})(ICheckoutPaymentMode || (ICheckoutPaymentMode = {}));
+var ICheckoutPaymentModeParam;
+(function (ICheckoutPaymentModeParam) {
+    ICheckoutPaymentModeParam["bnpl"] = "bnpl";
+    ICheckoutPaymentModeParam["ecom"] = "ecom";
+})(ICheckoutPaymentModeParam || (ICheckoutPaymentModeParam = {}));
+var ICheckoutStatus;
+(function (ICheckoutStatus) {
+    ICheckoutStatus["created"] = "created";
+    ICheckoutStatus["completed"] = "completed";
+    ICheckoutStatus["attempted"] = "attempted";
+    ICheckoutStatus["expired"] = "expired";
+})(ICheckoutStatus || (ICheckoutStatus = {}));
+var CompletionStatuses;
+(function (CompletionStatuses) {
+    CompletionStatuses["failed"] = "failed";
+    CompletionStatuses["succeeded"] = "succeeded";
+})(CompletionStatuses || (CompletionStatuses = {}));
+
+var CaptureStrategy;
+(function (CaptureStrategy) {
+    CaptureStrategy["automatic"] = "automatic";
+    CaptureStrategy["manual"] = "manual";
+})(CaptureStrategy || (CaptureStrategy = {}));
+var PaymentMethodTypes;
+(function (PaymentMethodTypes) {
+    PaymentMethodTypes["card"] = "card";
+    PaymentMethodTypes["bankAccount"] = "bankAccount";
+    PaymentMethodTypes["sezzle"] = "sezzle";
+    PaymentMethodTypes["saved"] = "saved";
+})(PaymentMethodTypes || (PaymentMethodTypes = {}));
+var PaymentTypes;
+(function (PaymentTypes) {
+    PaymentTypes["card"] = "Card";
+    PaymentTypes["bankAccount"] = "ACH";
+    PaymentTypes["unknown"] = "Unknown";
+})(PaymentTypes || (PaymentTypes = {}));
+var PaymentStatuses;
+(function (PaymentStatuses) {
+    PaymentStatuses["pending"] = "pending";
+    PaymentStatuses["automatic"] = "automatic";
+    PaymentStatuses["authorized"] = "authorized";
+    PaymentStatuses["succeeded"] = "succeeded";
+    PaymentStatuses["failed"] = "failed";
+    PaymentStatuses["canceled"] = "canceled";
+    PaymentStatuses["disputed"] = "disputed";
+    PaymentStatuses["fully_refunded"] = "fully_refunded";
+    PaymentStatuses["partially_refunded"] = "partially_refunded";
+})(PaymentStatuses || (PaymentStatuses = {}));
+var CurrencyTypes;
+(function (CurrencyTypes) {
+    CurrencyTypes["usd"] = "usd";
+    CurrencyTypes["cad"] = "cad";
+})(CurrencyTypes || (CurrencyTypes = {}));
+class PaymentMethod {
+    constructor(paymentMethod) {
+        this.card = paymentMethod.card ? new Card(paymentMethod.card) : undefined;
+        this.bank_account = paymentMethod.bank_account
+            ? new BankAccount(paymentMethod.bank_account)
+            : undefined;
+    }
+    get payersName() {
+        if (this.card) {
+            return this.card.name;
+        }
+        else if (this.bank_account) {
+            return this.bank_account.name;
+        }
+        return null;
+    }
+    get lastFourDigits() {
+        if (this.card) {
+            return `**** ${this.card.acct_last_four}`;
+        }
+        else if (this.bank_account) {
+            return `**** ${this.bank_account.acct_last_four}`;
+        }
+        return null;
+    }
+}
+class BankAccount {
+    constructor(bankAccount) {
+        this.id = bankAccount.id;
+        this.acct_last_four = bankAccount.acct_last_four;
+        this.name = bankAccount.name;
+        this.brand = bankAccount.brand;
+        this.token = bankAccount.token;
+        this.created_at = bankAccount.created_at;
+        this.updated_at = bankAccount.updated_at;
+    }
+}
+class Card {
+    constructor(card) {
+        this.id = card.id || '';
+        this.acct_last_four = card.acct_last_four;
+        this.name = card.name;
+        this.brand = card.brand;
+        this.token = card.token;
+        this.created_at = card.created_at;
+        this.updated_at = card.updated_at;
+    }
+}
+class Payment {
+    constructor(payment) {
+        this.id = payment.id;
+        this.account_id = payment.account_id;
+        this.currency = payment.currency;
+        this.amount = payment.amount;
+        this.amount_disputed = payment.amount_disputed;
+        this.amount_refundable = payment.amount_refundable;
+        this.amount_refunded = payment.amount_refunded;
+        this.balance = payment.balance;
+        this.captured = payment.captured;
+        this.capture_strategy = payment.capture_strategy;
+        this.description = payment.description;
+        this.disputed = payment.disputed;
+        this.disputes = payment.disputes;
+        this.error_code = payment.error_code;
+        this.error_description = payment.error_description;
+        this.expedited = payment.expedited;
+        this.fee_amount = payment.fee_amount;
+        this.is_test = payment.is_test;
+        this.metadata = payment.metadata;
+        this.payment_method = new PaymentMethod(payment.payment_method);
+        this.payment_intent_id = payment.payment_intent_id;
+        this.refunded = payment.refunded;
+        this.status = payment.status;
+        this.created_at = payment.created_at;
+        this.updated_at = payment.updated_at;
+    }
+    get disputedStatus() {
+        const lost = this.disputes.some((dispute) => dispute.status === DisputeStatus.lost);
+        // if a dispute is 'won', we don't show a dispute status, just general status
+        // TODO: update this logic to work with new DisputeStatus enum
+        // (cast 'open' as DisputeStatus in the meantime to keep existing functionality)
+        if (!this.disputed) {
+            return null;
+        }
+        else if (lost) {
+            return DisputeStatus.lost;
+        }
+        else {
+            return 'open';
+        }
+    }
+    get payment_type() {
+        if (this.payment_method) {
+            return this.payment_method.card ? PaymentTypes.card : PaymentTypes.bankAccount;
+        }
+        else {
+            return PaymentTypes.unknown;
+        }
+    }
+    get payers_name() {
+        return this.payment_method.payersName;
+    }
+    get last_four_digits() {
+        return this.payment_method.lastFourDigits;
+    }
+    formattedPaymentAmount(amount) {
+        return formatCurrency(amount, this.currency);
+    }
+}
 
 var PaymentBalanceTxnType;
 (function (PaymentBalanceTxnType) {
@@ -339,4 +581,4 @@ class RefundPayload {
     }
 }
 
-export { EntityDocumentType as E, ITerminalStatus as I, Payout as P, RefundReasons as R, SubAccount as S, TerminalOrderStatus as T, TerminalOrderType as a, Terminal as b, PaymentBalanceTransaction as c, PayoutBalanceTransaction as d, TerminalOrder as e, TerminalModel as f, RefundPayload as g, EntityDocumentStorage as h, EntityDocument as i };
+export { Checkout as C, EntityDocumentType as E, ICheckoutStatus as I, Payment as P, RefundReasons as R, SubAccount as S, TerminalOrderStatus as T, ICheckoutPaymentModeParam as a, TerminalOrderType as b, ITerminalStatus as c, Payout as d, Terminal as e, PaymentBalanceTransaction as f, PayoutBalanceTransaction as g, TerminalOrder as h, TerminalModel as i, RefundPayload as j, PaymentMethodTypes as k, EntityDocumentStorage as l, EntityDocument as m };

package/dist/esm/additional-questions-details_5.entry.js

@@ -1,7 +1,8 @@
 import { r as registerInstance, h, H as Host } from './index-kpoIU4v_.js';
-import { c as DetailItem, D as DetailSectionTitle } from './utils-DOW3rBEH.js';
-import { l as isEmptyObject, s as snakeCaseToHumanReadable, m as formatMediumDate } from './utils-DIxPWgIk.js';
-import './parts-CVGBVdVC.js';
+import { c as DetailItem, D as DetailSectionTitle } from './utils-kWaZhFAd.js';
+import { l as isEmptyObject, s as snakeCaseToHumanReadable, m as formatMediumDate } from './utils-lb8p1Exq.js';
+import './parts-CfF8KKwx.js';
+import './dinero-HXpYMWUU.js';
 
 const AdditionalQuestionsDetails = class {
     constructor(hostRef) {

package/dist/esm/{badge-BRPxcFAe.js → badge-D_mzXSCQ.js}

@@ -1,5 +1,5 @@
 import { h } from './index-kpoIU4v_.js';
-import { F as badgeDark, G as badgeLight, H as badgeInfo, I as badgeWarning, J as badgeDanger, K as badgeSuccess, L as badgeSecondary, M as badgePrimary, N as badge } from './parts-CVGBVdVC.js';
+import { H as badgeDark, I as badgeLight, J as badgeInfo, K as badgeWarning, L as badgeDanger, M as badgeSuccess, N as badgeSecondary, O as badgePrimary, P as badge } from './parts-CfF8KKwx.js';
 
 var BadgeVariant;
 (function (BadgeVariant) {

package/dist/esm/bank-account-document-form-inputs_4.entry.js

@@ -1,20 +1,19 @@
 import { r as registerInstance, h, H as Host, c as createEvent, g as getElement } from './index-kpoIU4v_.js';
 import './config-state-BrllxiM0.js';
-import { s as snakeCaseToHumanReadable, d as formatDate, i as formatTimeSeconds } from './utils-DIxPWgIk.js';
-import './ComponentError-SdntD1xf.js';
-import './Checkout-DfRTGCdt.js';
+import './dinero-HXpYMWUU.js';
+import './ComponentError-Cjcsf8ku.js';
+import { E as EntityDocumentType } from './Refund-Di6J0oN2.js';
 import './Pagination-CLHwhyvu.js';
-import './Payment-93PpwzdC.js';
-import { E as EntityDocumentType } from './Refund-CISeDJoW.js';
 import './Business-BCoP0TAV.js';
-import './Dispute-7MWRbTXI.js';
+import './Dispute-BH0Xfn-F.js';
 import { c as bankAccountTypeOptions } from './business-form-options-CgssATyg.js';
 import './event-types-XYgDHrVL.js';
 import { n as numberOnlyHandler } from './utils-BnjCmwMr.js';
-import { X as card, D as heading2, al as table, P as tableHeadCell, am as tableCell, c as input, l as label, b as inputInvalid, R as inputDisabled, a as inputFocused } from './parts-CVGBVdVC.js';
-import { S as Skeleton } from './skeleton-MHyzfkPM.js';
+import { s as snakeCaseToHumanReadable, d as formatDate, i as formatTimeSeconds } from './utils-lb8p1Exq.js';
+import { Y as card, G as heading2, aj as table, R as tableHeadCell, ak as tableCell, c as input, l as label, b as inputInvalid, T as inputDisabled, a as inputFocused } from './parts-CfF8KKwx.js';
+import { S as Skeleton } from './skeleton-DrHwsgs_.js';
 import './event-types-CZfYo5-1.js';
-import { F as FormControlErrorText } from './form-control-error-text-BvjVjw2l.js';
+import { F as FormControlErrorText } from './form-control-error-text-D3ZwkOv-.js';
 import './index-B9me4yN2.js';
 import './helpers-Mu7LQT-w.js';
 import './state-options-BX8GieXu.js';
@@ -24,7 +23,7 @@ const BankAccountDocumentFormInputs = class {
         registerInstance(this, hostRef);
     }
     render() {
-        return (h("div", { key: 'a3ff8b1ff23923beb847e66d6c56a39de9a86434', class: "row gy-3" }, h("div", { key: '86f9ba3a8f0f87f7fa67ba0fcf1d7c04f67e9bc5', class: "col-12" }, h("form-control-file", { key: '9cc2bc21414c8e3f4b25ac47b76340a4ce569c42', name: "voided_check", label: "Voided Check", documentType: EntityDocumentType.voidedCheck, inputHandler: this.inputHandler, onFileSelected: this.storeFiles, errorText: this.errors["voided_check"], multiple: true })), h("div", { key: 'bee72d6c63514cdbd3200910d3a53b045c60d05d', class: "col-12" }, h("form-control-file", { key: '80a79f352d078cd210768b4060cad7014b1060c5', name: "bank_statement", label: "Bank Statement", documentType: EntityDocumentType.bankStatement, inputHandler: this.inputHandler, onFileSelected: this.storeFiles, errorText: this.errors["bank_statement"], multiple: true }))));
+        return (h("div", { key: '23f5fa6b191b3feea7677a85a421002642a86f50', class: "row gy-3" }, h("div", { key: 'da9d9698f15aeb4bb05baef8fb63c630fcff8a82', class: "col-12" }, h("form-control-file", { key: 'b84a8ec1753210f74989c04b5520f0e94c5a083d', name: "voided_check", label: "Voided Check", documentType: EntityDocumentType.voidedCheck, inputHandler: this.inputHandler, onFileSelected: this.storeFiles, errorText: this.errors["voided_check"], multiple: true })), h("div", { key: '06d442df900406f122970bde6b2b293f2c9080ee', class: "col-12" }, h("form-control-file", { key: 'b3dc1d48900c5932c4d59f8b31a323193f0e86b4', name: "bank_statement", label: "Bank Statement", documentType: EntityDocumentType.bankStatement, inputHandler: this.inputHandler, onFileSelected: this.storeFiles, errorText: this.errors["bank_statement"], multiple: true }))));
     }
 };
 
@@ -33,7 +32,7 @@ const BankAccountFormInputs = class {
         registerInstance(this, hostRef);
     }
     render() {
-        return (h("div", { key: 'b18e803521d67b40e4e5af03a66dcdca0b678968', class: "row gy-3" }, h("div", { key: 'e2e6667ffbcebb6a9aa50739814e7bbebceaabfa', class: "col-12" }, h("form-control-text", { key: 'e1ad63fb7db32dbb6ed67cf18919c681d6d192ef', name: "bank_name", label: "Bank Name", defaultValue: this.defaultValue.bank_name, errorText: this.errors.bank_name, inputHandler: this.inputHandler, disabled: this.formDisabled })), h("div", { key: '54db821813e7eb931b8f19fad7fce976cdeb0045', class: "col-12" }, h("form-control-text", { key: '4ecf222c1918e364f319d07e0a770d68dba099d0', name: "nickname", label: "Nickname", defaultValue: this.defaultValue.nickname, errorText: this.errors.nickname, inputHandler: this.inputHandler, disabled: this.formDisabled })), h("div", { key: 'a92c38f2abbcb3dcaee4bc5ea73df44b31adc3f9', class: "col-12" }, h("form-control-text", { key: '492ff1a4d1e9c4f2fa9d0e527a34dc5ccb09afe6', name: "account_owner_name", label: "Account Owner Name", defaultValue: this.defaultValue.account_owner_name, errorText: this.errors.account_owner_name, inputHandler: this.inputHandler, disabled: this.formDisabled })), h("div", { key: '8e14e6e3de43822d139085d3a05bfd0e7ae5b1be', class: "col-12" }, h("form-control-select", { key: 'f6648b6f7c4a475f88b849bf3a75d446bb539c69', name: "account_type", label: "Account Type", options: bankAccountTypeOptions, defaultValue: this.defaultValue.account_type, errorText: this.errors.account_type, inputHandler: this.inputHandler, disabled: this.formDisabled })), h("div", { key: '68a2efc082f5b6414ebde10b6da4365677dbefca', class: "col-12" }, h("form-control-text", { key: '3ef9b3db5882063708ccf1eb282f3e90ed53ce82', name: "account_number", label: "Account Number", defaultValue: this.defaultValue.account_number, maxLength: 17, errorText: this.errors.account_number, inputHandler: this.inputHandler, keyDownHandler: numberOnlyHandler, disabled: this.formDisabled, helpText: "Please copy the account number as shown on your statement/check. Do not include spaces or dashes." })), h("div", { key: 'e3270db28269bc25dd4d5a99274f042c1efd1fc6', class: "col-12" }, h("form-control-text", { key: 'a8e801f65a4cc164cdc7bf186fed67f87abc828f', name: "routing_number", label: "Routing Number", defaultValue: this.defaultValue.routing_number, maxLength: 9, errorText: this.errors.routing_number, inputHandler: this.inputHandler, keyDownHandler: numberOnlyHandler, disabled: this.formDisabled, helpText: "A valid routing number is nine digits. Please include any leading or trailing zeroes." }))));
+        return (h("div", { key: 'da4dc9523bca84cdd02f7e5d47e513c426ed90fd', class: "row gy-3" }, h("div", { key: 'b625a293dec704cbbb132469fdbc8c5d99a660e1', class: "col-12" }, h("form-control-text", { key: 'b41460ddc605f73faf71233ccbbef7e34e690e5a', name: "bank_name", label: "Bank Name", defaultValue: this.defaultValue.bank_name, errorText: this.errors.bank_name, inputHandler: this.inputHandler, disabled: this.formDisabled })), h("div", { key: 'e5560bcdba399baa2e54441436ef5c67936e9fef', class: "col-12" }, h("form-control-text", { key: '18cd16931899f724fd92cb89f1b8d4cd41c5354c', name: "nickname", label: "Nickname", defaultValue: this.defaultValue.nickname, errorText: this.errors.nickname, inputHandler: this.inputHandler, disabled: this.formDisabled })), h("div", { key: '3bb589db98e5d65022576b602bda41f36e3a90d5', class: "col-12" }, h("form-control-text", { key: 'c870513b8895add114d5ec588561fa6f33a63514', name: "account_owner_name", label: "Account Owner Name", defaultValue: this.defaultValue.account_owner_name, errorText: this.errors.account_owner_name, inputHandler: this.inputHandler, disabled: this.formDisabled })), h("div", { key: '1783e7b4af2b012338fe2e1b4f1faa9b5e086bcd', class: "col-12" }, h("form-control-select", { key: '6a9af0f6edeae133dce04b7f829abb802db4ac83', name: "account_type", label: "Account Type", options: bankAccountTypeOptions, defaultValue: this.defaultValue.account_type, errorText: this.errors.account_type, inputHandler: this.inputHandler, disabled: this.formDisabled })), h("div", { key: '3c3ffced96f67320b4c580be6f28dd8ef5d2c109', class: "col-12" }, h("form-control-text", { key: 'e85df115a9de08ad9abb3237f7bf6c6d23c84150', name: "account_number", label: "Account Number", defaultValue: this.defaultValue.account_number, maxLength: 17, errorText: this.errors.account_number, inputHandler: this.inputHandler, keyDownHandler: numberOnlyHandler, disabled: this.formDisabled, helpText: "Please copy the account number as shown on your statement/check. Do not include spaces or dashes." })), h("div", { key: '5a25cb25160aff24d1f62df2115dbd248709141e', class: "col-12" }, h("form-control-text", { key: 'dfdf7dce470efb8eea65aa6daf562d190963bace', name: "routing_number", label: "Routing Number", defaultValue: this.defaultValue.routing_number, maxLength: 9, errorText: this.errors.routing_number, inputHandler: this.inputHandler, keyDownHandler: numberOnlyHandler, disabled: this.formDisabled, helpText: "A valid routing number is nine digits. Please include any leading or trailing zeroes." }))));
     }
 };
 
@@ -97,10 +96,10 @@ const FileInput = class {
         return part;
     }
     render() {
-        return (h(Host, { key: 'd2a65bf95224f0c7a4ee68d926e2895df0a3503d' }, h("div", { key: '522a1224df863e600dfa574642cc93716c11280f', class: "form-group d-flex flex-column" }, h("div", { key: 'a7d95e45e7faac780142ae5a0cdf6eb6bf23012b', class: "d-flex align-items-start gap-2" }, h("label", { key: '19d0d2c0282d443b36e6a817c622e2015f1d636e', part: label, class: "form-label", htmlFor: this.name }, this.label), h("form-control-tooltip", { key: '52ecd0a5185ea7cedb5b13de82b3e66eb8252915', helpText: this.helpText })), h("input", { key: '1414537ee264cbbc7e69edb38911401c6de29717', ref: (el) => this.fileInput = el, type: "file", name: this.name, part: this.part, class: this.errorText ? "form-control is-invalid" : "form-control", multiple: this.multiple, disabled: this.disabled, onChange: this.changeHandler, onInput: this.handleFormControlInput, onFocus: () => this.isFocused = true, onBlur: () => {
+        return (h(Host, { key: '7c6694e256d2b10d2789d3325848c782ee59628d' }, h("div", { key: 'b8b9da61559547cb162fc4e9d6226fa963b32392', class: "form-group d-flex flex-column" }, h("div", { key: '928b0a8403151c01c10335407e9763650a334f2d', class: "d-flex align-items-start gap-2" }, h("label", { key: 'be1158705e4cf3efdf94d2ff2959cdbe064b4f7b', part: label, class: "form-label", htmlFor: this.name }, this.label), h("form-control-tooltip", { key: 'ca3ab534358d1dbbbf5635215d9c97e83b91750e', helpText: this.helpText })), h("input", { key: '97c1e48f9d615f3adcebf305bd8368e06ac69ed1', ref: (el) => this.fileInput = el, type: "file", name: this.name, part: this.part, class: this.errorText ? "form-control is-invalid" : "form-control", multiple: this.multiple, disabled: this.disabled, onChange: this.changeHandler, onInput: this.handleFormControlInput, onFocus: () => this.isFocused = true, onBlur: () => {
                 this.isFocused = false;
                 this.formControlBlur.emit();
-            } }), h(FormControlErrorText, { key: 'de236bb9de009da258b2780c6097bf8f7101bd18', errorText: this.errorText, name: this.name }))));
+            } }), h(FormControlErrorText, { key: '6c4aa5ad35ae4590e4a80e95a582157418d3103f', errorText: this.errorText, name: this.name }))));
     }
     get el() { return getElement(this); }
 };

package/dist/{module/bank-account-form2.js → esm/bank-account-form.entry.js}

@@ -1,7 +1,8 @@
-import { h, proxyCustomElement, HTMLElement, Host } from '@stencil/core/internal/client';
-import { S as Skeleton } from './skeleton.js';
-import { w as waitForConfig, c as configState } from './config-state.js';
-import { d as defineCustomElement$1 } from './iframe-input2.js';
+import { h, r as registerInstance, H as Host } from './index-kpoIU4v_.js';
+import { S as Skeleton } from './skeleton-DrHwsgs_.js';
+import { w as waitForConfig, c as configState } from './config-state-BrllxiM0.js';
+import './parts-CfF8KKwx.js';
+import './index-B9me4yN2.js';
 
 const BankAccountFormSkeleton = (props) => {
     const { isReady } = props;
@@ -19,10 +20,9 @@ const BankAccountFormSkeleton = (props) => {
                 h(Skeleton, { height: "36px" })))));
 };
 
-const BankAccountForm = /*@__PURE__*/ proxyCustomElement(class BankAccountForm extends HTMLElement {
-    constructor() {
-        super();
-        this.__registerHost();
+const BankAccountForm = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
         this.isReady = false;
     }
     async componentWillLoad() {
@@ -56,30 +56,6 @@ const BankAccountForm = /*@__PURE__*/ proxyCustomElement(class BankAccountForm e
                 height: this.isReady ? 'auto' : '0',
             } }, h("div", { key: '94dc0eb0d79b40ade96e1961611e3e7a8eef20ea', class: "row mb-3" }, h("iframe-input", { key: '41c82b772e7873a45409e35ed56dfea16c20c2ee', inputId: "accountNumber", ref: (el) => (this.accountNumberIframeElement = el), label: "Account Number", iframeOrigin: `${this.iframeOrigin}/v2/accountNumber` })), h("div", { key: '1c95618a50e2d36a3a9a3a7b691ae0dfa6a09936', class: "row" }, h("iframe-input", { key: '28a4dde70c8f55b4f6bf6ce2d3beee6acbebbc0b', inputId: "routingNumber", ref: (el) => (this.routingNumberIframeElement = el), label: "Routing Number", iframeOrigin: `${this.iframeOrigin}/v2/routingNumber` })))));
     }
-}, [256, "bank-account-form", {
-        "isReady": [32],
-        "iframeOrigin": [32],
-        "validate": [64],
-        "tokenize": [64]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["bank-account-form", "iframe-input"];
-    components.forEach(tagName => { switch (tagName) {
-        case "bank-account-form":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, BankAccountForm);
-            }
-            break;
-        case "iframe-input":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$1();
-            }
-            break;
-    } });
-}
-defineCustomElement();
+};
 
-export { BankAccountForm as B, defineCustomElement as d };
+export { BankAccountForm as bank_account_form };

package/dist/esm/business-details-core.entry.js

@@ -1,9 +1,9 @@
 import { h, F as Fragment, r as registerInstance, c as createEvent } from './index-kpoIU4v_.js';
-import { E as ErrorState } from './utils-DOW3rBEH.js';
+import { E as ErrorState } from './utils-kWaZhFAd.js';
 import { S as StyledHost } from './styled-host-B_XBaM7z.js';
 import './event-types-CZfYo5-1.js';
-import { S as Skeleton } from './skeleton-MHyzfkPM.js';
-import './parts-CVGBVdVC.js';
+import { S as Skeleton } from './skeleton-DrHwsgs_.js';
+import './parts-CfF8KKwx.js';
 
 const BusinessDetailsLoading = () => {
     const Block = () => (h("div", { class: "mt-5" },

package/dist/esm/{business.service-Cx6MiBgY.js → business.service-Bdvhdc_d.js}

@@ -1,11 +1,9 @@
-import { A as Api } from './Api-Bes3KkG6.js';
-import './ComponentError-SdntD1xf.js';
-import './Checkout-DfRTGCdt.js';
+import { A as Api } from './Api-N_veT2p6.js';
+import './ComponentError-Cjcsf8ku.js';
+import './Refund-Di6J0oN2.js';
 import './Pagination-CLHwhyvu.js';
-import './Payment-93PpwzdC.js';
-import './Refund-CISeDJoW.js';
 import './Business-BCoP0TAV.js';
-import './Dispute-7MWRbTXI.js';
+import './Dispute-BH0Xfn-F.js';
 
 const api = Api();
 class BusinessService {

package/dist/esm/{button-B_viNpoz.js → button-CeR8qVS3.js}

@@ -1,5 +1,5 @@
 import { h } from './index-kpoIU4v_.js';
-import { ac as buttonSecondary, ad as buttonPrimary, ae as buttonLoading } from './parts-CVGBVdVC.js';
+import { ad as buttonSecondary, ae as buttonPrimary, af as buttonLoading } from './parts-CfF8KKwx.js';
 
 const ButtonSpinner = () => (h("div", { class: "spinner-border spinner-border-sm", role: "status", part: "button-spinner" },
     h("span", { class: "visually-hidden" }, "Loading...")));

package/dist/esm/card-form.entry.js

@@ -0,0 +1,69 @@
+import { h, r as registerInstance, H as Host } from './index-kpoIU4v_.js';
+import { S as Skeleton } from './skeleton-DrHwsgs_.js';
+import { w as waitForConfig, c as configState } from './config-state-BrllxiM0.js';
+import './parts-CfF8KKwx.js';
+import './index-B9me4yN2.js';
+
+const CardFormSkeleton = (props) => {
+    const { isReady } = props;
+    if (isReady) {
+        return null;
+    }
+    return (h("div", { class: "container-fluid p-0" },
+        h("div", { class: "mb-3" },
+            h(Skeleton, { height: "18px", width: "100px" }),
+            h(Skeleton, { height: "36px" })),
+        h("div", { class: "row" },
+            h("div", { class: "col-4 align-content-end" },
+                h(Skeleton, { height: "18px", width: "80px" }),
+                h(Skeleton, { height: "36px" })),
+            h("div", { class: "col-4 align-content-end" },
+                h(Skeleton, { height: "36px" })),
+            h("div", { class: "col-4 align-content-end" },
+                h(Skeleton, { height: "18px", width: "30px" }),
+                h(Skeleton, { height: "36px" })))));
+};
+
+const CardForm = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.isReady = false;
+    }
+    async componentWillLoad() {
+        await waitForConfig();
+        this.iframeOrigin = configState.iframeOrigin;
+    }
+    componentDidRender() {
+        const elements = [
+            this.cardNumberIframeElement,
+            this.expirationMonthIframeElement,
+            this.expirationYearIframeElement,
+            this.cvvIframeElement,
+        ];
+        Promise.all(elements.map((element) => {
+            return new Promise((resolve) => {
+                element.addEventListener('iframeLoaded', () => { resolve(); });
+            });
+        })).then(() => {
+            this.isReady = true;
+        });
+    }
+    async validate() {
+        const cardNumberIsValid = await this.cardNumberIframeElement.validate();
+        const expirationMonthIsValid = await this.expirationMonthIframeElement.validate();
+        const expirationYearIsValid = await this.expirationYearIframeElement.validate();
+        const cvvIsValid = await this.cvvIframeElement.validate();
+        return cardNumberIsValid && expirationMonthIsValid && expirationYearIsValid && cvvIsValid;
+    }
+    async tokenize(clientId, paymentMethodMetadata, account) {
+        return this.cardNumberIframeElement.tokenize(clientId, paymentMethodMetadata, account);
+    }
+    render() {
+        return (h(Host, { key: 'd5e5c74e5e3be0bb5a9603a89724d23cc6216d6c' }, h(CardFormSkeleton, { key: 'a1e90d74ca6e72678255590a94937932a9520046', isReady: this.isReady }), h("div", { key: 'bb303552ed581492de8ebb0d83cea751ddd90a09', class: "container-fluid p-0", style: {
+                opacity: this.isReady ? '1' : '0',
+                height: this.isReady ? 'auto' : '0',
+            } }, h("div", { key: '9641c97124a504729b1eba3e8704d8fd3fda7fde', class: "mb-3" }, h("iframe-input", { key: 'a5a73c00c2ac0cd12ef98b155a40108248529fb7', inputId: "cardNumber", ref: (el) => (this.cardNumberIframeElement = el), label: "Card Number", iframeOrigin: `${this.iframeOrigin}/v2/cardNumber` })), h("div", { key: 'dad1b83f028745aa8b85a8e552f702d5daa3ac6f', class: "d-flex align-items-start" }, h("div", { key: '5de05029d93a81d5ad8c799135863e8cdd1e8619', class: "flex-fill me-3" }, h("iframe-input", { key: '4ec81652e51187bbaa25600299f8cb89f0c41c5c', inputId: "expirationMonth", ref: (el) => (this.expirationMonthIframeElement = el), label: "Exp. Month", iframeOrigin: `${this.iframeOrigin}/v2/expirationMonth` })), h("div", { key: '0280f01efdbbfa3542036fa4ee7baec130e42688', class: "flex-fill me-3" }, h("iframe-input", { key: 'b13dba61a6bd18529e70987029592b5b7307e74b', inputId: "expirationYear", ref: (el) => (this.expirationYearIframeElement = el), label: "Exp. Year", iframeOrigin: `${this.iframeOrigin}/v2/expirationYear` })), h("div", { key: 'edf1e383a148a2d535c4733a2b5af2d8e31e2f43', class: "flex-fill" }, h("iframe-input", { key: 'd63e832db1a089f36909db23cacb110f6571535c', inputId: "CVV", ref: (el) => (this.cvvIframeElement = el), label: "CVV", iframeOrigin: `${this.iframeOrigin}/v2/CVV` }))))));
+    }
+};
+
+export { CardForm as card_form };

package/dist/esm/{check-pkg-version-DvajBJj9.js → check-pkg-version-Bb69ihTN.js}

@@ -1,12 +1,10 @@
-import { p as packageJson } from './package-DwtqmD1M.js';
-import { A as Api } from './Api-Bes3KkG6.js';
-import './ComponentError-SdntD1xf.js';
-import './Checkout-DfRTGCdt.js';
+import { p as packageJson } from './package-O3LY2Da6.js';
+import { A as Api } from './Api-N_veT2p6.js';
+import './ComponentError-Cjcsf8ku.js';
+import './Refund-Di6J0oN2.js';
 import './Pagination-CLHwhyvu.js';
-import './Payment-93PpwzdC.js';
-import './Refund-CISeDJoW.js';
 import './Business-BCoP0TAV.js';
-import './Dispute-7MWRbTXI.js';
+import './Dispute-BH0Xfn-F.js';
 
 const api = Api();
 class AnalyticsService {

package/dist/esm/{checkout.service-BQ2Z7hHe.js → checkout.service-XgGFa7H8.js}

@@ -1,11 +1,9 @@
-import { A as Api } from './Api-Bes3KkG6.js';
-import './ComponentError-SdntD1xf.js';
-import './Checkout-DfRTGCdt.js';
+import { A as Api } from './Api-N_veT2p6.js';
+import './ComponentError-Cjcsf8ku.js';
+import './Refund-Di6J0oN2.js';
 import './Pagination-CLHwhyvu.js';
-import './Payment-93PpwzdC.js';
-import './Refund-CISeDJoW.js';
 import './Business-BCoP0TAV.js';
-import './Dispute-7MWRbTXI.js';
+import './Dispute-BH0Xfn-F.js';
 
 const api = Api();
 class CheckoutService {

package/dist/esm/checkout.store-B60siz2l.js

@@ -0,0 +1,36 @@
+import { c as createStore } from './index-B9me4yN2.js';
+
+const initialState = {
+    accountId: '',
+    authToken: '',
+    billingFormFields: {
+        address_postal_code: '',
+    },
+    bnplEnabled: false,
+    bnplProviderApiVersion: '',
+    bnplProviderCheckoutUrl: '',
+    bnplProviderClientId: '',
+    bnplProviderMode: '',
+    checkoutId: '',
+    disableBankAccount: false,
+    disableBnpl: false,
+    disableCreditCard: false,
+    disablePaymentMethodGroup: false,
+    paymentAmount: 0,
+    paymentDescription: '',
+    paymentMethodGroupId: undefined,
+    paymentMethods: [],
+    paymentToken: undefined,
+    savePaymentMethod: false,
+    selectedPaymentMethod: '',
+    totalAmount: 0,
+};
+const { state: checkoutStore, onChange } = createStore(initialState);
+Object.keys(initialState).forEach((key) => {
+    // @ts-ignore
+    onChange(key, (newValue) => {
+        checkoutStore[key] = newValue;
+    });
+});
+
+export { checkoutStore as c, onChange as o };