@justifi/webcomponents 5.7.6-rc-04 → 5.7.6-rc-05

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

@@ -1,23 +1,22 @@
-import { r as registerInstance, c as createEvent, h } from './index-N3w5zrz2.js';
-import { S as StyledHost } from './styled-host-DtvbNFVU.js';
+import { r as registerInstance, c as createEvent, h } from './index-kpoIU4v_.js';
+import { S as StyledHost } from './styled-host-B_XBaM7z.js';
 import './event-types-CZfYo5-1.js';
-import { c as checkPkgVersion, J as JustifiAnalytics } from './check-pkg-version-CwPXpnQZ.js';
-import { d as defaultColumnsKeys } from './terminal-orders-table-Da4IvBtB.js';
-import './config-state-B3mtRA6f.js';
-import './dinero-DizZAUMY.js';
+import { c as checkPkgVersion, J as JustifiAnalytics } from './check-pkg-version-B7MJjFP4.js';
+import { d as defaultColumnsKeys } from './terminal-orders-table-CvK516_V.js';
+import './config-state-BrllxiM0.js';
+import './utils-B7jE0g5_.js';
 import { C as ComponentErrorSeverity, a as ComponentErrorCodes } from './ComponentError-Cjcsf8ku.js';
-import { i as TerminalOrder } from './Refund-DBHZkemk.js';
+import { g as TerminalOrder } from './Refund-4B3c-kLz.js';
 import './Pagination-CLHwhyvu.js';
+import './Payment-Bs0-9Lnt.js';
 import './Business-BCoP0TAV.js';
-import './Dispute-BH0Xfn-F.js';
+import './Dispute-7MWRbTXI.js';
 import { g as getErrorCode, a as getErrorMessage } from './utils-BeQLScSm.js';
-import { A as Api } from './Api-BCeKXDaf.js';
-import './package-HlNEzyiZ.js';
-import './parts-CKg_luIy.js';
-import './utils-Cu5hITuT.js';
-import './badge-BrapPg3R.js';
-import './index-BAq5IUBW.js';
-import './_commonjsHelpers-BFTU3MAI.js';
+import { A as Api } from './Api-DQM93PRm.js';
+import './package-BLtzn9pE.js';
+import './parts-D3G5aVLy.js';
+import './badge-D-vrtiQR.js';
+import './index-B9me4yN2.js';
 import './helpers-Mu7LQT-w.js';
 import './state-options-BX8GieXu.js';
 
@@ -101,7 +100,7 @@ const TerminalOrdersList = class {
         }
     }
     render() {
-        return (h(StyledHost, { key: 'e51250fa0af34799ed165080e8d0e1feb31cf6d8' }, h("terminal-orders-list-core", { key: 'b8f7b20bc976805fa522d3f85fe1382f1326381c', getTerminalOrders: this.getTerminalOrders, "onError-event": this.handleErrorEvent, columns: this.columns })));
+        return (h(StyledHost, { key: '2c853865fea3d5d1cbb531474e6caefdeb26bf75' }, h("terminal-orders-list-core", { key: '15591658366c6e127bb449c261dd980406025203', getTerminalOrders: this.getTerminalOrders, "onError-event": this.handleErrorEvent, columns: this.columns })));
     }
 };
 

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

@@ -1,19 +1,19 @@
-import { r as registerInstance, h } from './index-N3w5zrz2.js';
+import { r as registerInstance, h } from './index-kpoIU4v_.js';
 import { l as lodashExports } from './lodash-BqWxUrkh.js';
-import { f as filterParams, p as propsParams, c as clearParams } from './terminals-list-params-state-DFWVMJRJ.js';
-import { y as terminalsListFilterMenu, z as terminalIdTerminalsListFilterParam, A as terminalOrderIdTerminalsListFilterParam, B as terminalStatusTerminalsListFilterParam } from './parts-CKg_luIy.js';
-import { S as StyledHost } from './styled-host-DtvbNFVU.js';
+import { f as filterParams, p as propsParams, c as clearParams } from './terminals-list-params-state-SMXQIZTt.js';
+import { P as terminalsListFilterMenu, Q as terminalIdTerminalsListFilterParam, R as terminalOrderIdTerminalsListFilterParam, S as terminalStatusTerminalsListFilterParam } from './parts-D3G5aVLy.js';
+import { S as StyledHost } from './styled-host-B_XBaM7z.js';
 import './event-types-CZfYo5-1.js';
