@justifi/webcomponents 5.2.0 → 5.3.1

package/dist/esm/{Api-0cac5b8a.js → Api-97801a4b.js}

@@ -1,5 +1,6 @@
 const config = {
     proxyApiOrigin: "https://wc-proxy.justifi.ai",
+    iFrameOrigin: "https://components.justifi.ai/v2",
     proxyAuthToken: 'eyJraWQiOiJqdXN0aWZpLWUyNDgyMmU3ODE1MmEzZjRkMjU1IiwidHlwIjoiSldUIiwiYWxnIjoiUlMyNTYifQ.eyJpc3MiOiJodHRwczovL2F1dGguanVzdGlmaS5haS8iLCJhenAiOiJvYXNfMmlsWHBqOHQ2WVlEQ0xWU0FiVFczMiIsInN1YiI6Im9hc18yaWxYcGo4dDZZWURDTFZTQWJUVzMyQHNlc3Npb25zIiwiYXVkIjoiaHR0cHM6Ly9hcGkuanVzdGlmaS5haS92MSIsImd0eSI6ImNsaWVudC1jcmVkZW50aWFscyIsInBlcm1pc3Npb25zIjpbeyJyb2xlIjoicmVhZDphY2NvdW50IiwicmVzb3VyY2VfaWQiOiJhY2NfNUV0OWlYclNTQVpSMktTb3VRR0FXaSJ9LHsicm9sZSI6InJlYWQ6YnVzaW5lc3MiLCJyZXNvdXJjZV9pZCI6ImJpel8zYmg2OWJxMXJrM2RtWE5vQUtWb251In1dLCJleHAiOjE3MTE1NTk0MTQsImlhdCI6MTcwMzc4MzQxNCwicGxhdGZvcm1fYWNjb3VudF9pZCI6ImFjY18zcmVOYjRhTll5MmlXRFpRVmN6bXg0In0.oPOoDYxzrnpE8PRUaz-FCU4KqnSuNbFTeDkl3AtMscjUkIctP1OIFh-ZGBjbH5eVH5noXCbaiin0j92dS7jx4gLpxuYT2Q8gpZbuIsT7fa58elvGeRkUUJ-AC5ueZxlv90yPWMm0OIbyrV7XZhuwYyKbV-ZczEbl2JpvBMe40CM-LdClQV66d_-Kw9a23SabBVfYgP5V-5OsagOIESvzZoO-27tGlNkV2a-hxqddDCOZv0HvRYAtp5S7EQrmRdEBu5gCNbf1eRFG424hxZUFVr2LdetYuKQLxJjDdUjf86ZwEUecrEaDSupiN1VC3CitdOwBVf6-R_N0VpN4VLVD5g',
     exampleAccountId: 'acc_5Et9iXrSSAZR2KSouQGAWi',
     exampleBusinessId: 'biz_3bh69bq1rk3dmXNoAKVonu',

package/dist/esm/{Checkout-d476bb83.js → Checkout-8325c97a.js}

@@ -1,4 +1,4 @@
-import { f as formatCurrency } from './utils-b76d791e.js';
+import { f as formatCurrency } from './utils-c37124fc.js';
 
 class Completion {
     constructor(data) {

package/dist/esm/Document-1907c0d4.js

@@ -0,0 +1,55 @@
+var EntityDocumentType;
+(function (EntityDocumentType) {
+    EntityDocumentType["voidedCheck"] = "voided_check";
+    EntityDocumentType["balanceSheet"] = "balance_sheet";
+    EntityDocumentType["bankStatement"] = "bank_statement";
+    EntityDocumentType["governmentId"] = "government_id";
+    EntityDocumentType["profitAndLossStatement"] = "profit_and_loss_statement";
+    EntityDocumentType["taxReturn"] = "tax_return";
+    EntityDocumentType["other"] = "other";
+})(EntityDocumentType || (EntityDocumentType = {}));
+var EntityDocumentStatus;
+(function (EntityDocumentStatus) {
+    EntityDocumentStatus["pending"] = "pending";
+    EntityDocumentStatus["uploaded"] = "uploaded";
+    EntityDocumentStatus["canceled"] = "canceled";
+    EntityDocumentStatus["needed"] = "needed";
+})(EntityDocumentStatus || (EntityDocumentStatus = {}));
+class EntityDocumentStorage {
+    constructor() {
+        this.voided_check = [];
+        this.balance_sheet = [];
+        this.bank_statement = [];
+        this.government_id = [];
+        this.profit_and_loss_statement = [];
+        this.tax_return = [];
+        this.other = [];
+    }
+}
+class EntityDocument {
+    constructor(fileData, business_id) {
+        this.file = fileData.file;
+        this.fileString = this.getFileString();
+        this.document_type = fileData.document_type;
+        this.presigned_url = null;
+        this.record_data = {
+            business_id: business_id,
+            document_type: this.document_type,
+            file_name: this.file.name,
+            file_type: this.file.type,
+        };
+    }
+    getFileString() {
+        let reader = new FileReader();
+        reader.onload = (e) => {
+            this.fileString = e.target.result;
+        };
+        reader.readAsDataURL(this.file);
+        return this.fileString;
+    }
+    setPresignedUrl(url) {
+        this.presigned_url = url;
+    }
+}
+
+export { EntityDocumentType as E, EntityDocument as a, EntityDocumentStorage as b };

package/dist/esm/{Payment-47630113.js → Payment-82d2f453.js}

@@ -1,4 +1,4 @@
-import { f as formatCurrency } from './utils-b76d791e.js';
+import { f as formatCurrency } from './utils-c37124fc.js';
 import { D as DisputeStatus } from './Dispute-5fd28ec9.js';
 
 var CaptureStrategy;

package/dist/esm/{SubAccount-f31349a9.js → SubAccount-a73bf971.js}

@@ -1,4 +1,4 @@
-import { f as formatCurrency } from './utils-b76d791e.js';
+import { f as formatCurrency } from './utils-c37124fc.js';
 
 var PayoutStatuses;
 (function (PayoutStatuses) {

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

@@ -1,7 +1,7 @@
 import { r as registerInstance, h, H as Host } from './index-29fcfdf5.js';
-import { c as DetailItem, D as DetailSectionTitle } from './utils-7fb6331d.js';
-import { i as isEmptyObject, s as snakeCaseToHumanReadable, h as formatMediumDate } from './utils-b76d791e.js';
-import './parts-93f379ab.js';
+import { c as DetailItem, D as DetailSectionTitle } from './utils-c2dc83b2.js';
+import { i as isEmptyObject, s as snakeCaseToHumanReadable, h as formatMediumDate } from './utils-c37124fc.js';
+import './parts-ab2bb4b5.js';
 
 const AdditionalQuestionsDetails = class {
     constructor(hostRef) {

package/dist/esm/{badge-b034e71b.js → badge-938ba4b1.js}

@@ -1,5 +1,5 @@
 import { h } from './index-29fcfdf5.js';
-import { n as badge, o as badgePrimary, p as badgeSecondary, q as badgeSuccess, r as badgeDanger, u as badgeWarning, v as badgeInfo, w as badgeLight, x as badgeDark } from './parts-93f379ab.js';
+import { n as badge, o as badgePrimary, p as badgeSecondary, q as badgeSuccess, r as badgeDanger, u as badgeWarning, v as badgeInfo, w as badgeLight, x as badgeDark } from './parts-ab2bb4b5.js';
 
 var BadgeVariant;
 (function (BadgeVariant) {

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

@@ -0,0 +1,123 @@
+import { r as registerInstance, h, H as Host, c as createEvent, g as getElement } from './index-29fcfdf5.js';
+import './ComponentError-3ce7f437.js';
+import './Checkout-8325c97a.js';
+import './Pagination-afc8f96d.js';
+import './Payment-82d2f453.js';
+import './SubAccount-a73bf971.js';
+import { E as EntityDocumentType } from './Document-1907c0d4.js';
+import { c as bankAccountTypeOptions } from './business-form-options-018f62a5.js';
+import './event-types-5c87de02.js';
+import { n as numberOnlyHandler } from './utils-20cdf321.js';
+import { s as snakeCaseToHumanReadable, b as formatDate, k as formatTimeSeconds } from './utils-c37124fc.js';
+import { R as card, h as heading2, E as table, k as tableHeadCell, F as tableCell, l as label, c as input, b as inputInvalid, S as inputDisabled, a as inputFocused } from './parts-ab2bb4b5.js';
+import { S as Skeleton } from './skeleton-ee7c3b32.js';
+import { F as FormControlErrorText } from './form-control-error-text-b3d14e92.js';
+import './Dispute-5fd28ec9.js';
+import './Business-29c69f22.js';
+import './helpers-96ea3464.js';
+import './state-options-a356fb11.js';
+
+const BankAccountDocumentFormInputs = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.inputHandler = undefined;
+        this.errors = undefined;
+        this.storeFiles = undefined;
+    }
+    render() {
+        return (h("div", { key: '9e04de8ad0e4a1d83f6d8fd1e5a2a5e92c670b92', class: "row gy-3" }, h("div", { key: 'af8875e58677a94873d548c35e9d2859725058e5', class: "col-12" }, h("form-control-file", { key: '030c461b2c2a3da9acf5fcf761f537ea9f6cfcc9', 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: '0b6650097a7c6810d9ab9dc76484b49dfe0c7e11', class: "col-12" }, h("form-control-file", { key: 'cd030043373cc6759022b9c23c674830ceffaff3', name: "bank_statement", label: "Bank Statement", documentType: EntityDocumentType.bankStatement, inputHandler: this.inputHandler, onFileSelected: this.storeFiles, errorText: this.errors["bank_statement"], multiple: true }))));
+    }
+};
+
+const BankAccountFormInputs = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.defaultValue = undefined;
+        this.errors = undefined;
+        this.inputHandler = undefined;
+        this.formDisabled = undefined;
+    }
+    render() {
+        return (h("div", { key: 'c4420b1e4396ac065b3674f52b124c0d25359435', class: "row gy-3" }, h("div", { key: '40e5f2d54a6f60558ec5aa50ff47e6adcf66276b', class: "col-12" }, h("form-control-text", { key: '9052ecb4597ecc96841d65929f1d8e5dbf662343', 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: 'c32bbaf4fe2155f49cb35ee4500016e7f97f24b3', class: "col-12" }, h("form-control-text", { key: '3527553824fb36ea616836bf8e9435fc33a2365a', name: "nickname", label: "Nickname", defaultValue: this.defaultValue.nickname, errorText: this.errors.nickname, inputHandler: this.inputHandler, disabled: this.formDisabled })), h("div", { key: 'c203663fad98052567b34cbffe316606c963ff23', class: "col-12" }, h("form-control-text", { key: 'db95259c41fa10b6af2cbc4c9bd7340d609312ee', 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: '3228e30c418210556e4e9f99f4f87f753876072d', class: "col-12" }, h("form-control-select", { key: '6dde33c0e9a2ac76051e01af836ea372f30d8fbb', 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: '266005f1bba23068fc0be35416f5fd8cf3fc7c7c', class: "col-12" }, h("form-control-text", { key: '34caa85c53b457de98a524a2eb151899e5bcf21a', 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: '69d2e72cf588518e4fe310c2ad5cb37c72fab8c6', class: "col-12" }, h("form-control-text", { key: 'bc4353e36c9d982aa55f5e933975c4020c316ad0', 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." }))));
+    }
+};
+
+const BusinessDocumentsOnFile = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.documents = [];
+        this.isLoading = false;
+    }
+    render() {
+        if (this.isLoading) {
+            return h(Skeleton, { height: "50px" });
+        }
+        if (!this.documents.length) {
+            return null;
+        }
+        return (h(Host, null, h("div", { class: "card", part: card }, h("div", { class: "card-body" }, h("h5", { class: "card-title", part: heading2 }, "Documents Already on File"), h("div", { class: "table-responsive" }, h("table", { class: "table table-sm table-borderless", part: table }, h("thead", null, h("tr", null, h("th", { style: { width: "25%" }, part: tableHeadCell, scope: "col" }, "File Name"), h("th", { style: { width: "25%" }, part: tableHeadCell, scope: "col" }, "File Type"), h("th", { style: { width: "25%" }, part: tableHeadCell, scope: "col" }, "Document Type"), h("th", { style: { width: "25%" }, part: tableHeadCell, scope: "col" }, "Date Uploaded"))), h("tbody", null, this.documents.sort((a, b) => a.document_type.localeCompare(b.document_type))
+            .map((document, index) => {
+            return (h("tr", { class: index === 0 ? "border-bottom border-top" : "border-bottom" }, h("td", { part: tableCell }, document.file_name), h("td", { part: tableCell }, document.file_type), h("td", { part: tableCell }, snakeCaseToHumanReadable(document.document_type)), h("td", { part: tableCell }, `${formatDate(document.created_at)} - ${formatTimeSeconds(document.created_at)}`)));
+        })))))), h("hr", null)));
+    }
+};
+
+const FileInput = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.formControlInput = createEvent(this, "formControlInput", 7);
+        this.formControlBlur = createEvent(this, "formControlBlur", 7);
+        this.fileSelected = createEvent(this, "fileSelected", 7);
+        this.handleFormControlInput = (event) => {
+            const target = event.target;
+            const name = target.getAttribute('name');
+            this.inputHandler(name, target.value);
+            this.formControlInput.emit({ name, value: target.value });
+        };
+        this.changeHandler = () => {
+            const inputFileList = this.fileInput.files;
+            if (inputFileList) {
+                this.fileSelected.emit({
+                    fileList: inputFileList,
+                    document_type: this.documentType
+                });
+            }
+        };
+        this.files = undefined;
+        this.fileString = undefined;
+        this.isFocused = false;
+        this.label = undefined;
+        this.name = undefined;
+        this.helpText = undefined;
+        this.errorText = undefined;
+        this.multiple = undefined;
+        this.documentType = undefined;
+        this.inputHandler = undefined;
+        this.disabled = undefined;
+    }
+    componentDidLoad() {
+        this.fileInput = this.el.querySelector('input');
+    }
+    get part() {
+        let part = input;
+        if (this.errorText) {
+            part = inputInvalid;
+        }
+        if (this.disabled) {
+            part = inputDisabled;
+        }
+        if (this.isFocused) {
+            part = inputFocused;
+        }
+        return part;
+    }
+    render() {
+        return (h(Host, { key: '4950c97a276963d0b666313b5eb2047cd05ffe0f' }, h("div", { key: 'f09de9c091824da6e385e9129c007ea3ddefea7a', class: "form-group d-flex flex-column" }, h("div", { key: 'c853c5997df0a9a3b0789712abcbf25c1bc50884', class: "d-flex align-items-start gap-2" }, h("label", { key: 'e5c17b93898fdf7e2244f3a5549fdd3ddcc2bab8', part: label, class: "form-label", htmlFor: this.name }, this.label), h("form-control-tooltip", { key: '131ac4f66a6bae82f53473f36448780090f28a71', helpText: this.helpText })), h("input", { key: 'cf8374ebefcbe18b73d853c96b703652869ea0af', 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: 'd5ac4a7e8b5f70fd0cb63e9358bb372a3167ab5e', errorText: this.errorText, name: this.name }))));
+    }
+    get el() { return getElement(this); }
+};
+
+export { BankAccountDocumentFormInputs as bank_account_document_form_inputs, BankAccountFormInputs as bank_account_form_inputs, BusinessDocumentsOnFile as business_documents_on_file, FileInput as form_control_file };

package/dist/esm/bank-account-form_9.entry.js

@@ -1,15 +1,16 @@
 import { r as registerInstance, h, H as Host, c as createEvent } from './index-29fcfdf5.js';
 import { i as iframeInputStylesSet } from './iframe-input-styles-state-ff730fe5.js';
-import { i as inputInvalidAndFocused, b as inputInvalid, a as inputFocused, c as input, H as billingForm, I as radioListItem } from './parts-93f379ab.js';
-import { H as Header3 } from './header-3-4a327395.js';
-import { a as PaymentMethodTypes } from './Payment-47630113.js';
-import { j as snakeToCamel, f as formatCurrency } from './utils-b76d791e.js';
+import { i as inputInvalidAndFocused, b as inputInvalid, a as inputFocused, c as input, N as billingForm, O as radioListItem } from './parts-ab2bb4b5.js';
+import { H as Header3 } from './header-3-fd150ccf.js';
+import { a as PaymentMethodTypes } from './Payment-82d2f453.js';
+import { j as snakeToCamel, f as formatCurrency } from './utils-c37124fc.js';
 import './index-a47fdc7f.js';
 import './Dispute-5fd28ec9.js';
 
 const BankAccountForm = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
+        this.iframeOrigin = undefined;
     }
     async validate() {
         const accountNumberIsValid = await this.accountNumberIframeElement.validate();
@@ -20,13 +21,14 @@ const BankAccountForm = class {
         return this.accountNumberIframeElement.tokenize(clientId, paymentMethodMetadata, account);
     }
     render() {
-        return (h(Host, { key: '1fb5075ddb4ee824fa3fbb12079ae0b978ef4e45' }, h("div", { key: '5384dda318b8e809cbee84f5e7796b68f19b780c', class: "container-fluid p-0" }, h("div", { key: '8e9a05728736960ac0e7f0d33a7e46d37b6a04fa', class: "row mb-3" }, h("iframe-input", { key: '46f8a193ed56ea621aac1399e8d7b22a286fd857', inputId: "accountNumber", ref: (el) => (this.accountNumberIframeElement = el), label: "Account Number", iframeOrigin: `${"https://components.justifi.ai/v2"}/accountNumber` })), h("div", { key: '18db1dd7882e9c3d395f4c72833d96a8f7e1176d', class: "row" }, h("iframe-input", { key: 'ea1545703839166cb3352b789bac329f0d0b2918', inputId: "routingNumber", ref: (el) => (this.routingNumberIframeElement = el), label: "Routing Number", iframeOrigin: `${"https://components.justifi.ai/v2"}/routingNumber` })))));
+        return (h(Host, { key: 'bf5ff6bf71b52c5b7eceb429f057b3ec89c56129' }, h("div", { key: 'db0ea83fa412a1ea77aee8967ea1c9ad07ea387d', class: "container-fluid p-0" }, h("div", { key: 'd354c507e7aeabe77a957165aec900f3e01f27f5', class: "row mb-3" }, h("iframe-input", { key: '1397eb492d2cf5ca40b637360ab52478f9007db1', inputId: "accountNumber", ref: (el) => (this.accountNumberIframeElement = el), label: "Account Number", iframeOrigin: `${this.iframeOrigin}/accountNumber` })), h("div", { key: 'a4b98ff832990cac46f49a9ff1ef2de2b33496cd', class: "row" }, h("iframe-input", { key: '0b758f804e3d367c1851fe084d27df1ea620e190', inputId: "routingNumber", ref: (el) => (this.routingNumberIframeElement = el), label: "Routing Number", iframeOrigin: `${this.iframeOrigin}/routingNumber` })))));
     }
 };
 
 const CardForm = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
+        this.iframeOrigin = undefined;
     }
     async validate() {
         const cardNumberIsValid = await this.cardNumberIframeElement.validate();
@@ -39,7 +41,7 @@ const CardForm = class {
         return this.cardNumberIframeElement.tokenize(clientId, paymentMethodMetadata, account);
     }
     render() {
-        return (h(Host, { key: 'cc49f963960cc00ea499484ce257d0b902837c1e', class: "container-fluid p-0" }, h("div", { key: '873ee92597101d80c5c05f50a1428402061ed27f', class: "mb-3" }, h("iframe-input", { key: '4987b5fd997954e30450b5f0b5089c91523afe4f', inputId: "cardNumber", ref: (el) => (this.cardNumberIframeElement = el), label: "Card Number", iframeOrigin: `${"https://components.justifi.ai/v2"}/cardNumber` })), h("div", { key: '7a50424f955163f9c213d81057338c915e046a41', class: "row" }, h("div", { key: 'ab117b543d5ba1b1ca5db6030480048fc266250b', class: "col-4 align-content-end" }, h("iframe-input", { key: 'e5b0f96d4be64fd07ac2417b23d8a3913d67145a', inputId: "expirationMonth", ref: (el) => (this.expirationMonthIframeElement = el), label: "Expiration", iframeOrigin: `${"https://components.justifi.ai/v2"}/expirationMonth` })), h("div", { key: 'c66377e9ae6b0f1a750933ca628edcb62b227e34', class: "col-4 align-content-end" }, h("iframe-input", { key: '2fb5328b3b8b82d0bd2b0ad2272cd73b133cb548', inputId: "expirationYear", ref: (el) => (this.expirationYearIframeElement = el), label: "", iframeOrigin: `${"https://components.justifi.ai/v2"}/expirationYear` })), h("div", { key: 'add1b6be0df27a95b5c244a7bb2320f6f40ec930', class: "col-4 align-content-end" }, h("iframe-input", { key: '3c0341c1111b1980d9868d314221857e7ff07996', inputId: "CVV", ref: (el) => (this.cvvIframeElement = el), label: "CVV", iframeOrigin: `${"https://components.justifi.ai/v2"}/CVV` })))));
+        return (h(Host, { key: '5dfd2c79d7691744614af89d0919e58db17434b3', class: "container-fluid p-0" }, h("div", { key: '307e9a7acd80285a59369e813bb0172627395cf6', class: "mb-3" }, h("iframe-input", { key: 'e151a15fb885d7babf13c575a5bf93990f77336b', inputId: "cardNumber", ref: (el) => (this.cardNumberIframeElement = el), label: "Card Number", iframeOrigin: `${this.iframeOrigin}/cardNumber` })), h("div", { key: 'd965e93602367c92f53cdc768b9a79032e640a5a', class: "row" }, h("div", { key: 'f836cca70a22e9bec446fdc4d62836a7cc16d70c', class: "col-4 align-content-end" }, h("iframe-input", { key: 'd95608d7ce0434021d416120ada984047804b04f', inputId: "expirationMonth", ref: (el) => (this.expirationMonthIframeElement = el), label: "Expiration", iframeOrigin: `${this.iframeOrigin}/expirationMonth` })), h("div", { key: '34ab01991bac786ada446758b4499c3d58cc9402', class: "col-4 align-content-end" }, h("iframe-input", { key: 'c548d2ba46dd5ab969ab703adecc1d697ad5f8e0', inputId: "expirationYear", ref: (el) => (this.expirationYearIframeElement = el), label: "", iframeOrigin: `${this.iframeOrigin}/expirationYear` })), h("div", { key: '4ce98e07ef97c4e13fe92e8677073f6681c2f707', class: "col-4 align-content-end" }, h("iframe-input", { key: '691c95278d984586ed884ca06d96a57ce0a002b8', inputId: "CVV", ref: (el) => (this.cvvIframeElement = el), label: "CVV", iframeOrigin: `${this.iframeOrigin}/CVV` })))));
     }
 };
 
@@ -116,7 +118,7 @@ const HiddenInput = class {
         return input;
     }
     render() {
-        return (h(Host, { key: 'ae03d3be50b34d6c98c8e1bd619f1d97049099a7' }, h("input", { key: '347725ba26e6aab3c0da4f9e3da5b2e4ec9f0e37', ref: el => this.hiddenInput = el, type: "text", class: this.errorText ? "form-control is-invalid" : "form-control", onFocus: () => this.isFocused = true, onBlur: () => this.isFocused = false, part: this.part, tabindex: "-1", style: { height: '0', opacity: '0', pointerEvents: 'none', animation: 'none' } })));
+        return (h(Host, { key: '21c26d386f4e23af0e0ef069ad0263e252c8c15b' }, h("input", { key: '70bb1f6c7c5e94a96fddfe82d1831df12771f0af', ref: el => this.hiddenInput = el, type: "text", class: this.errorText ? "form-control is-invalid" : "form-control", onFocus: () => this.isFocused = true, onBlur: () => this.isFocused = false, part: this.part, tabindex: "-1", style: { height: '0', opacity: '0', pointerEvents: 'none', animation: 'none' } })));
     }
 };
 
@@ -185,6 +187,7 @@ const NewPaymentMethod = class {
         this.paymentMethodGroupId = undefined;
         this.isSelected = undefined;
         this.hideCardBillingForm = undefined;
+        this.iframeOrigin = undefined;
         this.saveNewPaymentMethodChecked = false;
     }
     handleCheckboxChanged(event) {
@@ -244,11 +247,11 @@ const NewPaymentMethod = class {
     showNewPaymentMethodForm() {
         var _a;
         const paymentMethodType = (_a = this.paymentMethodOption) === null || _a === void 0 ? void 0 : _a.id;
-        return (h("div", { class: "mt-4 pb-4 border-bottom" }, h("hidden-input", null), h("div", { class: "mb-4" }, paymentMethodType === 'card' ? (h("card-form", { ref: (el) => this.paymentMethodFormRef = el })) : (h("bank-account-form", { ref: (el) => this.paymentMethodFormRef = el }))), h("justifi-billing-form-wrapper", { ref: (el) => (this.billingFormWrapperRef = el), hideCardBillingForm: this.hideCardBillingForm, paymentMethodType: paymentMethodType }), h("justifi-save-new-payment-method", { hidden: !this.paymentMethodGroupId })));
+        return (h("div", { class: "mt-4 pb-4" }, h("hidden-input", null), h("div", { class: "mb-4" }, paymentMethodType === 'card' ? (h("card-form", { ref: (el) => this.paymentMethodFormRef = el, iframeOrigin: this.iframeOrigin })) : (h("bank-account-form", { ref: (el) => this.paymentMethodFormRef = el, iframeOrigin: this.iframeOrigin }))), h("justifi-billing-form-wrapper", { ref: (el) => (this.billingFormWrapperRef = el), hideCardBillingForm: this.hideCardBillingForm, paymentMethodType: paymentMethodType }), h("justifi-save-new-payment-method", { hidden: !this.paymentMethodGroupId })));
     }
     render() {
         var _a, _b;
-        return (h(Host, { key: 'c0d2a7efd367d357a4c205960f8765e488f7e376', class: "payment-method" }, h("div", { key: '697f5d543ed4690b11f6d8e36bb88eabbc8cc368', class: "radio-list-item p-3", part: radioListItem, onClick: this.onPaymentMethodOptionClick }, h("form-control-radio", { key: '43bf63f112ef40cca0332b77bf447c5f8b5e0379', name: "paymentMethodType", value: (_a = this.paymentMethodOption) === null || _a === void 0 ? void 0 : _a.id, checked: this.isSelected, label: PaymentMethodTypeLabels[(_b = this.paymentMethodOption) === null || _b === void 0 ? void 0 : _b.id] })), this.isSelected ? this.showNewPaymentMethodForm() : null));
+        return (h(Host, { key: '17b922ca3b03d458a0e139be895db31b33c255ed', class: "payment-method" }, h("div", { key: '5d1bb3a05e7fc0516d29ade315f13c2f64d3afaf', class: "radio-list-item p-3", part: radioListItem, onClick: this.onPaymentMethodOptionClick }, h("form-control-radio", { key: '165fd1b54a6d387be307f05ab67078e0d703f0b1', name: "paymentMethodType", value: (_a = this.paymentMethodOption) === null || _a === void 0 ? void 0 : _a.id, checked: this.isSelected, label: PaymentMethodTypeLabels[(_b = this.paymentMethodOption) === null || _b === void 0 ? void 0 : _b.id] })), this.isSelected ? this.showNewPaymentMethodForm() : null));
     }
 };
 
@@ -287,6 +290,7 @@ const PaymentMethodOptions = class {
         this.savedPaymentMethods = [];
         this.paymentAmount = undefined;
         this.hideCardBillingForm = undefined;
+        this.iframeOrigin = undefined;
         this.selectedPaymentMethodId = undefined;
         this.paymentMethodOptions = [];
     }
@@ -330,13 +334,13 @@ const PaymentMethodOptions = class {
     }
     render() {
         var _a;
-        return (h(Host, { key: '22ab195ec840e971c774ad2886ebce979c13394d' }, (_a = this.paymentMethodOptions) === null || _a === void 0 ? void 0 : _a.map((paymentMethodOption) => {
+        return (h(Host, { key: '24e7d418958eb61f9582317e615502e77b4090d0' }, (_a = this.paymentMethodOptions) === null || _a === void 0 ? void 0 : _a.map((paymentMethodOption) => {
             const newCard = paymentMethodOption.id === PaymentMethodTypes.card;
             const newBankAccount = paymentMethodOption.id === PaymentMethodTypes.bankAccount;
             const isSelected = this.selectedPaymentMethodId === paymentMethodOption.id;
             const sezzle = paymentMethodOption.id === PaymentMethodTypes.sezzle;
             if (newCard || newBankAccount) {
-                return (h("justifi-new-payment-method", { paymentMethodOption: paymentMethodOption, authToken: this.authToken, "account-id": this.accountId, "is-selected": isSelected, paymentMethodGroupId: this.paymentMethodGroupId, hideCardBillingForm: this.hideCardBillingForm, ref: (el) => {
+                return (h("justifi-new-payment-method", { paymentMethodOption: paymentMethodOption, authToken: this.authToken, "account-id": this.accountId, "is-selected": isSelected, paymentMethodGroupId: this.paymentMethodGroupId, hideCardBillingForm: this.hideCardBillingForm, iframeOrigin: this.iframeOrigin, ref: (el) => {
                         if (isSelected) {
                             this.selectedPaymentMethodOptionRef = el;
                         }
@@ -374,7 +378,7 @@ const SaveNewPaymentMethod = class {
         this.checkboxChanged.emit(this.isChecked);
     }
     render() {
-        return (h("div", { key: '017cbce906d331b82eb5dc726197da3ea3ba51e5', class: "mt-4 form-check" }, h("form-control-checkbox", { key: 'ca22562653b216d16bd19765f1834ff2428820cc', label: "Save new payment method", name: "saveNewPaymentMethod", checked: this.isChecked, inputHandler: this.handleCheckboxChange.bind(this) })));
+        return (h("div", { key: '86520e5820d9e6ef19946566b31912c5b1050bf6', class: "mt-4 form-check" }, h("form-control-checkbox", { key: 'cc87b708b88aaf4b1f1a93f6b6ebfdd030f87bc0', label: "Save new payment method", name: "saveNewPaymentMethod", checked: this.isChecked, inputHandler: this.handleCheckboxChange.bind(this) })));
     }
 };
 
@@ -399,7 +403,7 @@ const SavedPaymentMethod = class {
     ;
     render() {
         var _a, _b, _c;
-        return (h(Host, { key: '10b18a7c77250aac57d6afef89aea752e3bc2c35', class: "payment-method" }, h("div", { key: '80910960904f3e01fd10cba4789af4004b434490', class: "radio-list-item p-3", part: radioListItem, onClick: this.onPaymentMethodOptionClick }, h("form-control-radio", { key: 'abccf6aca9316de983ba899eabfffcc7b05b1d48', name: "paymentMethodType", value: (_a = this.paymentMethodOption) === null || _a === void 0 ? void 0 : _a.id, checked: this.isSelected, label: `${CardBrandLabels[(_b = this.paymentMethodOption) === null || _b === void 0 ? void 0 : _b.brand] || ''} *${(_c = this.paymentMethodOption) === null || _c === void 0 ? void 0 : _c.acct_last_four}` }))));
+        return (h(Host, { key: '34d26fc514053e2fe028a4a3ba0cbdeb8aa835f1', class: "payment-method" }, h("div", { key: 'da373a524b97bb91a0bc0849f0670c440f5cf5a8', class: "radio-list-item p-3", part: radioListItem, onClick: this.onPaymentMethodOptionClick }, h("form-control-radio", { key: '824ebc566a018e342dd7f128c69fca873bbded45', name: "paymentMethodType", value: (_a = this.paymentMethodOption) === null || _a === void 0 ? void 0 : _a.id, checked: this.isSelected, label: `${CardBrandLabels[(_b = this.paymentMethodOption) === null || _b === void 0 ? void 0 : _b.brand] || ''} *${(_c = this.paymentMethodOption) === null || _c === void 0 ? void 0 : _c.acct_last_four}` }))));
     }
 };
 
@@ -469,7 +473,7 @@ const SezzlePaymentMethod = class {
     }
     render() {
         var _a, _b, _c;
-        return (h(Host, { key: 'eaf1bd457f91f77bffa661875277c0709d5926d3', class: "payment-method" }, h("script", { key: '897bccdb0090b3e3b45b9913f7bdea6b838f63cb', src: "https://checkout-sdk.sezzle.com/checkout.min.js", async: true, ref: (el) => (this.scriptRef = el) }), h("div", { key: 'db32690b54bdb5045d701c888cd67c7d97d66243', class: "radio-list-item p-3", part: radioListItem, onClick: this.onPaymentMethodOptionClick }, h("form-control-radio", { key: 'c3746a50bc7a5b8f079ed76c204790555983def1', name: "paymentMethodType", value: (_a = this.paymentMethodOption) === null || _a === void 0 ? void 0 : _a.id, checked: this.isSelected, label: h("div", null, h("div", null, "Buy now, pay later with ", sezzleLogo), this.installmentPlan && (h("small", null, h("span", null, (_b = this.installmentPlan) === null || _b === void 0 ? void 0 : _b.installments.length), "\u00A0", h("span", null, this.installmentPlan.schedule, " payments of"), "\u00A0", h("span", { class: "fw-bold" }, formatCurrency((_c = this.installmentPlan) === null || _c === void 0 ? void 0 : _c.installments[0].amountInCents))))) }))));
+        return (h(Host, { key: '696051d9a48f0127013dcc84a25053f85ad92145', class: "payment-method" }, h("script", { key: '0dec4821a85dbef872494885c32c26719423b761', src: "https://checkout-sdk.sezzle.com/checkout.min.js", async: true, ref: (el) => (this.scriptRef = el) }), h("div", { key: 'fb9812691532a49f5c8093a989f6277d4755e531', class: "radio-list-item p-3", part: radioListItem, onClick: this.onPaymentMethodOptionClick }, h("form-control-radio", { key: '3ae4c03b30a32b860231789d2f541fbfbea37bef', name: "paymentMethodType", value: (_a = this.paymentMethodOption) === null || _a === void 0 ? void 0 : _a.id, checked: this.isSelected, label: h("div", null, h("div", null, "Buy now, pay later with ", sezzleLogo), this.installmentPlan && (h("small", null, h("span", null, (_b = this.installmentPlan) === null || _b === void 0 ? void 0 : _b.installments.length), "\u00A0", h("span", null, this.installmentPlan.schedule, " payments of"), "\u00A0", h("span", { class: "fw-bold" }, formatCurrency((_c = this.installmentPlan) === null || _c === void 0 ? void 0 : _c.installments[0].amountInCents))))) }))));
     }
 };
 

package/dist/esm/billing-form_3.entry.js

@@ -1,15 +1,16 @@
 import { r as registerInstance, h, H as Host, g as getElement } from './index-29fcfdf5.js';
 import { c as create$3, F as FormController } from './index.esm-0b6849c2.js';
-import { u as identityNameValidation, l as lineOneValidation, k as lineTwoValidation, m as cityValidation, n as stateValidation, q as postalValidation } from './schema-validations-5b0ac96b.js';
+import { u as identityNameValidation, l as lineOneValidation, k as lineTwoValidation, m as cityValidation, n as stateValidation, q as postalValidation } from './schema-validations-ccea6a06.js';
 import { S as StateOptions } from './state-options-a356fb11.js';
 import { n as numberOnlyHandler } from './utils-20cdf321.js';
-import { F as FormControlErrorText } from './form-control-error-text-066cdad4.js';
-import { p as packageJson } from './package-5eedfd72.js';
+import { F as FormControlErrorText } from './form-control-error-text-b3d14e92.js';
+import { p as packageJson } from './package-2b7c7bc0.js';
 import { a as iframeInputStyles } from './iframe-input-styles-state-ff730fe5.js';
-import { i as inputInvalidAndFocused, b as inputInvalid, a as inputFocused, c as input, l as label } from './parts-93f379ab.js';
+import { i as inputInvalidAndFocused, b as inputInvalid, a as inputFocused, c as input, l as label } from './parts-ab2bb4b5.js';
 import './business-form-options-018f62a5.js';
 import './Business-29c69f22.js';
 import './helpers-96ea3464.js';
+import './Document-1907c0d4.js';
 import './index-a47fdc7f.js';
 
 const BillingFormSchema = create$3({
@@ -1669,10 +1670,10 @@ const IframeInput = class {
         return params;
     }
     render() {
-        return (h(Host, { key: '0f84e1044b6bddb480dbb4b4fd2ba6f18d75a2a0', class: "form-group d-flex flex-column" }, h("div", { key: '25e6e196ccf3973b9a382f09efe5997bfb4abd1b', style: {
+        return (h(Host, { key: '00956724f4d6e72b09c2c469613a6362a3c7cdec', class: "form-group d-flex flex-column" }, h("div", { key: 'e6605bd5ef7356c21701b0856a133758720a36d6', style: {
                 visibility: this.iframeLoaded ? 'visible' : 'hidden',
                 height: this.iframeLoaded ? 'auto' : '0',
-            } }, h("label", { key: 'eeddbc0a03692c053898b761fca84635cb3c9323', class: "form-label", htmlFor: "", part: label }, this.label || ''), h("div", { key: 'ce10d714ca67511b059adc4fb942ed42885f0a1a', class: `p-0 d-flex form-control ${this.isValid ? '' : 'is-invalid'}`, part: this.part, style: Object.assign(Object.assign({}, this.style), { overflow: 'hidden' }) }, h("iframe", { key: '85bedd02d3013ad4973d3ecfa0a7c530fddf5a7a', id: this.inputId, name: this.inputId, src: `${this.iframeOrigin}?${this.urlParams}`, ref: el => {
+            } }, h("label", { key: 'f52a782a9f1bbca4a8a6e36da1948611ab834e54', class: "form-label", htmlFor: "", part: label }, this.label || ''), h("div", { key: 'b88199f3de1b52a0aed4d61c0448c293964a7279', class: `p-0 d-flex form-control ${this.isValid ? '' : 'is-invalid'}`, part: this.part, style: Object.assign(Object.assign({}, this.style), { overflow: 'hidden' }) }, h("iframe", { key: '218aa6d48b12c1fc78f04a1556f0a32738c20df4', id: this.inputId, name: this.inputId, src: `${this.iframeOrigin}?${this.urlParams}`, ref: el => {
                 this.iframeElement = el;
                 this.initializeFrameCommunicationService();
             }, width: "100%", onLoad: () => {
@@ -1682,7 +1683,7 @@ const IframeInput = class {
                         this.iframeLoaded = true;
                     }
                 }, this.iframeElement);
-            } })), h(FormControlErrorText, { key: '6533642027fa5184e120452f19e5274476210301', errorText: this.errorText, name: this.inputId }))));
+            } })), h(FormControlErrorText, { key: 'f6e57608fc771ca78e39618455dfe57cd40a655a', errorText: this.errorText, name: this.inputId }))));
     }
     get el() { return getElement(this); }
 };

package/dist/esm/{business-additional-questions-schema-aba9747e.js → business-additional-questions-schema-212a96ed.js}

@@ -1,5 +1,5 @@
 import { c as create$3 } from './index.esm-0b6849c2.js';
-import { b as businessNameValidation, w as websiteUrlValidation, e as emailValidation, p as phoneValidation, d as doingBusinessAsValidation, a as businessClassificationValidation, i as industryValidation, t as taxIdValidation, c as dateOfIncorporationValidation, r as revenueValidation, f as paymentVolumeValidation, g as whenServiceReceivedValidation, h as recurringPaymentsValidation, j as recurringPaymentsPercentageValidation, s as seasonalBusinessValidation, o as otherPaymentDetailsValidation } from './schema-validations-5b0ac96b.js';
+import { b as businessNameValidation, w as websiteUrlValidation, e as emailValidation, p as phoneValidation, d as doingBusinessAsValidation, a as businessClassificationValidation, i as industryValidation, t as taxIdValidation, c as dateOfIncorporationValidation, r as revenueValidation, f as paymentVolumeValidation, g as whenServiceReceivedValidation, h as recurringPaymentsValidation, j as recurringPaymentsPercentageValidation, s as seasonalBusinessValidation, o as otherPaymentDetailsValidation } from './schema-validations-ccea6a06.js';
 
 const businessCoreInfoSchema = (allowOptionalFields) => {
     const schema = create$3({

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

@@ -1,8 +1,8 @@
 import { h, F as Fragment, r as registerInstance, c as createEvent } from './index-29fcfdf5.js';
-import { E as ErrorState } from './utils-7fb6331d.js';
+import { E as ErrorState } from './utils-c2dc83b2.js';
 import { S as StyledHost } from './styled-host-32228b45.js';
-import { S as Skeleton } from './skeleton-3bcb2b5d.js';
-import './parts-93f379ab.js';
+import { S as Skeleton } from './skeleton-ee7c3b32.js';
+import './parts-ab2bb4b5.js';
 
 const BusinessDetailsLoading = () => {
     const Block = () => (h("div", { class: "mt-5" },

package/dist/esm/{business-identity-schema-8b0f1619.js → business-identity-schema-05bd2a5f.js}

@@ -1,5 +1,5 @@
 import { c as create$3, a as create$6 } from './index.esm-0b6849c2.js';
-import { l as lineOneValidation, k as lineTwoValidation, m as cityValidation, n as stateValidation, q as postalValidation, u as identityNameValidation, v as identityTitleValidation, e as emailValidation, p as phoneValidation, x as dobValidation, y as ssnValidation } from './schema-validations-5b0ac96b.js';
+import { l as lineOneValidation, k as lineTwoValidation, m as cityValidation, n as stateValidation, q as postalValidation, u as identityNameValidation, v as identityTitleValidation, e as emailValidation, p as phoneValidation, x as dobValidation, y as ssnValidation } from './schema-validations-ccea6a06.js';
 
 const addressSchema = (allowOptionalFields) => {
     const schema = create$3({

package/dist/esm/{business.service-ab2663a3.js → business.service-45c7df3c.js}

@@ -1,4 +1,4 @@
-import { A as Api, c as config } from './Api-0cac5b8a.js';
+import { A as Api, c as config } from './Api-97801a4b.js';
 
 class BusinessService {
     async fetchBusiness(businessId, authToken) {
@@ -30,5 +30,11 @@ class BusinessBankAccountService {
         return Api({ authToken, apiOrigin: config.proxyApiOrigin }).post(endpoint, payload);
     }
 }
+class DocumentRecordService {
+    async postDocumentRecord(authToken, payload) {
+        const endpoint = `entities/document`;
+        return Api({ authToken, apiOrigin: config.proxyApiOrigin }).post(endpoint, payload);
+    }
+}
 
-export { BusinessService as B, IdentityService as I, BusinessBankAccountService as a };
+export { BusinessService as B, DocumentRecordService as D, IdentityService as I, BusinessBankAccountService as a };

package/dist/esm/{button-8a02823c.js → button-4b3f3934.js}

@@ -1,5 +1,5 @@
 import { h } from './index-29fcfdf5.js';
-import { f as buttonLoading, g as buttonPrimary, j as buttonSecondary } from './parts-93f379ab.js';
+import { f as buttonLoading, g as buttonPrimary, j as buttonSecondary } from './parts-ab2bb4b5.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/{check-pkg-version-51d2616b.js → check-pkg-version-f91ed31f.js}

@@ -1,5 +1,5 @@
-import { p as packageJson } from './package-5eedfd72.js';
-import { A as Api, c as config } from './Api-0cac5b8a.js';
+import { p as packageJson } from './package-2b7c7bc0.js';
+import { A as Api, c as config } from './Api-97801a4b.js';
 
 class AnalyticsService {
     async record(body) {

package/dist/esm/{checkout.service-c275270e.js → checkout.service-36e3355e.js}

@@ -1,8 +1,10 @@
-import { A as Api, c as config } from './Api-0cac5b8a.js';
-import './Checkout-d476bb83.js';
+import { A as Api, c as config } from './Api-97801a4b.js';
+import './ComponentError-3ce7f437.js';
+import './Checkout-8325c97a.js';
 import './Pagination-afc8f96d.js';
-import './Payment-47630113.js';
-import './SubAccount-f31349a9.js';
+import './Payment-82d2f453.js';
+import './SubAccount-a73bf971.js';
+import './Document-1907c0d4.js';
 
 class CheckoutService {
     async fetchCheckout(authToken, checkoutId) {

package/dist/esm/checkouts-list-core.entry.js

@@ -1,16 +1,18 @@
 import { r as registerInstance, c as createEvent, h } from './index-29fcfdf5.js';
-import './Checkout-d476bb83.js';
+import './ComponentError-3ce7f437.js';
+import './Checkout-8325c97a.js';
 import { p as pagingDefaults } from './Pagination-afc8f96d.js';
-import './Payment-47630113.js';
-import './SubAccount-f31349a9.js';
-import { y as table, z as tableCell } from './parts-93f379ab.js';
-import { T as TableClickActions, a as Table, b as TableLoadingState, c as TableEmptyState, d as TableErrorState } from './event-types-948c3b14.js';
-import { c as checkoutTableColumns, a as checkoutTableCells } from './checkouts-table-115bacc4.js';
+import './Payment-82d2f453.js';
+import './SubAccount-a73bf971.js';
+import './Document-1907c0d4.js';
+import { E as table, F as tableCell } from './parts-ab2bb4b5.js';
+import { T as TableClickActions, a as Table, b as TableLoadingState, c as TableEmptyState, d as TableErrorState } from './event-types-fd7a05d9.js';
+import { c as checkoutTableColumns, a as checkoutTableCells } from './checkouts-table-1634366d.js';
 import { o as onQueryParamsChange, q as queryParams } from './checkouts-list-params-state-1d968971.js';
-import './utils-b76d791e.js';
+import './utils-c37124fc.js';
 import './Dispute-5fd28ec9.js';
-import './spinner-b83f3a87.js';
-import './badge-b034e71b.js';
+import './spinner-8ec6669a.js';
+import './badge-938ba4b1.js';
 import './index-a47fdc7f.js';
 
 const CheckoutsListCore = class {
@@ -133,7 +135,7 @@ const CheckoutsListCore = class {
         return !this.showEmptyState && !this.showErrorState && !this.loading;
     }
     render() {
-        return (h("div", { key: '910d95f94623ddd9e90a182a7a47e7dfdff1d9a6' }, h("div", { key: 'c296c31fe48bec06067215f6aa4cfb1a9d1b681a', class: "table-wrapper" }, h("table", { key: 'dddd43e74de4989261b8014d2c66cba7c26e9d98', class: "table table-hover", part: table }, h("thead", { key: '4eabd9c8687fbf316420c9a838a95016b20f12dd', class: "table-head sticky-top" }, h("tr", { key: '2cdd7f438099613e5a670343723b883470a65dbd', class: "table-light text-nowrap" }, this.checkoutsTable.columnData.map((column) => column))), h("tbody", { key: 'e3fd8f783e0e405d18bc120bf8c2ca4e2ca25f15', class: "table-body" }, h(TableLoadingState, { key: 'ec8e73a90b9951b5fba78651fdd9a93b7531ba49', columnSpan: this.checkoutsTable.columnKeys.length, isLoading: this.loading }), h(TableEmptyState, { key: '6b1ebf8bbd62b0ba9c7032be47c87b929bc413db', isEmpty: this.showEmptyState, columnSpan: this.checkoutsTable.columnKeys.length }), h(TableErrorState, { key: 'a44e8985fb208b91635afe4910fdce5fb94d17e7', columnSpan: this.checkoutsTable.columnKeys.length, errorMessage: this.errorMessage }), this.showRowData && this.checkoutsTable.rowData.map((data, index) => (h("tr", { "data-test-id": "table-row", "data-row-entity-id": this.entityId[index], onClick: this.rowClickHandler }, data)))), this.paging && (h("tfoot", { key: '05ac7e9796a7b4e4450151e762a409c050fc037f', class: "sticky-bottom" }, h("tr", { key: 'd6135d93dafeee69c6d9a12b9bd35e8c77ec3c5a', class: "table-light align-middle" }, h("td", { key: 'ad7b4df45f54519b759797f665bcfa68a1cd512d', part: tableCell, colSpan: this.checkoutsTable.columnData.length }, h("pagination-menu", { key: '3c97cf5daeb90e9b9a881280f25e4307b7392bcf', paging: Object.assign(Object.assign({}, this.paging), { handleClickPrevious: this.handleClickPrevious, handleClickNext: this.handleClickNext }) })))))))));
+        return (h("div", { key: '525904319e2827a04ccbd44f83881504ddeba992' }, h("div", { key: '30c5800d270fe77e2a396b6379273a0639d4221e', class: "table-wrapper" }, h("table", { key: 'f8a66cf99bf0dc185d0cc541e3d38f4b68b136be', class: "table table-hover", part: table }, h("thead", { key: 'c47c664e4bc8526b494d089b8e1198dfe27fa4fc', class: "table-head sticky-top" }, h("tr", { key: '645aca7f2610bd3b86c8e775edf264c9f53c7f6f', class: "table-light text-nowrap" }, this.checkoutsTable.columnData.map((column) => column))), h("tbody", { key: '79a046fced553f214e55d56c401211d0d682394e', class: "table-body" }, h(TableLoadingState, { key: '654f967a8b9552213a232d35e74d2700cc237cfd', columnSpan: this.checkoutsTable.columnKeys.length, isLoading: this.loading }), h(TableEmptyState, { key: '80d985f6055e254262653e240b0d16a2e46123d0', isEmpty: this.showEmptyState, columnSpan: this.checkoutsTable.columnKeys.length }), h(TableErrorState, { key: 'a99fa4e4f370b70cc927a9b3e65d54828e56e448', columnSpan: this.checkoutsTable.columnKeys.length, errorMessage: this.errorMessage }), this.showRowData && this.checkoutsTable.rowData.map((data, index) => (h("tr", { "data-test-id": "table-row", "data-row-entity-id": this.entityId[index], onClick: this.rowClickHandler }, data)))), this.paging && (h("tfoot", { key: '619b3f952c5e6f8e1c612927b5d976ea6e4cffe7', class: "sticky-bottom" }, h("tr", { key: '5fb77b80e4c52154c658bbd2ebc8de9d8bc903aa', class: "table-light align-middle" }, h("td", { key: 'a5d1d6d1cf164681ad7a5f59bf4ae9a70e94911c', part: tableCell, colSpan: this.checkoutsTable.columnData.length }, h("pagination-menu", { key: 'ce6e17ee3d3a6a3f513dedef209e9d4f2d7eff31', paging: Object.assign(Object.assign({}, this.paging), { handleClickPrevious: this.handleClickPrevious, handleClickNext: this.handleClickNext }) })))))))));
     }
     static get watchers() { return {
         "queryParams": ["updateOnPropChange"],

package/dist/esm/{checkouts-table-115bacc4.js → checkouts-table-1634366d.js}

@@ -1,7 +1,7 @@
 import { h } from './index-29fcfdf5.js';
-import { a as formatTime, b as formatDate } from './utils-b76d791e.js';
-import { B as Badge, a as BadgeVariant } from './badge-b034e71b.js';
-import { k as tableHeadCell, m as getAlternateTableCellPart } from './parts-93f379ab.js';
+import { a as formatTime, b as formatDate } from './utils-c37124fc.js';
+import { B as Badge, a as BadgeVariant } from './badge-938ba4b1.js';
+import { k as tableHeadCell, m as getAlternateTableCellPart } from './parts-ab2bb4b5.js';
 
 const MapCheckoutStatusToBadge = (status) => {
     const statusToBadgeProps = {