@justifi/webcomponents 4.17.0 → 4.18.0

package/dist/collection/components/payment-form/payment-form.js

@@ -1,10 +1,11 @@
-import { h, Host } from "@stencil/core";
+import { h } from "@stencil/core";
 import { PaymentMethodTypes } from "../../api";
 import { loadFontsOnParent } from "../../utils/utils";
 import { config } from "../../../config";
 import { ComponentErrorCodes, ComponentErrorSeverity } from "../../api/ComponentError";
 import { getErrorMessage } from "../../api/services/utils";
 import JustifiAnalytics from "../../api/Analytics";
+import StyledHost from "../../utils/styled-host/styled-host";
 export class PaymentForm {
     constructor() {
         this.bankAccount = undefined;
@@ -105,15 +106,15 @@ export class PaymentForm {
         }
     }
     render() {
-        return (h(Host, { key: '6bb1d061cfc89f6b2c501b9d817316d5ffc157a3' }, h("form", { key: '4b53b443d2634bfb6c4c9fdeea8362928ec58a1f', class: "row gy-3" }, this.showPaymentMethodTypeSelector() && (h("div", { key: '53cf08073c4b1562f031633d830d67aad36bcb78', class: "col-12" }, h("justifi-payment-method-selector", { key: 'ab7c6e69cb9c1529359c3f318ae8db5a31208b39', selectedPaymentMethodType: this.getSelectedPaymentMethodType(), onPaymentMethodSelected: event => this.paymentMethodSelectedHandler(event) }))), h("div", { key: '351d228acfb01c41217fc60b70d388bdc0a1b44e', class: "col-12" }, h("justifi-payment-method-form", { key: '4a705248eb3ca4b996ed04f27f0f45b06cca27e6', "payment-method-form-type": this.getSelectedPaymentMethodType(), iframeOrigin: config.iframeOrigin, ref: el => {
+        return (h(StyledHost, { key: '3aa9fa4d429ca4b614d51b87b51b1ab868d051e2' }, h("form", { key: '53a0ad2a960971fafb618d5be58af120336b36b9', class: "row gy-3" }, this.showPaymentMethodTypeSelector() && (h("div", { key: 'b322cbe24fcbd81008ccf3a6e587786c0b7febd6', class: "col-12" }, h("justifi-payment-method-selector", { key: '8e77f5e040a73096765c30f1f259f87630ec80a8', selectedPaymentMethodType: this.getSelectedPaymentMethodType(), onPaymentMethodSelected: event => this.paymentMethodSelectedHandler(event) }))), h("div", { key: '415f380e141eea4486fd47b4b2cbfcc7716ecacc', class: "col-12" }, h("justifi-payment-method-form", { key: 'cd4da9f66a030ab344be989a511e23462e3da887', "payment-method-form-type": this.getSelectedPaymentMethodType(), iframeOrigin: config.iframeOrigin, ref: el => {
                 if (el) {
                     this.paymentMethodFormRef = el;
                 }
-            } })), h("div", { key: '4c3993a6bfcd2dc84ef021247d90b7613fb7a1d8', class: "col-12" }, h("justifi-billing-form", { key: 'e8ec1a4841da81fa35b1f059ab6e657cb3ecc164', legend: "Billing Info", ref: el => {
+            } })), h("div", { key: '31eefc5775131f658987578da2d5b300292f67b5', class: "col-12" }, h("justifi-billing-form", { key: '11b9bdaa9c1fb26804fcdacfd3706b200ae49486', legend: "Billing Info", ref: el => {
                 if (el) {
                     this.billingFormRef = el;
                 }
-            } })), h("slot", { key: 'd4db0a59c4c1fa443d455b25320f310da4688464', name: 'insurance' }), h("div", { key: 'ef9170b0d2745093a7e37f0e00b1369fd77c48e0', class: "col-12" }, h("button", { key: '88ad7f14aacf59a7a07a383f8638d39abb051495', "data-testid": "submit-button", type: "submit", onClick: event => this.submit(event), disabled: !this.submitButtonEnabled || this.isLoading, class: `btn btn-primary jfi-submit-button${this.isLoading ? ' jfi-submit-button-loading' : ''}` }, this.isLoading ?
+            } })), h("slot", { key: '13fe093886828469c941d21c20c931c5cc2cae3d', name: 'insurance' }), h("div", { key: 'a77d44c79333303e59f3efb5c82db9e8830bfcdb', class: "col-12" }, h("button", { key: '50edd44047c81109f075e9ae760e58878b422fbc', "data-testid": "submit-button", type: "submit", onClick: event => this.submit(event), disabled: !this.submitButtonEnabled || this.isLoading, class: `btn btn-primary jfi-submit-button${this.isLoading ? ' jfi-submit-button-loading' : ''}` }, this.isLoading ?
             h("div", { class: "spinner-border spinner-border-sm", role: "status" }, h("span", { class: "visually-hidden" }, "Loading...")) :
             this.submitButtonText || 'Submit')))));
     }
@@ -121,7 +122,7 @@ export class PaymentForm {
     static get encapsulation() { return "shadow"; }
     static get originalStyleUrls() {
         return {
-            "$": ["payment-form.scss"]
+            "$": ["payment-form.css"]
         };
     }
     static get styleUrls() {