-import './config-state-B3mtRA6f.js';
-import './dinero-DizZAUMY.js';
+import './config-state-BrllxiM0.js';
+import './utils-B7jE0g5_.js';
 import './ComponentError-Cjcsf8ku.js';
-import { d as ITerminalStatus } from './Refund-DBHZkemk.js';
+import { c as ITerminalStatus } from './Refund-4B3c-kLz.js';
 import './Pagination-CLHwhyvu.js';
+import './Payment-Bs0-9Lnt.js';
 import './Business-BCoP0TAV.js';
-import './Dispute-BH0Xfn-F.js';
+import './Dispute-7MWRbTXI.js';
 import './_commonjsHelpers-BFTU3MAI.js';
-import './index-BAq5IUBW.js';
-import './utils-Cu5hITuT.js';
+import './index-B9me4yN2.js';
 import './helpers-Mu7LQT-w.js';
 import './state-options-BX8GieXu.js';
 
@@ -49,7 +49,7 @@ const TerminalsListFilters = class {
     }
     render() {
         const filterMenuParams = Object.assign({}, filterParams);
-        return (h(StyledHost, { key: '81ef3685f99ca6e33c2facd2bf22f186e54f3250' }, h("table-filters-menu", { key: '97218ed4bf43e21bde0f3ac282d77f584bb042b3', params: filterMenuParams, clearParams: clearParams, part: terminalsListFilterMenu }, h("div", { key: '2f1b8d3d55be6f3448c344a90ababc120723b453', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: 'ab5d8d959bb8541df3bba8e18775fc1ead7cac48', class: "p-2" }, h("form-control-text", { key: '26234bc40edef8e4cc3be2d83e8a9beeb8906eff', name: "terminal_id", label: "Terminal ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.terminalId || filterParams.terminal_id, disabled: !!this.terminalId, part: terminalIdTerminalsListFilterParam })), h("div", { key: '1cd238d705fc3222694e882a5848e4f5caadc254', class: "p-2" }, h("form-control-text", { key: 'a8d17bb259f0003207f16c328eebc0673e8c4377', name: "terminal_order_id", label: "Terminal Order ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.terminalOrderId || filterParams.terminal_order_id, disabled: !!this.terminalOrderId, part: terminalOrderIdTerminalsListFilterParam })), h("div", { key: 'fd1a215f7350a74dedd1eabd2c9ea3daaf72bea5', class: "p-2" }, h("form-control-select", { key: 'a2e14787e232b5415d2d4258e56e8618fd7a43bc', name: "status", label: "Status", options: this.terminalStatusOptions, inputHandler: this.setParamsOnChange, defaultValue: this.terminalStatus || filterParams.status, disabled: !!this.terminalStatus, part: terminalStatusTerminalsListFilterParam }))))));
+        return (h(StyledHost, { key: 'b32f589caa366ab175098680b68ed764097bd7f2' }, h("table-filters-menu", { key: '9461ce43a1fc7eb1ab9a75ea54c3fa577ac816fe', params: filterMenuParams, clearParams: clearParams, part: terminalsListFilterMenu }, h("div", { key: '4ecba8ce9973ea8776fd014e2aaa2075a1272bea', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: '9a765cad893566c25e17eb78fb7a915965ea89c7', class: "p-2" }, h("form-control-text", { key: '0fa90fc37d1ae5c240efc2edae27779cb130213e', name: "terminal_id", label: "Terminal ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.terminalId || filterParams.terminal_id, disabled: !!this.terminalId, part: terminalIdTerminalsListFilterParam })), h("div", { key: 'd62636bb773168feb620851aed46697fd5b1adab', class: "p-2" }, h("form-control-text", { key: 'c9ebb51bb99e03ce77b001b40596aa3f154abb94', name: "terminal_order_id", label: "Terminal Order ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.terminalOrderId || filterParams.terminal_order_id, disabled: !!this.terminalOrderId, part: terminalOrderIdTerminalsListFilterParam })), h("div", { key: 'e7d96f3b480c32ddd21a0b2984a602bc75af6e4c', class: "p-2" }, h("form-control-select", { key: '20bcd18f7310ac2b05ff9536107cb1435b3d99b3', name: "status", label: "Status", options: this.terminalStatusOptions, inputHandler: this.setParamsOnChange, defaultValue: this.terminalStatus || filterParams.status, disabled: !!this.terminalStatus, part: terminalStatusTerminalsListFilterParam }))))));
     }
 };
 

