@justifi/webcomponents 6.0.0-rc.9 → 6.0.1-rc.0

package/dist/module/justifi-business-form.js

@@ -36,30 +36,17 @@ import { d as defineCustomElement$2 } from './legal-address-form.js';
 
 const businessFormSchema = create$3(Object.assign(Object.assign({}, businessCoreInfoSchema().fields), { legal_address: addressSchema(), additional_questions: additionalQuestionsSchema(), representative: identitySchema('representative') }));
 
-const FormBlock = () => (h("div", { class: "row gap-3" },
-    h("div", { class: "col-12" },
-        h(Skeleton, { width: "25%" })),
-    h("div", { class: "col-12" },
-        h(Skeleton, { width: "100%" })),
-    h("div", { class: "col-12 d-flex gap-3" },
-        h(Skeleton, { width: "50%" }),
-        h(Skeleton, { width: "50%" })),
-    h("div", { class: "col-12 d-flex gap-3" },
-        h(Skeleton, { width: "65%" }),
-        h(Skeleton, { width: "35%" }))));
+const FormBlock = () => (h("div", { class: "row gap-3" }, h("div", { class: "col-12" }, h(Skeleton, { width: "25%" })), h("div", { class: "col-12" }, h(Skeleton, { width: "100%" })), h("div", { class: "col-12 d-flex gap-3" }, h(Skeleton, { width: "50%" }), h(Skeleton, { width: "50%" })), h("div", { class: "col-12 d-flex gap-3" }, h(Skeleton, { width: "65%" }), h(Skeleton, { width: "35%" }))));
 const BusinessFormLoading = () => {
-    return (h("div", { class: "row gap-5" },
-        h("div", { class: "col-12" },
-            h(Skeleton, { width: "40%", height: "40px" })),
-        h(FormBlock, null),
-        h(FormBlock, null),
-        h(FormBlock, null)));
+    return (h("div", { class: "row gap-5" }, h("div", { class: "col-12" }, h(Skeleton, { width: "40%", height: "40px" })), h(FormBlock, null), h(FormBlock, null), h(FormBlock, null)));
 };
 
 const BusinessForm = /*@__PURE__*/ proxyCustomElement(class BusinessForm extends HTMLElement {
-    constructor() {
+    constructor(registerHost) {
         super();
-        this.__registerHost();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
         this.__attachShadow();
         this.submitEvent = createEvent(this, "submit-event", 7);
         this.clickEvent = createEvent(this, "click-event", 7);

package/dist/module/justifi-button2.js

@@ -3,15 +3,17 @@ import { S as StyledHost } from './styled-host.js';
 import { B as Button } from './button.js';
 
 const JustifiButton = /*@__PURE__*/ proxyCustomElement(class JustifiButton extends HTMLElement {
-    constructor() {
+    constructor(registerHost) {
         super();
-        this.__registerHost();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
         this.__attachShadow();
         this.variant = 'primary';
         this.type = 'button';
     }
     render() {
-        return (h(StyledHost, { key: 'b9a4be42df1dbeca39a2c310ab6375cc2c1946f3' }, h(Button, { key: '04bfb3aaa6af8b2dafa07dbcebaf6b7a03a07442', variant: this.variant, isLoading: this.isLoading, clickHandler: this.clickHandler, class: this.class, type: this.type, disabled: this.disabled, style: this.customStyle }, this.text)));
+        return (h(StyledHost, { key: '48098276e0808052803f0d16df68ba23d529c4ab' }, h(Button, { key: 'c62e8d2d9208dc180180b4283edea991c5a93c57', variant: this.variant, isLoading: this.isLoading, clickHandler: this.clickHandler, class: this.class, type: this.type, disabled: this.disabled, style: this.customStyle }, this.text)));
     }
 }, [257, "justifi-button", {
         "text": [1],

package/dist/module/justifi-checkout.js

@@ -6,6 +6,7 @@ import { S as StyledHost } from './styled-host.js';
 import './details.js';
 import './event-types.js';
 import { d as defineCustomElement$6 } from './justifi-radio-list-item2.js';
+import { P as PAYMENT_METHODS } from './ModularCheckout.js';
 import { d as defineCustomElement$q } from './custom-popper2.js';
 import { d as defineCustomElement$p } from './form-control-checkbox2.js';
 import { d as defineCustomElement$o } from './form-control-help-text2.js';
@@ -32,12 +33,15 @@ import { d as defineCustomElement$3 } from './sezzle-payment-method.js';
 import { d as defineCustomElement$2 } from './tokenize-payment-method.js';
 
 const Checkout = /*@__PURE__*/ proxyCustomElement(class Checkout extends HTMLElement {
-    constructor() {
+    constructor(registerHost) {
         super();
-        this.__registerHost();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
         this.errorEvent = createEvent(this, "error-event", 7);
         this.loadedEvent = createEvent(this, "loaded", 7);
         this.submitEvent = createEvent(this, "submit-event", 7);
+        this.availablePaymentMethods = [];
         this.errorMessage = '';
         this.insuranceToggled = false;
         this.isSubmitting = false; // This is used to prevent multiple submissions and is different from loading state
@@ -70,6 +74,9 @@ const Checkout = /*@__PURE__*/ proxyCustomElement(class Checkout extends HTMLEle
     checkoutError(_event) {
         this.isSubmitting = false;
     }
+    checkoutChanged(event) {
+        this.availablePaymentMethods = event.detail.availablePaymentMethodTypes;
+    }
     async fillBillingForm(fields) {
         var _a;
         checkoutStore.billingFormFields = fields;
@@ -97,7 +104,10 @@ const Checkout = /*@__PURE__*/ proxyCustomElement(class Checkout extends HTMLEle
         return !this.disableCreditCard && !this.disableBankAccount;
     }
     render() {
-        return (h(StyledHost, { key: '9f4a7eca05e031eca99c30bfedd3073855c73529' }, h("justifi-modular-checkout", { key: 'bd15f818c0b214d540c0a17b26701a09c9ad0e3c', ref: (el) => (this.modularCheckoutRef = el), authToken: this.authToken, checkoutId: this.checkoutId, savePaymentMethod: checkoutStore.savePaymentMethod }, h("div", { key: 'b12acaab9fd003f97bf99e75066e0b8b46dce89e', class: "row gy-3 jfi-checkout-core" }, h("div", { key: '6a8618155c0822bf8c997e8542ecf78a68cbc1c7', class: "col-12", part: checkoutSummary }, h("justifi-header", { key: 'f60d7dbe6115443c313122dfccb6dcb9e0b974c5', text: "Summary", level: "h2", class: "fs-5 fw-bold pb-3" }), h("section", { key: 'ef2583dd15bf25f344a68ac43cefda0d845438c9' }, h("justifi-checkout-summary", { key: '23b1818736c79e126ae79d8ff1951e44bc84facb' }))), h("div", { key: 'd86495b7da53b9ce7c5a3d65d618e4be3079338f', class: "col-12 mt-4" }, h("slot", { key: '85e34415fa3191a185a0a8da50c16338583e7392', name: "insurance" })), h("div", { key: '8cff610ad6e3535438546aeec85b128ee752f4bb', class: "col-12 mt-4" }, h("justifi-header", { key: 'a2b1c31d40e0c5b7a4f3802312c50cb718b80dbc', text: "Payment", level: "h2", class: "fs-5 fw-bold pb-3" }), this.showPaymentTypeHeader && (h("justifi-header", { key: '6bff6394a243c0a3cb643e0704c44b36001393c3', text: "Select payment type", level: "h3", class: "fs-6 fw-bold lh-lg" })), h("div", { key: 'deecdfb1d74a74af62c31f1fb88767986c8f142c', class: "d-flex flex-column" }, h("section", { key: '47bc56f1ad8418c65bb1b3f7eba3aedd22d1df0e' }, h("div", { key: '4aac99bba9fbe8acebc652c3c510157f6623dd1e' }, h("justifi-saved-payment-methods", { key: '62fe7c65f1528828bd07746881f3a64e5c8c3f3a' }), h("justifi-sezzle-payment-method", { key: '81fa1dcea2fabf9a1555dc4e9bdb278f09921f01' }), h("justifi-plaid-payment-method", { key: '6e9f782bfe9fbc098084fac5f6effc5d09c3de97' }), h("justifi-tokenize-payment-method", { key: '53616f11a7ec79d9334da2705d85206dd6260b63', ref: (el) => (this.tokenizePaymentMethodRef = el), authToken: this.authToken, accountId: checkoutStore.accountId, disableCreditCard: this.disableCreditCard, disableBankAccount: this.disableBankAccount, hideCardBillingForm: this.hideCardBillingForm, hideBankAccountBillingForm: this.hideBankAccountBillingForm, hideSubmitButton: true, paymentMethodGroupId: checkoutStore.paymentMethodGroupId }))))), h("div", { key: '4b61246ea605254aa0e329c3803b9fb725709158', class: "mt-4" }, h("justifi-button", { key: '0e5f46931aa558cea5a81d9ea9c9627a1feeca50', text: "Pay", type: "submit", variant: "primary", clickHandler: (e) => this.submit(e), disabled: this.isSubmitting, isLoading: this.isSubmitting, customStyle: { width: '100%', textAlign: "center" } }))))));
+        var _a, _b;
+        return (h(StyledHost, { key: '65e97b6e7b25f885beda63487d96877ac4785847' }, h("justifi-modular-checkout", { key: 'dc009a2897ae02dfaa9ca7694dc20a588bca5b8a', ref: (el) => {
+                this.modularCheckoutRef = el;
+            }, authToken: this.authToken, checkoutId: this.checkoutId }, h("div", { key: '8c8536f5139ad2d05316546a5442552e87992d89', class: "row gy-3 jfi-checkout-core" }, h("div", { key: '20135fb737963df1d2c5e790881b98d6efa8c04b', class: "col-12", part: checkoutSummary }, h("justifi-header", { key: '4fa1fdcad237ce5014266adbd6fec1fa766c3e44', text: "Summary", level: "h2", class: "fs-5 fw-bold pb-3" }), h("section", { key: '44a694a98e30ebd21e1f3d2beaafe8d5d11f1a36' }, h("justifi-checkout-summary", { key: '1ff39b9c2d31649f2346d0aa666168d1cbe1deca' }))), h("div", { key: '6401bebd557fcf9ef73746c2ee4f2d67ccccf73b', class: "col-12 mt-4" }, h("slot", { key: '72d1e32aaed73232cf2b2d247ab5e7fc19a36092', name: "insurance" })), h("div", { key: '2fea8b30dd19032afc7a5b37abe897aa1aee1362', class: "col-12 mt-4" }, h("justifi-header", { key: '8b2d443e9e5db4ba95ab72983e737a7579824e69', text: "Payment", level: "h2", class: "fs-5 fw-bold pb-3" }), this.showPaymentTypeHeader && (h("justifi-header", { key: '67a2c1a30841a789b9b2ee2d16209373ad055783', text: "Select payment type", level: "h3", class: "fs-6 fw-bold lh-lg" })), h("div", { key: '1fdb903931cd73a801975eabd12d7ad43cefcb97', class: "d-flex flex-column" }, h("section", { key: '29b3a041e397aebae60106ac508188d6b4770f1f' }, h("div", { key: '0ab54f7a284a59d8bcae57df1abe8e8347628fc2' }, h("justifi-saved-payment-methods", { key: 'b8f73b6e8992e99332dc55cf6ed099ccb60953c3' }), this.availablePaymentMethods.includes(PAYMENT_METHODS.SEZZLE) && (h("justifi-radio-list-item", { key: 'd87bd60da7d44160a56de342fcbe6c505e8d79e5', name: "paymentMethodType", value: PAYMENT_METHODS.SEZZLE, checked: ((_a = checkoutStore === null || checkoutStore === void 0 ? void 0 : checkoutStore.selectedPaymentMethod) === null || _a === void 0 ? void 0 : _a.type) === PAYMENT_METHODS.SEZZLE, label: h("justifi-sezzle-payment-method", { ref: (el) => (this.sezzlePaymentMethodRef = el) }), "onRadio-click": () => { var _a; (_a = this.sezzlePaymentMethodRef) === null || _a === void 0 ? void 0 : _a.handleSelectionClick(); } })), this.availablePaymentMethods.includes(PAYMENT_METHODS.PLAID) && (h("justifi-radio-list-item", { key: '9d0527fe516eaee74a10314a6f7a866cf40a6942', name: "paymentMethodType", value: PAYMENT_METHODS.PLAID, checked: ((_b = checkoutStore === null || checkoutStore === void 0 ? void 0 : checkoutStore.selectedPaymentMethod) === null || _b === void 0 ? void 0 : _b.type) === PAYMENT_METHODS.PLAID, label: h("justifi-plaid-payment-method", { ref: (el) => (this.plaidPaymentMethodRef = el) }), "onRadio-click": () => { var _a; (_a = this.plaidPaymentMethodRef) === null || _a === void 0 ? void 0 : _a.handleSelectionClick(); } })), h("justifi-tokenize-payment-method", { key: 'fd29144c8e488ee48361df556bde824a80d1a207', ref: (el) => (this.tokenizePaymentMethodRef = el), authToken: this.authToken, accountId: checkoutStore.accountId, disableCreditCard: this.disableCreditCard, disableBankAccount: this.disableBankAccount, hideCardBillingForm: this.hideCardBillingForm, hideBankAccountBillingForm: this.hideBankAccountBillingForm, hideSubmitButton: true, paymentMethodGroupId: checkoutStore.paymentMethodGroupId }))))), h("div", { key: '9f3cc42ae66e37193ab0b6df7f5235aaf8cc3c84', class: "mt-4" }, h("justifi-button", { key: '2cbd13a7bde5ce0478e948456edb2191f9b96c0b', text: "Pay", type: "submit", variant: "primary", clickHandler: (e) => this.submit(e), disabled: this.isSubmitting, isLoading: this.isSubmitting, customStyle: { width: '100%', textAlign: "center" } }))))));
     }
     static get watchers() { return {
         "authToken": ["propChanged"],
@@ -116,6 +126,7 @@ const Checkout = /*@__PURE__*/ proxyCustomElement(class Checkout extends HTMLEle
         "disablePaymentMethodGroup": [4, "disable-payment-method-group"],
         "hideBankAccountBillingForm": [4, "hide-bank-account-billing-form"],
         "hideCardBillingForm": [4, "hide-card-billing-form"],
+        "availablePaymentMethods": [32],
         "checkout": [32],
         "complete": [32],
         "errorMessage": [32],
@@ -124,7 +135,7 @@ const Checkout = /*@__PURE__*/ proxyCustomElement(class Checkout extends HTMLEle
         "serverError": [32],
         "fillBillingForm": [64],
         "validate": [64]
-    }, [[0, "submit-event", "checkoutComplete"], [0, "error-event", "checkoutError"]], {
+    }, [[0, "submit-event", "checkoutComplete"], [0, "error-event", "checkoutError"], [0, "checkout-changed", "checkoutChanged"]], {
         "authToken": ["propChanged"],
         "checkoutId": ["propChanged"],
         "disableCreditCard": ["propChanged"],

package/dist/module/justifi-checkouts-list-filters.js

@@ -16,9 +16,11 @@ import { d as defineCustomElement$3 } from './form-control-tooltip2.js';
 import { d as defineCustomElement$2 } from './table-filters-menu2.js';
 
 const CheckoutsListFilters = /*@__PURE__*/ proxyCustomElement(class CheckoutsListFilters extends HTMLElement {
-    constructor() {
+    constructor(registerHost) {
         super();
-        this.__registerHost();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
         this.__attachShadow();
         this.setParamsOnChange = (name, value) => {
             filterParams[name] = value;
@@ -53,7 +55,7 @@ const CheckoutsListFilters = /*@__PURE__*/ proxyCustomElement(class CheckoutsLis
     }
     render() {
         const filterMenuParams = Object.assign({}, filterParams);
-        return (h(StyledHost, { key: '05a4d429a1acd7bbaf202872523284e2b2cd3677' }, h("table-filters-menu", { key: 'abf61654a75212537af580f3bfd2646042eaba8a', params: filterMenuParams, clearParams: clearParams, part: checkoutsListFilterMenu }, h("div", { key: 'f8e5cfe4b0a23723d0df939a1d1873adffcb1da9', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: 'd9e23e96a7269b3609e690a1e64e8c20bd125cb7', class: "p-2" }, h("form-control-select", { key: 'e1899dbc615be07486bc54f8baa395bee776d8ce', name: "status", label: "Status", options: this.checkoutStatusOptions, inputHandler: this.setParamsOnChange, defaultValue: this.checkoutStatus || filterParams.status, disabled: !!this.checkoutStatus, part: statusCheckoutsListFilterParam })), h("div", { key: 'bedbc26d9d9f6906013ef4b80542d9031822b19c', class: "p-2" }, h("form-control-select", { key: '3bfef7fabeb85a29304e11093005bb1f58b23f41', name: "payment_mode", label: "Payment Mode", options: this.checkoutPaymentModeOptions, inputHandler: this.setParamsOnChange, defaultValue: this.paymentMode || filterParams.payment_mode, disabled: !!this.paymentMode, part: paymentModeCheckoutsListFilterParam }))))));
+        return (h(StyledHost, { key: '0899d18449324a8dc022297d9ab5b4f726d091f9' }, h("table-filters-menu", { key: '8b110d394a685f0f4868c089621711086384ab1c', params: filterMenuParams, clearParams: clearParams, part: checkoutsListFilterMenu }, h("div", { key: 'e556d20b1ff0fe9fe3a8c4ad38e58701cb27d6f7', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: 'ba35f335ab22792af155140efbe01b7deed60e25', class: "p-2" }, h("form-control-select", { key: '6669b68303f80616ce2f307d653e4775c9d2483b', name: "status", label: "Status", options: this.checkoutStatusOptions, inputHandler: this.setParamsOnChange, defaultValue: this.checkoutStatus || filterParams.status, disabled: !!this.checkoutStatus, part: statusCheckoutsListFilterParam })), h("div", { key: '7ddd00d88cc28ea92540b83a5b40354ca69803b8', class: "p-2" }, h("form-control-select", { key: 'dfecff15700e174c3fe12a2aa5bc724e8826b831', name: "payment_mode", label: "Payment Mode", options: this.checkoutPaymentModeOptions, inputHandler: this.setParamsOnChange, defaultValue: this.paymentMode || filterParams.payment_mode, disabled: !!this.paymentMode, part: paymentModeCheckoutsListFilterParam }))))));
     }
 }, [257, "justifi-checkouts-list-filters", {
         "checkoutStatus": [1, "checkout-status"],

package/dist/module/justifi-checkouts-list.js

@@ -45,9 +45,11 @@ const makeGetCheckouts = ({ accountId, authToken, service }) => async ({ params,
 };
 
 const CheckoutsList = /*@__PURE__*/ proxyCustomElement(class CheckoutsList extends HTMLElement {
-    constructor() {
+    constructor(registerHost) {
         super();
-        this.__registerHost();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
         this.__attachShadow();
         this.errorEvent = createEvent(this, "error-event", 7);
         this.errorMessage = null;
@@ -101,7 +103,7 @@ const CheckoutsList = /*@__PURE__*/ proxyCustomElement(class CheckoutsList exten
         }
     }
     render() {
-        return (h(StyledHost, { key: 'b0c774c4f56f94cd6b4a3dc8651938f9f33ca94e' }, h("checkouts-list-core", { key: 'd524423a791f70c234044f5ba27d7bc3648fc988', getCheckouts: this.getCheckouts, getSubAccounts: this.getSubAccounts, "onError-event": this.handleErrorEvent, columns: this.columns })));
+        return (h(StyledHost, { key: '4889226a2351b13dde8cbbfb0ba5fb3156226c5f' }, h("checkouts-list-core", { key: '56c36469e55f5ce33da5cc3224ebfd83057811d7', getCheckouts: this.getCheckouts, getSubAccounts: this.getSubAccounts, "onError-event": this.handleErrorEvent, columns: this.columns })));
     }
     static get watchers() { return {
         "accountId": ["propChanged"],

package/dist/module/justifi-config-provider.js

@@ -2,9 +2,11 @@ import { proxyCustomElement, HTMLElement } from '@stencil/core/internal/client';
 import { s as setConfigState } from './config-state.js';
 
 const ConfigProvider = /*@__PURE__*/ proxyCustomElement(class ConfigProvider extends HTMLElement {
-    constructor() {
+    constructor(registerHost) {
         super();
-        this.__registerHost();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
         this.apiOrigin = "https://wc-proxy.justifi.ai";
         this.iframeOrigin = "https://components.justifi.ai";
         this.accountId = '';

package/dist/module/justifi-dispute-management.js

@@ -53,9 +53,11 @@ const makeGetDispute = ({ id, authToken, service }) => async ({ onSuccess, onErr
 };
 
 const DisputeManagement = /*@__PURE__*/ proxyCustomElement(class DisputeManagement extends HTMLElement {
-    constructor() {
+    constructor(registerHost) {
         super();
-        this.__registerHost();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
         this.errorEvent = createEvent(this, "error-event", 7);
         this.errorMessage = null;
         this.handleErrorEvent = event => {
@@ -94,7 +96,7 @@ const DisputeManagement = /*@__PURE__*/ proxyCustomElement(class DisputeManageme
         }
     }
     render() {
-        return (h("justifi-dispute-management-core", { key: '8c800827aaa9d549a734ea05698763685e160a98', getDispute: this.getDispute, disputeId: this.disputeId, authToken: this.authToken, "onError-event": this.handleErrorEvent }));
+        return (h("justifi-dispute-management-core", { key: '4087eb105a046a3cc194d9f25c80fa11298fa0a2', getDispute: this.getDispute, disputeId: this.disputeId, authToken: this.authToken, "onError-event": this.handleErrorEvent }));
     }
     static get watchers() { return {
         "disputeId": ["propChanged"],

package/dist/module/justifi-gross-payment-chart.js

@@ -45,9 +45,11 @@ const makeGetGrossPaymentChartData = ({ id, authToken, service }) => async ({ on
 };
 
 const GrossPaymentChart = /*@__PURE__*/ proxyCustomElement(class GrossPaymentChart extends HTMLElement {
-    constructor() {
+    constructor(registerHost) {
         super();
-        this.__registerHost();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
         this.__attachShadow();
         this.errorEvent = createEvent(this, "error-event", 7);
         this.errorMessage = null;

package/dist/module/justifi-header2.js

@@ -5,9 +5,11 @@ import { H as Header2 } from './header-2.js';
 import { H as Header3 } from './header-3.js';
 
 const Header = /*@__PURE__*/ proxyCustomElement(class Header extends HTMLElement {
-    constructor() {
+    constructor(registerHost) {
         super();
-        this.__registerHost();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
         this.__attachShadow();
         this.levels = {
             h1: Header1,
@@ -18,7 +20,7 @@ const Header = /*@__PURE__*/ proxyCustomElement(class Header extends HTMLElement
     }
     render() {
         const HeaderComponent = this.levels[this.level];
-        return (h(StyledHost, { key: '002dfd5dd8fa47304d9e468e28bdbeb56723913b' }, h(HeaderComponent, { key: '63110d45f87268510cc309d8081f191ef8d4cd8b', text: this.text, class: this.class })));
+        return (h(StyledHost, { key: 'eb3651b698897193d34a6c6456cd57dd0bd0bc43' }, h(HeaderComponent, { key: '39caee687f93d3d4d90e62d9fbcae318eaa8022e', text: this.text, class: this.class })));
     }
 }, [257, "justifi-header", {
         "text": [1],

package/dist/module/justifi-order-terminals.js

@@ -15,46 +15,18 @@ import './dinero.js';
 import './Pagination.js';
 import { g as getErrorCode, a as getErrorMessage } from './utils4.js';
 import { T as TerminalService } from './terminal.service.js';
-import { m as formatPhoneNumber } from './utils2.js';
+import { n as formatPhoneNumber } from './utils2.js';
 import { d as defineCustomElement$4 } from './custom-popper2.js';
 import { d as defineCustomElement$3 } from './form-control-tooltip2.js';
 import { d as defineCustomElement$2 } from './terminal-quantity-selector2.js';
 
-const FormBlock = () => (h("div", { class: "row gap-3" },
-    h("div", { class: "col-12" },
-        h(Skeleton, { width: "25%" })),
-    h("div", { class: "col-12" },
-        h(Skeleton, { width: "100%" })),
-    h("div", { class: "col-12 d-flex gap-3" },
-        h(Skeleton, { width: "50%" }),
-        h(Skeleton, { width: "50%" })),
-    h("div", { class: "col-12 d-flex gap-3" },
-        h(Skeleton, { width: "65%" }),
-        h(Skeleton, { width: "35%" }))));
+const FormBlock = () => (h("div", { class: "row gap-3" }, h("div", { class: "col-12" }, h(Skeleton, { width: "25%" })), h("div", { class: "col-12" }, h(Skeleton, { width: "100%" })), h("div", { class: "col-12 d-flex gap-3" }, h(Skeleton, { width: "50%" }), h(Skeleton, { width: "50%" })), h("div", { class: "col-12 d-flex gap-3" }, h(Skeleton, { width: "65%" }), h(Skeleton, { width: "35%" }))));
 const OrderTerminalsLoading = () => {
-    return (h("div", { class: "row gap-5" },
-        h("div", { class: "col-12" },
-            h(Skeleton, { width: "40%", height: "40px" })),
-        h(FormBlock, null)));
+    return (h("div", { class: "row gap-5" }, h("div", { class: "col-12" }, h(Skeleton, { width: "40%", height: "40px" })), h(FormBlock, null)));
 };
 
 const TerminalSelectorLoading = () => {
-    return (h("div", { class: "terminal-selector-skeleton mt-4 rounded shadow-sm" },
-        h("div", { class: "d-flex align-items-center gap-3" },
-            h(Skeleton, { width: "125px", height: "125px", styles: { borderRadius: '8px' } }),
-            h("div", { class: "flex-grow-1" },
-                h("div", { class: "d-flex row flex-row" },
-                    h("div", { class: "col-6 flex-column" },
-                        h(Skeleton, null),
-                        h(Skeleton, { width: "60%" })),
-                    h("div", { class: "d-flex justify-content-end align-items-center gap-2 col-6" },
-                        h(Skeleton, { width: "32px", height: "32px", styles: { borderRadius: '50%' } }),
-                        h(Skeleton, { width: "80px", height: "32px" }),
-                        h(Skeleton, { width: "32px", height: "32px", styles: { borderRadius: '50%' } }))),
-                h("div", { class: "mt-4" },
-                    h("div", { class: "d-flex flex-column gap-2" },
-                        h(Skeleton, null),
-                        h(Skeleton, null)))))));
+    return (h("div", { class: "terminal-selector-skeleton mt-4 rounded shadow-sm" }, h("div", { class: "d-flex align-items-center gap-3" }, h(Skeleton, { width: "125px", height: "125px", styles: { borderRadius: '8px' } }), h("div", { class: "flex-grow-1" }, h("div", { class: "d-flex row flex-row" }, h("div", { class: "col-6 flex-column" }, h(Skeleton, null), h(Skeleton, { width: "60%" })), h("div", { class: "d-flex justify-content-end align-items-center gap-2 col-6" }, h(Skeleton, { width: "32px", height: "32px", styles: { borderRadius: '50%' } }), h(Skeleton, { width: "80px", height: "32px" }), h(Skeleton, { width: "32px", height: "32px", styles: { borderRadius: '50%' } }))), h("div", { class: "mt-4" }, h("div", { class: "d-flex flex-column gap-2" }, h(Skeleton, null), h(Skeleton, null)))))));
 };
 
 const makeGetTerminalModels = ({ id, authToken, service }) => async ({ onSuccess, onError }) => {
@@ -115,9 +87,11 @@ const makeOrderTerminals = ({ authToken, service, apiOrigin = "https://wc-proxy.
 };
 
 const OrderTerminals = /*@__PURE__*/ proxyCustomElement(class OrderTerminals extends HTMLElement {
-    constructor() {
+    constructor(registerHost) {
         super();
-        this.__registerHost();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
         this.__attachShadow();
         this.errorEvent = createEvent(this, "error-event", 7);
         this.submitted = createEvent(this, "submit-event", 7);
@@ -231,7 +205,7 @@ const OrderTerminals = /*@__PURE__*/ proxyCustomElement(class OrderTerminals ext
         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: 'e4db746dd7e5e4fcd2836957a91bf1a4d85b875c' }, h("div", { key: '08e8950e36bf787a2747b33da377be1f60c6d40a', part: text }, this.renderLoading(), this.renderBusinessDetails(), this.renderTerminals(), this.renderOrderSection())));
+        return (h(StyledHost, { key: '3ea6cebd4ab6bc47090056581482dab8502175c1' }, h("div", { key: '383dc710920b5119841d5cf6f1b596ebc349fd5a', part: text }, this.renderLoading(), this.renderBusinessDetails(), this.renderTerminals(), this.renderOrderSection())));
     }
 }, [257, "justifi-order-terminals", {
         "businessId": [1, "business-id"],

package/dist/module/justifi-payment-details.js

@@ -8,9 +8,11 @@ import { d as defineCustomElement$3 } from './details.js';
 import { d as defineCustomElement$2 } from './payment-details-core2.js';
 
 const PaymentDetails = /*@__PURE__*/ proxyCustomElement(class PaymentDetails extends HTMLElement {
-    constructor() {
+    constructor(registerHost) {
         super();
-        this.__registerHost();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
         this.__attachShadow();
         this.errorEvent = createEvent(this, "error-event", 7);
         this.errorMessage = null;

package/dist/module/justifi-payment-provisioning.js

@@ -53,9 +53,11 @@ class ProvisionService {
 }
 
 const PaymentProvisioning = /*@__PURE__*/ proxyCustomElement(class PaymentProvisioning extends HTMLElement {
-    constructor() {
+    constructor(registerHost) {
         super();
-        this.__registerHost();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
         this.__attachShadow();
         this.errorEvent = createEvent(this, "error-event", 7);
         this.allowOptionalFields = false;
@@ -97,7 +99,7 @@ const PaymentProvisioning = /*@__PURE__*/ proxyCustomElement(class PaymentProvis
         }
     }
     render() {
-        return (h("justifi-payment-provisioning-core", { key: '6d77016584f204fdc4be5fd554b4eb1639e856ab', businessId: this.businessId, authToken: this.authToken, allowOptionalFields: this.allowOptionalFields, formTitle: this.formTitle, getBusiness: this.getBusiness, postProvisioning: this.postProvisioning }));
+        return (h("justifi-payment-provisioning-core", { key: '4d0da0feba2d6786e696f6cc9e286d77e6aca8f1', businessId: this.businessId, authToken: this.authToken, allowOptionalFields: this.allowOptionalFields, formTitle: this.formTitle, getBusiness: this.getBusiness, postProvisioning: this.postProvisioning }));
     }
     static get watchers() { return {
         "authToken": ["propChanged"],

package/dist/module/justifi-payment-transactions-list.js

@@ -78,9 +78,7 @@ const paymentTransactionTypes = {
     void: "Void",
 };
 const paymentTransactionTableCells = {
-    created_at: (balanceTransaction, index) => (h("td", { part: getAlternateTableCellPart(index) },
-        h("div", { class: "fw-bold" }, convertToLocal(balanceTransaction.created_at, { showDisplayDate: true })),
-        h("div", { class: "fw-bold" }, convertToLocal(balanceTransaction.created_at, { showTime: true })))),
+    created_at: (balanceTransaction, index) => (h("td", { part: getAlternateTableCellPart(index) }, h("div", { class: "fw-bold" }, convertToLocal(balanceTransaction.created_at, { showDisplayDate: true })), h("div", { class: "fw-bold" }, convertToLocal(balanceTransaction.created_at, { showTime: true })))),
     type: (balanceTransaction, index) => (h("td", { part: getAlternateTableCellPart(index) }, paymentTransactionTypes[balanceTransaction.payment_balance_txn_type])),
     id: (balanceTransaction, index) => (h("td", { part: getAlternateTableCellPart(index) }, balanceTransaction.id)),
     amount: (balanceTransaction, index) => (h("td", { part: getAlternateTableCellPart(index), class: "text-end" }, balanceTransaction.formattedPaymentAmount(balanceTransaction.amount))),
@@ -94,9 +92,11 @@ const paymentTransactionTableCells = {
 };
 
 const PaymentTransactionsList = /*@__PURE__*/ proxyCustomElement(class PaymentTransactionsList extends HTMLElement {
-    constructor() {
+    constructor(registerHost) {
         super();
-        this.__registerHost();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
         this.__attachShadow();
         this.clickEvent = createEvent(this, "click-event", 7);
         this.errorEvent = createEvent(this, "error-event", 7);
@@ -181,7 +181,7 @@ const PaymentTransactionsList = /*@__PURE__*/ proxyCustomElement(class PaymentTr
         return !this.showEmptyState && !this.showErrorState && !this.isLoading;
     }
     render() {
-        return (h(StyledHost, { key: '319dd31638820c1b8e65ce810a1084bd97680871' }, h(TableWrapper, { key: '5300e0fa59d5c4f32bfa2a96e7d1a17f5ed2f626' }, h(TableComponent, { key: '90c694bf7d0d7d36143c62b359173d409223966c' }, h(TableHead, { key: 'bbba709334677759c2f6fbcb49da6b972d3983f4' }, h(TableHeadRow, { key: 'f64b3507d3ce6ef642fc1fed9a4c33fbb2a9aed3' }, this.transactionsTable.columnData.map((column) => column))), h(TableBody, { key: '8abd36f3aa50cc366f51ef4944da5cf120aecf4f' }, h(TableLoadingState, { key: '911438409c08a12cc726a71f3c6afd7eeee3e094', columnSpan: this.transactionsTable.columnKeys.length, isLoading: this.isLoading }), h(TableEmptyState, { key: '222ae88a6ac8405c038d902a7b037f7917e33d37', isEmpty: this.showEmptyState, columnSpan: this.transactionsTable.columnKeys.length }), h(TableErrorState, { key: '7de0c2da52df00431f88a0f95bdc27faef67d577', 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: 'cd25d15d2d0b24de419c46e232e37a51e63c5959' }, h(TableFootRow, { key: '68097f15491a919933b5a388d2af59aded384de2' }, h(TableFootCell, { key: '01c50afbebd724bd979686c9e1d835c90c7338af', colSpan: this.transactionsTable.columnData.length }, h("pagination-menu", { key: '9dd49395bbe101bc5afbef53a5636b1be71c9f8b', paging: Object.assign(Object.assign({}, this.paging), { handleClickPrevious: this.handleClickPrevious, handleClickNext: this.handleClickNext }) })))))))));
+        return (h(StyledHost, { key: 'c73dfcd1d3038dbca6800b9bd0f4e6c5fba2b8bf' }, h(TableWrapper, { key: '66d8f92a96f2ace82c05d10a9f538d6ad22b588f' }, h(TableComponent, { key: 'cff0e6344efd035f264326ecc79615bddfe8d0ac' }, h(TableHead, { key: '702e53ae1d59ab674425f4753c1cf0b6415feacd' }, h(TableHeadRow, { key: '7773de2d113af30b3a0d64405dce5d5e09a0bb8c' }, this.transactionsTable.columnData.map((column) => column))), h(TableBody, { key: '7b86d982f52037349b5cc2f7ec5fa800e38ed519' }, h(TableLoadingState, { key: '040c3dfb101c1ea127cfcf982e4415ae94661b2a', columnSpan: this.transactionsTable.columnKeys.length, isLoading: this.isLoading }), h(TableEmptyState, { key: '6d25f8a886cf9b15ea9c17c44dfe0bce6125c557', isEmpty: this.showEmptyState, columnSpan: this.transactionsTable.columnKeys.length }), h(TableErrorState, { key: '60bb435ecf7a595cdb028df4cd95c1361ce06c8d', 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: 'accb2e3cb9dc8521c50db6a8ed306f91e5aa44c7' }, h(TableFootRow, { key: 'a4408276ce552fe4c43c60f79e7a2a3602566b2c' }, h(TableFootCell, { key: '20b13cc71f8b62166e8b6e9fce5dea2d1b4c5ac0', colSpan: this.transactionsTable.columnData.length }, h("pagination-menu", { key: '90657ed6a805af46446bc8fb316a52252a9a2bf4', paging: Object.assign(Object.assign({}, this.paging), { handleClickPrevious: this.handleClickPrevious, handleClickNext: this.handleClickNext }) })))))))));
     }
     static get watchers() { return {
         "pagingParams": ["propChanged"],

package/dist/module/justifi-payments-list-filters.js

@@ -15,9 +15,11 @@ import { d as defineCustomElement$3 } from './form-control-tooltip2.js';
 import { d as defineCustomElement$2 } from './table-filters-menu2.js';
 
 const PaymentsListFilters = /*@__PURE__*/ proxyCustomElement(class PaymentsListFilters extends HTMLElement {
-    constructor() {
+    constructor(registerHost) {
         super();
-        this.__registerHost();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
         this.__attachShadow();
         this.setParamsOnChange = (name, value) => {
             filterParams[name] = value;
@@ -56,8 +58,8 @@ const PaymentsListFilters = /*@__PURE__*/ proxyCustomElement(class PaymentsListF
     }
     render() {
         const filterMenuParams = Object.assign({}, filterParams);
-        return (h(StyledHost, { key: '0c73ae99756262e6ba40e72276b511070af4e68a' }, h("table-filters-menu", { key: '743c956a0048506afd183b32a21839896904ab20', params: filterMenuParams, clearParams: clearParams, part: paymentsListFilterMenu }, h("div", { key: 'a1ef2ace492cec39e7a92776f92ad6c77e845124', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: '12777eec67882e8873c5670084abc359134af545', class: "p-2" }, h("form-control-text", { key: '9717940d68bad26545c05e681875862d816f5903', name: "payment_id", label: "Payment ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.paymentId || filterParams.payment_id, disabled: !!this.paymentId, part: paymentIdPaymentsListFilterParam })), h("div", { key: 'c4f3f6fc3eba84df52a90459c1ba93770d726def', class: "p-2" }, h("form-control-text", { key: '3feccdbf8465ee62b226534e40bcd905fffb912b', name: "terminal_id", label: "Terminal ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.terminalId || filterParams.terminal_id, disabled: !!this.terminalId, part: terminalIdPaymentsListFilterParam })), h("div", { key: 'd256237c10018161f2466d764770fae50f22697b', class: "p-2" }, h("form-control-select", { key: '293c79070436d91f58ea346eaf565b0b105af448', 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: 'a14db9644e4af3dafeae4cabcf16f1651f75bee6', class: "p-2" }, h("form-control-date", { key: '5c9aaffbab312307585c1a9c1537e0c1be823c5d', 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: '8eedf4c52906f5c3f1a194737473a25afa9a7b7f', class: "p-2" }, h("form-control-date", { key: 'e0201787ad957d0df44289bab71fe9cc0517c49a', name: "created_before", label: "Created Before", inputHandler: this.handleDateInput, defaultValue: convertToLocal(this.createdBefore, { showInputDateTime: true }) ||
+        return (h(StyledHost, { key: 'ef06ca5d0df145fd2c7f82fb164a4098b1654e7c' }, h("table-filters-menu", { key: '32739ded26b3a11092e5237d363b5b280c859f0c', params: filterMenuParams, clearParams: clearParams, part: paymentsListFilterMenu }, h("div", { key: '2e123d80c45a92944811b9124e13f6cfc2e11cc0', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: 'd9e5facfe21e0896a4f0542a12592f11c54c0bc8', class: "p-2" }, h("form-control-text", { key: '084cec1084b8be08a5520891479aa4b4ab168ab7', name: "payment_id", label: "Payment ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.paymentId || filterParams.payment_id, disabled: !!this.paymentId, part: paymentIdPaymentsListFilterParam })), h("div", { key: 'c86027af0c49931a34e31e185cfc3c0d1093caf9', class: "p-2" }, h("form-control-text", { key: '694b5ddd5f90af1d73320cb6e29ce2e3aafce0b8', name: "terminal_id", label: "Terminal ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.terminalId || filterParams.terminal_id, disabled: !!this.terminalId, part: terminalIdPaymentsListFilterParam })), h("div", { key: '4d2e5e1a0e76a58be68255e08a2a4f09dbbbc481', class: "p-2" }, h("form-control-select", { key: 'd4fa79604b6f9a390a63601001bc2ba8f8af425a', 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: '54cc9fb98d5c0f6d96abb592d5e22c037634089c', class: "p-2" }, h("form-control-date", { key: '95001198266f09607e34d0c1fa5c1d0693b67b0a', 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: '3510ccb63020969b2777c65ed82cfab9027dccd8', class: "p-2" }, h("form-control-date", { key: '428a3195efb976842c186aa0b4ec76ebfb1b7836', 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 }))))));
     }
 }, [257, "justifi-payments-list-filters", {

package/dist/module/justifi-payments-list.js

@@ -47,9 +47,11 @@ const makeGetPayments = ({ id, authToken, service }) => async ({ params, onSucce
 };
 
 const PaymentsList = /*@__PURE__*/ proxyCustomElement(class PaymentsList extends HTMLElement {
-    constructor() {
+    constructor(registerHost) {
         super();
-        this.__registerHost();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
         this.__attachShadow();
         this.errorEvent = createEvent(this, "error-event", 7);
         this.errorMessage = null;
@@ -90,7 +92,7 @@ const PaymentsList = /*@__PURE__*/ proxyCustomElement(class PaymentsList extends
         }
     }
     render() {
-        return (h(StyledHost, { key: '654b1e63aedc77ef887875795a2a4946fae5700f' }, h("payments-list-core", { key: 'ab9957172f5120c73d0150d3c2d0c9a61671d861', getPayments: this.getPayments, "onError-event": this.handleErrorEvent, columns: this.columns })));
+        return (h(StyledHost, { key: '4cdd2e9a318226408d47198bf2de40a750a71d01' }, h("payments-list-core", { key: '87964c5dd33fd3b716964227cd990539d5d13fc4', getPayments: this.getPayments, "onError-event": this.handleErrorEvent, columns: this.columns })));
     }
     static get watchers() { return {
         "accountId": ["propChanged"],

package/dist/module/justifi-payout-details.js

@@ -42,9 +42,11 @@ const makeGetPayoutDetails = ({ id, authToken, service }) => async ({ onSuccess,
 };
 
 const PayoutDetails = /*@__PURE__*/ proxyCustomElement(class PayoutDetails extends HTMLElement {
-    constructor() {
+    constructor(registerHost) {
         super();
-        this.__registerHost();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
         this.__attachShadow();
         this.errorEvent = createEvent(this, "error-event", 7);
         this.errorMessage = null;

package/dist/module/justifi-payout-transactions-list.js

@@ -88,21 +88,17 @@ const payoutTransactionTableCells = {
     description: (transaction) => (h("td", { part: getAlternateTableCellPart(transaction.description) }, transaction.description)),
     source_id: (transaction) => (h("td", { part: getAlternateTableCellPart(transaction.source_id) }, transaction.source_id)),
     txn_type: (transaction) => (h("td", { part: getAlternateTableCellPart(transaction.txn_type) }, payoutTransactionTypes[transaction.txn_type])),
-    created_at: (transaction) => (h("td", { part: getAlternateTableCellPart(transaction.created_at) },
-        h("div", { class: "fw-bold" }, convertToLocal(transaction.created_at, { showDisplayDate: true })),
-        h("div", { class: "fw-bold" }, convertToLocal(transaction.created_at, { showTime: true })))),
-    available_on: (transaction) => (h("td", { part: getAlternateTableCellPart(transaction.available_on) },
-        h("div", { class: "fw-bold" }, convertToLocal(transaction.available_on, { showDisplayDate: true })),
-        h("div", { class: "fw-bold" }, convertToLocal(transaction.available_on, { showTime: true })))),
-    updated_at: (transaction) => (h("td", { part: getAlternateTableCellPart(transaction.updated_at) },
-        h("div", { class: "fw-bold" }, convertToLocal(transaction.updated_at, { showDisplayDate: true })),
-        h("div", { class: "fw-bold" }, convertToLocal(transaction.updated_at, { showTime: true })))),
+    created_at: (transaction) => (h("td", { part: getAlternateTableCellPart(transaction.created_at) }, h("div", { class: "fw-bold" }, convertToLocal(transaction.created_at, { showDisplayDate: true })), h("div", { class: "fw-bold" }, convertToLocal(transaction.created_at, { showTime: true })))),
+    available_on: (transaction) => (h("td", { part: getAlternateTableCellPart(transaction.available_on) }, h("div", { class: "fw-bold" }, convertToLocal(transaction.available_on, { showDisplayDate: true })), h("div", { class: "fw-bold" }, convertToLocal(transaction.available_on, { showTime: true })))),
+    updated_at: (transaction) => (h("td", { part: getAlternateTableCellPart(transaction.updated_at) }, h("div", { class: "fw-bold" }, convertToLocal(transaction.updated_at, { showDisplayDate: true })), h("div", { class: "fw-bold" }, convertToLocal(transaction.updated_at, { showTime: true })))),
 };
 
 const PayoutTransactionsList = /*@__PURE__*/ proxyCustomElement(class PayoutTransactionsList extends HTMLElement {
-    constructor() {
+    constructor(registerHost) {
         super();
-        this.__registerHost();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
         this.__attachShadow();
         this.clickEvent = createEvent(this, "click-event", 7);
         this.errorEvent = createEvent(this, "error-event", 7);
@@ -190,7 +186,7 @@ const PayoutTransactionsList = /*@__PURE__*/ proxyCustomElement(class PayoutTran
         return Object.assign({ payout_id: this.payoutId, limit: '15' }, this.pagingParams);
     }
     render() {
-        return (h(StyledHost, { key: '0627b879f2139685ebdbb879d6e13ef99a466654' }, h(TableWrapper, { key: '33fa60d6acc25540e81465500c454f69a2e132ad' }, h(TableComponent, { key: '5bce0713f04022cbfad1c7e053e60a6a340a37e2' }, h(TableHead, { key: '226dda187d5002c9bd48c64d9396ae3736dbbeb2' }, h(TableHeadRow, { key: 'd7726ab935ce064696fb017b10829120f2e8717f' }, this.transactionsTable.columnData.map((column) => column))), h(TableBody, { key: 'a6d46402bd1ba1f4bd820b0badd74d038b82e9ba' }, h(TableLoadingState, { key: '5958446a6844c2134d8ae8608b1222a5ade9dc88', columnSpan: this.transactionsTable.columnKeys.length, isLoading: this.isLoading }), h(TableEmptyState, { key: 'f64911e09fa1d587dbbdf755ae7b9aabc4b31448', isEmpty: this.showEmptyState, columnSpan: this.transactionsTable.columnKeys.length }), h(TableErrorState, { key: '8c1422f9ab251ad648396bf42e6751a50a8a9810', 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: '4538b7850a81a7c17cf4a7b39248d1c29552c9ee' }, h(TableFootRow, { key: 'bf332e1eef41f832aff8fb3d84de891c6fc44cb4' }, h(TableFootCell, { key: '823e4ce33a986a57aa29f41ec3f09987d8a03a22', colSpan: this.transactionsTable.columnData.length }, h("pagination-menu", { key: '37aa4a533e9ebdf8df92660b6ebbb1f8dba96eea', paging: Object.assign(Object.assign({}, this.paging), { handleClickPrevious: this.handleClickPrevious, handleClickNext: this.handleClickNext }) })))))))));
+        return (h(StyledHost, { key: 'f795f89fe39f8cded7f0d9c671df8e3e86de6f03' }, h(TableWrapper, { key: '5bb5f805a78965068f675012a1a491e5dd3d4416' }, h(TableComponent, { key: 'c75e72fb5bde6b3f8f127be4d76ef1fa66ce6781' }, h(TableHead, { key: '3dfb03ed0205f6fff21953e0a4c85e8b151680a1' }, h(TableHeadRow, { key: '169156e61bdf1ce6e10b89c660526a7ec9efb860' }, this.transactionsTable.columnData.map((column) => column))), h(TableBody, { key: '1e59e340e98ace8291acfbe26836e5b2b7b7dd29' }, h(TableLoadingState, { key: '3c1a420d293d24ac9434f034c7e6de7a83698b63', columnSpan: this.transactionsTable.columnKeys.length, isLoading: this.isLoading }), h(TableEmptyState, { key: '2038ebb6ff5480d74b0bb6a6ecf31a9531f606ef', isEmpty: this.showEmptyState, columnSpan: this.transactionsTable.columnKeys.length }), h(TableErrorState, { key: '48582c83e384b4e5ba81c4d0055dc9e727a81cdd', 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: '0bb2c1f4085278db7b114c8b9c5a11702a1840d1' }, h(TableFootRow, { key: '2cc9fe5d66b433b392da1e0a1ae265db6404002d' }, h(TableFootCell, { key: 'cb21e30d68c92758efa03fbd16509ff28ab5e316', colSpan: this.transactionsTable.columnData.length }, h("pagination-menu", { key: 'e5ac8aa63ddb08d7f70976cfceccbadab3b8efa9', paging: Object.assign(Object.assign({}, this.paging), { handleClickPrevious: this.handleClickPrevious, handleClickNext: this.handleClickNext }) })))))))));
     }
     static get watchers() { return {
         "pagingParams": ["propChanged"],

package/dist/module/justifi-payouts-list-filters.js

@@ -12,9 +12,11 @@ import { d as defineCustomElement$3 } from './form-control-tooltip2.js';
 import { d as defineCustomElement$2 } from './table-filters-menu2.js';
 
 const PayoutsListFilters = /*@__PURE__*/ proxyCustomElement(class PayoutsListFilters extends HTMLElement {
-    constructor() {
+    constructor(registerHost) {
         super();
-        this.__registerHost();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
         this.__attachShadow();
         this.setParamsOnChange = (name, value) => {
             filterParams[name] = value;
@@ -37,8 +39,8 @@ const PayoutsListFilters = /*@__PURE__*/ proxyCustomElement(class PayoutsListFil
     }
     render() {
         const filterMenuParams = Object.assign({}, filterParams);
-        return (h(StyledHost, { key: '248abec7fe7721a434cde6eb4f8b1cd893dd0fb8' }, h("table-filters-menu", { key: '3e7d6308bf98b85e5f842646f79e4bd0d4a29cc2', params: filterMenuParams, clearParams: clearParams, part: payoutsListFilterMenu }, h("div", { key: '85a8835dabda4e6d7c665e9ae33cfc2e77ddc73a', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: '32b63f3d5914ab9d2dc243dc6c4bd0e664962910', class: "p-2" }, h("form-control-date", { key: '7ebd20f7ef43475c7d619a90237bd68908d41cd0', 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: '87ff4710b133d4c7271a807e28373885d46b83f7', class: "p-2" }, h("form-control-date", { key: '648a88b4ec52e38474b29380e68453c92fb7a71f', name: "created_before", label: "Created Before", inputHandler: this.handleDateInput, defaultValue: convertToLocal(this.createdBefore, { showInputDate: true }) ||
+        return (h(StyledHost, { key: '83debaafb73e9143b6e2e7804f69c4124845d01e' }, h("table-filters-menu", { key: '162c3af697cef40e2a93c7e0245ec4d7d385f361', params: filterMenuParams, clearParams: clearParams, part: payoutsListFilterMenu }, h("div", { key: '7e118d535a6bed14a1ea6e7ed920fd682bbd3705', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: 'dfd557f8d5a3f834bbaa5164ef2c1e7d3c19adcc', class: "p-2" }, h("form-control-date", { key: '01d9e16489abce36d4f770c4c06912923026860f', 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: '9e7167618cc737911056c9217dc6a1ca77c1f41b', class: "p-2" }, h("form-control-date", { key: 'd80e6e2ebda1cd8f290daff21908f7dba1af2d7a', 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 }))))));
     }
 }, [257, "justifi-payouts-list-filters", {

package/dist/module/justifi-payouts-list.js

@@ -46,9 +46,11 @@ const makeGetPayouts = ({ id, authToken, service }) => async ({ params, onSucces
 };
 
 const PayoutsList = /*@__PURE__*/ proxyCustomElement(class PayoutsList extends HTMLElement {
-    constructor() {
+    constructor(registerHost) {
         super();
-        this.__registerHost();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
         this.__attachShadow();
         this.errorEvent = createEvent(this, "error-event", 7);
         this.errorMessage = null;
@@ -104,7 +106,7 @@ const PayoutsList = /*@__PURE__*/ proxyCustomElement(class PayoutsList extends H
         }
     }
     render() {
-        return (h(StyledHost, { key: '3634ad59f6812d546780dd367c4ccb8e886283ed' }, h("payouts-list-core", { key: '3172f765100e19c25f717256e5e7ed0b139c1bc1', getPayouts: this.getPayouts, getPayoutCSV: this.getPayoutCSV, getSubAccounts: this.getSubAccounts, "onError-event": this.handleOnError, columns: this.columns })));
+        return (h(StyledHost, { key: '73ac65b309e80186e0f7799385d012e91ceb1b8b' }, h("payouts-list-core", { key: 'f7767376f3155521445cb2ee48b9a20c362c8137', getPayouts: this.getPayouts, getPayoutCSV: this.getPayoutCSV, getSubAccounts: this.getSubAccounts, "onError-event": this.handleOnError, columns: this.columns })));
     }
     static get watchers() { return {
         "accountId": ["propChanged"],