package/dist/esm/justifi-terminals-list.entry.js

@@ -1,27 +1,26 @@
-import { r as registerInstance, c as createEvent, h } from './index-N3w5zrz2.js';
+import { r as registerInstance, c as createEvent, h } from './index-kpoIU4v_.js';
 import { C as ComponentErrorSeverity, a as ComponentErrorCodes } from './ComponentError-Cjcsf8ku.js';
-import { c as checkPkgVersion, J as JustifiAnalytics } from './check-pkg-version-CwPXpnQZ.js';
-import { T as TerminalService } from './terminal.service-CnPV1i9J.js';
-import './config-state-B3mtRA6f.js';
-import './dinero-DizZAUMY.js';
-import { f as Terminal } from './Refund-DBHZkemk.js';
+import { c as checkPkgVersion, J as JustifiAnalytics } from './check-pkg-version-B7MJjFP4.js';
+import { T as TerminalService } from './terminal.service-BLeBxTv4.js';
+import './config-state-BrllxiM0.js';
+import './utils-B7jE0g5_.js';
+import { d as Terminal } from './Refund-4B3c-kLz.js';
 import './Pagination-CLHwhyvu.js';
+import './Payment-Bs0-9Lnt.js';
 import './Business-BCoP0TAV.js';
-import './Dispute-BH0Xfn-F.js';
+import './Dispute-7MWRbTXI.js';
 import { g as getErrorCode, a as getErrorMessage } from './utils-BeQLScSm.js';
-import { m as makeGetSubAccounts, S as SubAccountService } from './get-subaccounts-DrFpGKDV.js';
-import { S as StyledHost } from './styled-host-DtvbNFVU.js';
+import { m as makeGetSubAccounts, S as SubAccountService } from './get-subaccounts-C62B2OC_.js';
+import { S as StyledHost } from './styled-host-B_XBaM7z.js';
 import './event-types-CZfYo5-1.js';
-import { d as defaultColumnsKeys } from './terminals-table-BBPQRWja.js';
-import './package-HlNEzyiZ.js';
-import './Api-BCeKXDaf.js';
-import './utils-Cu5hITuT.js';
-import './index-BAq5IUBW.js';
-import './_commonjsHelpers-BFTU3MAI.js';
+import { d as defaultColumnsKeys } from './terminals-table-2QGQITkt.js';
+import './package-BLtzn9pE.js';
+import './Api-DQM93PRm.js';
+import './index-B9me4yN2.js';
 import './helpers-Mu7LQT-w.js';
 import './state-options-BX8GieXu.js';
-import './badge-BrapPg3R.js';
-import './parts-CKg_luIy.js';
+import './badge-D-vrtiQR.js';
+import './parts-D3G5aVLy.js';
 
 const makeGetTerminals = ({ id, authToken, service }) => async ({ params, onSuccess, onError }) => {
     var _a, _b;
@@ -107,7 +106,7 @@ const TerminalsList = class {
         }
     }
     render() {
-        return (h(StyledHost, { key: 'fe998292778d729620666188320650f3a25c5bda' }, h("terminals-list-core", { key: '94d37a1376da8694c78d6b6dfa20528d5c008e7f', getTerminals: this.getTerminals, getSubAccounts: this.getSubAccounts, "onError-event": this.handleErrorEvent, columns: this.columns })));
+        return (h(StyledHost, { key: '8645e44a4c7754b32faccc639a262d495cd1a0e0' }, h("terminals-list-core", { key: 'ffc7d495380aad7b5fabc7fdcdefcd6ec4fe10de', getTerminals: this.getTerminals, getSubAccounts: this.getSubAccounts, "onError-event": this.handleErrorEvent, columns: this.columns })));
     }
     static get watchers() { return {
         "accountId": ["propChanged"],

package/dist/esm/justifi-tokenize-payment-method.entry.js

@@ -1,267 +1,84 @@
-import { r as registerInstance, c as createEvent, h, a as getElement } from './index-N3w5zrz2.js';
-import { S as StyledHost } from './styled-host-DtvbNFVU.js';
+import { r as registerInstance, c as createEvent, h } from './index-kpoIU4v_.js';
+import { B as Button } from './button-DxM4-mlD.js';
+import { S as StyledHost } from './styled-host-B_XBaM7z.js';
 import './event-types-CZfYo5-1.js';
-import { c as checkPkgVersion, J as JustifiAnalytics } from './check-pkg-version-CwPXpnQZ.js';
-import { P as PaymentMethodTypes } from './Refund-DBHZkemk.js';
-import './config-state-B3mtRA6f.js';
-import './dinero-DizZAUMY.js';
-import { a as ComponentErrorCodes, C as ComponentErrorSeverity } from './ComponentError-Cjcsf8ku.js';
+import { c as checkPkgVersion, J as JustifiAnalytics } from './check-pkg-version-B7MJjFP4.js';
+import './config-state-BrllxiM0.js';
+import './utils-B7jE0g5_.js';
+import { C as ComponentErrorSeverity, a as ComponentErrorCodes } from './ComponentError-Cjcsf8ku.js';
+import './Refund-4B3c-kLz.js';
 import './Pagination-CLHwhyvu.js';
+import './Payment-Bs0-9Lnt.js';
 import './Business-BCoP0TAV.js';
-import './Dispute-BH0Xfn-F.js';
-import { c as checkoutStore } from './checkout.store-td03RV8y.js';
-import './package-HlNEzyiZ.js';
-import './Api-BCeKXDaf.js';
-import './utils-Cu5hITuT.js';
-import './index-BAq5IUBW.js';
-import './_commonjsHelpers-BFTU3MAI.js';
+import './Dispute-7MWRbTXI.js';
+import { c as checkoutStore } from './checkout.store-QrBBYQfi.js';
+import './parts-D3G5aVLy.js';
+import './package-BLtzn9pE.js';
+import './Api-DQM93PRm.js';
+import './index-B9me4yN2.js';
 import './helpers-Mu7LQT-w.js';
 import './state-options-BX8GieXu.js';
 
-// Constants
-const PAYMENT_METHOD_TYPE_LABELS = {
-    [PaymentMethodTypes.bankAccount]: 'New bank account',
-    [PaymentMethodTypes.card]: 'New credit or debit card',
-};
-const ERROR_MESSAGES = {
-    AUTH_TOKEN_REQUIRED: 'Auth token is required when using the tokenize-payment-method component not slotted in justifi-modular-checkout',
-    ACCOUNT_ID_REQUIRED: 'Account ID is required when using the tokenize-payment-method component not slotted in justifi-modular-checkout',
-    FORM_NOT_READY: 'Payment form not ready',
-    VALIDATION_ERROR: 'Validation error',
-};
 const TokenizePaymentMethod = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
         this.errorEvent = createEvent(this, "error-event");
         this.submitEvent = createEvent(this, "submit-event");
-        this.isLoading = false;
-        this.computedHideSubmitButton = false;
         this.submitButtonText = 'Submit';
+        this.isLoading = false;
     }
     componentWillLoad() {
         checkPkgVersion();
         this.analytics = new JustifiAnalytics(this);
-        this.validateRequiredProps();
-    }
-    connectedCallback() {
-        this.setDefaultSelectedPaymentMethod();
-        this.setComputedHideSubmitButton();
+        if (!this.authToken) {
+            this.authToken = checkoutStore.authToken;
+        }
+        if (!this.accountId) {
+            this.accountId = checkoutStore.accountId;
+        }
     }
     disconnectedCallback() {
         var _a;
         (_a = this.analytics) === null || _a === void 0 ? void 0 : _a.cleanup();
     }
-    paymentMethodsChanged() {
-        this.setDefaultSelectedPaymentMethod();
-    }
-    handleRadioClick(event) {
-        this.selectedPaymentMethodId = event.detail;
-    }
-    async fillBillingForm(fields) {
-        var _a;
-        (_a = this.billingFormRef) === null || _a === void 0 ? void 0 : _a.fill(fields);
-    }
+    ;
     async tokenizePaymentMethod(event) {
-        event === null || event === void 0 ? void 0 : event.preventDefault();
+        event && event.preventDefault();
         this.isLoading = true;
+        let tokenizeResponse;
         try {
-            const validation = await this.validate();
-            if (!validation.isValid) {
-                this.errorEvent.emit({
-                    errorCode: ComponentErrorCodes.TOKENIZE_ERROR,
-                    message: ERROR_MESSAGES.VALIDATION_ERROR,
-                });
-                this.isLoading = false;
-                return;
-            }
-            const tokenizeResponse = await this.resolvePaymentMethod({ isValid: true });
+            tokenizeResponse = await this.paymentMethodOptionsRef.resolvePaymentMethod({ isValid: true });
             if (tokenizeResponse.error) {
-                this.emitError({
+                this.errorEvent.emit({
                     errorCode: tokenizeResponse.error.code,
                     message: tokenizeResponse.error.message,
+                    severity: ComponentErrorSeverity.ERROR,
                 });
             }
-            this.submitEvent.emit({ response: tokenizeResponse });
-            return tokenizeResponse;
         }
         catch (error) {
-            const errorResponse = this.createErrorResponse(ComponentErrorCodes.TOKENIZE_ERROR, error.message);
-            this.emitError({
+            const errorData = {
                 errorCode: ComponentErrorCodes.TOKENIZE_ERROR,
                 message: error.message,
-            });
-            this.submitEvent.emit({ response: errorResponse });
-            return errorResponse;
+                severity: ComponentErrorSeverity.ERROR,
+            };
+            this.errorEvent.emit(errorData);
         }
         finally {
+            this.submitEvent.emit({ response: tokenizeResponse });
             this.isLoading = false;
+            return tokenizeResponse;
         }
     }
-    async validate() {
-        if (!this.areFormsReady()) {
-            return { isValid: false, errors: { general: ERROR_MESSAGES.FORM_NOT_READY } };
-        }
-        const [billingValidation, paymentMethodValidation] = await Promise.all([
-            this.billingFormRef.validate(),
-            this.paymentMethodFormRef.validate(),
-        ]);
-        return {
-            isValid: billingValidation.isValid && paymentMethodValidation.isValid,
-            errors: Object.assign(Object.assign({}, billingValidation.errors), paymentMethodValidation.errors),
-        };
-    }
-    validateRequiredProps() {
-        if (!this.authToken && !checkoutStore.authToken) {
-            this.emitError({
-                errorCode: ComponentErrorCodes.TOKENIZE_ERROR,
-                message: ERROR_MESSAGES.AUTH_TOKEN_REQUIRED,
-            });
-        }
-        if (!this.accountId && !checkoutStore.accountId) {
-            this.emitError({
-                errorCode: ComponentErrorCodes.TOKENIZE_ERROR,
-                message: ERROR_MESSAGES.ACCOUNT_ID_REQUIRED,
-            });
-        }
-    }
-    setDefaultSelectedPaymentMethod() {
-        if (!this.selectedPaymentMethodId) {
-            if (!this.disableCreditCard) {
-                this.selectedPaymentMethodId = PaymentMethodTypes.card;
-            }
-            else if (!this.disableBankAccount) {
-                this.selectedPaymentMethodId = PaymentMethodTypes.bankAccount;
-            }
-        }
-    }
-    setComputedHideSubmitButton() {
-        // If hideSubmitButton prop is explicitly set, use that value
-        if (this.hideSubmitButton !== undefined) {
-            this.computedHideSubmitButton = this.hideSubmitButton;
-            return;
-        }
-        // Otherwise, auto-detect if component is slotted within modular-checkout
-        const isWithinModularCheckout = this.isSlottedWithinModularCheckout();
-        this.computedHideSubmitButton = isWithinModularCheckout;
-    }
-    isSlottedWithinModularCheckout() {
-        var _a;
-        let parent = (_a = this.host) === null || _a === void 0 ? void 0 : _a.parentElement;
-        while (parent) {
-            if (parent.tagName === 'JUSTIFI-MODULAR-CHECKOUT') {
-                return true;
-            }
-            parent = parent.parentElement;
-        }
-        return false;
-    }
-    get availablePaymentMethods() {
-        const methods = [];
-        if (!this.disableCreditCard) {
-            methods.push(PaymentMethodTypes.card);
-        }
-        if (!this.disableBankAccount) {
-            methods.push(PaymentMethodTypes.bankAccount);
-        }
-        return methods;
-    }
-    areFormsReady() {
-        return !!(this.billingFormRef && this.paymentMethodFormRef);
-    }
-    emitError(errorData) {
-        this.errorEvent.emit(Object.assign(Object.assign({}, errorData), { severity: ComponentErrorSeverity.ERROR }));
-    }
-    createErrorResponse(code, message) {
-        return {
-            error: {
-                code: code,
-                message,
-                decline_code: undefined,
-            },
-        };
-    }
-    async resolvePaymentMethod(insuranceValidation) {
-        if (!this.areFormsReady()) {
-            return this.createErrorResponse('form_not_ready', ERROR_MESSAGES.FORM_NOT_READY);
-        }
-        try {
-            const validation = await this.validate();
-            if (!validation.isValid || !insuranceValidation.isValid) {
-                const errorMessage = Object.values(validation.errors)[0] || ERROR_MESSAGES.VALIDATION_ERROR;
-                return {
-                    validationError: true,
-                    error: {
-                        code: 'validation_error',
-                        message: String(errorMessage),
-                        decline_code: undefined,
-                    },
-                };
-            }
-            return await this.performTokenization();
-        }
-        catch (error) {
-            return { error };
-        }
-    }
-    async performTokenization() {
-        var _a, _b;
-        const tokenizeResponse = await this.tokenize();
-        if (tokenizeResponse.error) {
-            return { error: tokenizeResponse.error };
-        }
-        const tokenizeResponseData = tokenizeResponse.data;
-        return {
-            token: ((_a = tokenizeResponseData.card) === null || _a === void 0 ? void 0 : _a.token) || ((_b = tokenizeResponseData.bank_account) === null || _b === void 0 ? void 0 : _b.token),
-            data: tokenizeResponseData,
-        };
-    }
-    async tokenize() {
-        try {
-            const billingFormFieldValues = await this.billingFormRef.getValues();
-            const config = {
-                clientId: this.authToken || checkoutStore.authToken,
-                account: this.accountId || checkoutStore.accountId,
-                paymentMethodMetadata: this.buildPaymentMethodMetadata(billingFormFieldValues),
-            };
-            return await this.paymentMethodFormRef.tokenize(config);
-        }
-        catch (error) {
-            return error;
-        }
-    }
-    buildPaymentMethodMetadata(billingFormFieldValues) {
-        return this.shouldSavePaymentMethod
-            ? Object.assign(Object.assign({}, billingFormFieldValues), { payment_method_group_id: this.paymentMethodGroupID }) : Object.assign({}, billingFormFieldValues);
-    }
-    get paymentMethodGroupID() {
-        return this.paymentMethodGroupId || checkoutStore.paymentMethodGroupId;
-    }
-    get shouldSavePaymentMethod() {
-        return !!(this.paymentMethodGroupId || checkoutStore.savePaymentMethod);
-    }
-    get shouldHideRadioInput() {
-        const showCard = !this.disableCreditCard;
-        const showAch = !this.disableBankAccount;
-        return !showAch || !showCard;
-    }
-    renderPaymentMethodOption(paymentMethodType) {
-        const isSelected = this.selectedPaymentMethodId === paymentMethodType;
-        return (h("div", { class: "payment-method" }, h("justifi-radio-list-item", { name: "paymentMethodType", value: paymentMethodType, checked: isSelected, label: PAYMENT_METHOD_TYPE_LABELS[paymentMethodType], hidden: this.shouldHideRadioInput }), isSelected && this.renderSelectedPaymentMethodForm(paymentMethodType)));
-    }
-    renderSelectedPaymentMethodForm(paymentMethodId) {
-        return (h("div", { class: "mt-4 pb-4" }, this.renderPaymentMethodForm(paymentMethodId), h("justifi-billing-form", { ref: (el) => (this.billingFormRef = el), hideCardBillingForm: this.hideCardBillingForm, hideBankAccountBillingForm: this.hideBankAccountBillingForm, paymentMethodType: paymentMethodId }), h("justifi-save-new-payment-method", { hidden: !this.paymentMethodGroupID })));
+    async fillBillingForm(fields) {
+        this.paymentMethodOptionsRef.fillBillingForm(fields);
     }
-    renderPaymentMethodForm(paymentMethodId) {
-        return paymentMethodId === PaymentMethodTypes.card ? (h("justifi-card-form", { ref: (el) => (this.paymentMethodFormRef = el) })) : (h("justifi-bank-account-form", { ref: (el) => (this.paymentMethodFormRef = el) }));
+    async validate() {
+        return this.paymentMethodOptionsRef.validate();
     }
     render() {
-        return (h(StyledHost, { key: 'b8cf3e66f93bf1b1dd2c3116781ddf0168cbd4e7' }, h("form", { key: '70ad04762a32e930b6b96c2d8609577cd5d1e8d6' }, h("fieldset", { key: 'f7a7d53512b3d034999b18b666381c2df04f082b' }, h("div", { key: '6e5be958e583399ac733aefe4ddf935f5aec98df', class: "row gy-3" }, h("div", { key: '2d81034d2d95532a18bef58cdd1635b1d3b1d735', class: "col-12" }, this.availablePaymentMethods.map((method) => this.renderPaymentMethodOption(method))), h("div", { key: 'a791aac6520c187fd336012d97c976ece891edeb', class: "col-12" }, h("justifi-button", { key: '9ff1733b1811fea31b1e4dc41694db4eb40be14c', text: this.submitButtonText, variant: "primary", type: "submit", clickHandler: (e) => this.tokenizePaymentMethod(e), isLoading: this.isLoading, "data-testid": "submit-button", hidden: this.computedHideSubmitButton })))))));
+        return (h(StyledHost, { key: '6e7b234e3765b82dfe2451544921e3f6a96f7dec' }, h("form", { key: 'df5d244cae1b7204928e6c67a53901fa9bce0c23' }, h("fieldset", { key: '792d260c13b348c00f0859ee715ff72e849333e1' }, h("div", { key: 'e75ce50e15fa074b31436fd1a031a1edb7be399d', class: "row gy-3" }, h("div", { key: '34d1c5d25ad741acb0c91320018c8ec789d6fba4', class: "col-12" }, h("justifi-payment-method-options", { key: '08cbb9393087384d9605414694e905b1a293db98', ref: (el) => (this.paymentMethodOptionsRef = el), "show-card": !this.disableCreditCard, "show-ach": !this.disableBankAccount, "show-bnpl": false, paymentMethodGroupId: this.paymentMethodGroupId, "show-saved-payment-methods": false, hideCardBillingForm: this.hideCardBillingForm, hideBankAccountBillingForm: this.hideBankAccountBillingForm, authToken: this.authToken, "account-id": this.accountId })), h("div", { key: '3cc39e4b7c637ad3876ed8b20aaba656552e04dd', class: "col-12" }, h(Button, { key: 'ef5a9a545a8765666026400f8e6b23aa919521fb', variant: "primary", type: "submit", onClick: event => this.tokenizePaymentMethod(event), isLoading: this.isLoading, "data-testid": "submit-button", hidden: this.hideSubmitButton }, this.submitButtonText)))))));
     }
-    get host() { return getElement(this); }
-    static get watchers() { return {
-        "disableCreditCard": ["paymentMethodsChanged"],
-        "disableBankAccount": ["paymentMethodsChanged"]
-    }; }
 };
 
 export { TokenizePaymentMethod as justifi_tokenize_payment_method };