@justifi/webcomponents 4.7.1 → 4.7.2-rc.0

package/dist/cjs/{Payout-68a99ee3.js → Payout-f8240e9c.js}

@@ -26,6 +26,54 @@ var PaymentDisputedStatuses;
   PaymentDisputedStatuses["lost"] = "lost";
   PaymentDisputedStatuses["open"] = "open";
 })(PaymentDisputedStatuses || (PaymentDisputedStatuses = {}));
+class PaymentMethod {
+  constructor(paymentMethod) {
+    this.card = paymentMethod.card ? new Card(paymentMethod.card) : undefined;
+    this.bank_account = paymentMethod.bank_account
+      ? new BankAccount(paymentMethod.bank_account)
+      : undefined;
+  }
+  get payersName() {
+    if (this.card) {
+      return this.card.name;
+    }
+    else if (this.bank_account) {
+      return this.bank_account.name;
+    }
+    return null;
+  }
+  get lastFourDigits() {
+    if (this.card) {
+      return `**** ${this.card.acct_last_four}`;
+    }
+    else if (this.bank_account) {
+      return `**** ${this.bank_account.acct_last_four}`;
+    }
+    return null;
+  }
+}
+class BankAccount {
+  constructor(bankAccount) {
+    this.id = bankAccount.id;
+    this.acct_last_four = bankAccount.acct_last_four;
+    this.name = bankAccount.name;
+    this.brand = bankAccount.brand;
+    this.token = bankAccount.token;
+    this.created_at = bankAccount.created_at;
+    this.updated_at = bankAccount.updated_at;
+  }
+}
+class Card {
+  constructor(card) {
+    this.id = card.id || '';
+    this.acct_last_four = card.acct_last_four;
+    this.name = card.name;
+    this.brand = card.brand;
+    this.token = card.token;
+    this.created_at = card.created_at;
+    this.updated_at = card.updated_at;
+  }
+}
 class Payment {
   constructor(payment) {
     this.id = payment.id;
@@ -46,7 +94,7 @@ class Payment {
     this.fee_amount = payment.fee_amount;
     this.is_test = payment.is_test;
     this.metadata = payment.metadata;
-    this.payment_method = payment.payment_method;
+    this.payment_method = new PaymentMethod(payment.payment_method);
     this.payment_intent_id = payment.payment_intent_id;
     this.refunded = payment.refunded;
     this.status = payment.status;

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

@@ -69,8 +69,8 @@ const JustifiRepresentativeDetails = class {
     this.representative = undefined;
   }
   render() {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
-    return (index.h(index.Host, null, index.h(utils.DetailSection, { sectionTitle: "Representative Details" }, index.h("div", { class: "row gy-3" }, index.h("div", { class: "col-12 col-md-6" }, index.h(utils.DetailItem, { title: "Name", value: (_a = this.representative) === null || _a === void 0 ? void 0 : _a.name }), index.h(utils.DetailItem, { title: "ID", value: (_b = this.representative) === null || _b === void 0 ? void 0 : _b.id }), index.h(utils.DetailItem, { title: "Representative Address", value: (_c = this.representative) === null || _c === void 0 ? void 0 : _c.address.line1 }), index.h(utils.DetailItem, { title: "Representative Created At", value: utils$1.formatMediumDate((_d = this.representative) === null || _d === void 0 ? void 0 : _d.created_at) })), index.h("div", { class: "col-12 col-md-6" }, index.h(utils.DetailItem, { title: "Title", value: (_e = this.representative) === null || _e === void 0 ? void 0 : _e.title }), index.h(utils.DetailItem, { title: "Is Owner?", value: (_f = this.representative) === null || _f === void 0 ? void 0 : _f.is_owner.toString() }), index.h(utils.DetailItem, { title: "Date Of Birth", value: utils$1.formatMediumDate(new Date(Number((_g = this.representative) === null || _g === void 0 ? void 0 : _g.dob_year), Number((_h = this.representative) === null || _h === void 0 ? void 0 : _h.dob_month) - 1, Number((_j = this.representative) === null || _j === void 0 ? void 0 : _j.dob_day))) }), index.h(utils.DetailItem, { title: "Email", value: (_k = this.representative) === null || _k === void 0 ? void 0 : _k.email }), index.h(utils.DetailItem, { title: "Phone", value: (_l = this.representative) === null || _l === void 0 ? void 0 : _l.phone }), index.h(utils.DetailItem, { title: "Representative Updated At", value: utils$1.formatMediumDate((_m = this.representative) === null || _m === void 0 ? void 0 : _m.updated_at) }))))));
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
+    return (index.h(index.Host, null, index.h(utils.DetailSection, { sectionTitle: "Representative Details" }, index.h("div", { class: "row gy-3" }, index.h("div", { class: "col-12 col-md-6" }, index.h(utils.DetailItem, { title: "Name", value: (_a = this.representative) === null || _a === void 0 ? void 0 : _a.name }), index.h(utils.DetailItem, { title: "ID", value: (_b = this.representative) === null || _b === void 0 ? void 0 : _b.id }), index.h(utils.DetailItem, { title: "Representative Address", value: (_c = this.representative) === null || _c === void 0 ? void 0 : _c.address.line1 }), index.h(utils.DetailItem, { title: "Created At", value: ((_d = this.representative) === null || _d === void 0 ? void 0 : _d.created_at) && utils$1.formatMediumDate((_e = this.representative) === null || _e === void 0 ? void 0 : _e.created_at) })), index.h("div", { class: "col-12 col-md-6" }, index.h(utils.DetailItem, { title: "Title", value: (_f = this.representative) === null || _f === void 0 ? void 0 : _f.title }), index.h(utils.DetailItem, { title: "Is Owner?", value: (_g = this.representative) === null || _g === void 0 ? void 0 : _g.is_owner.toString() }), index.h(utils.DetailItem, { title: "Date Of Birth", value: this.representative && utils$1.formatMediumDate(new Date(Number((_h = this.representative) === null || _h === void 0 ? void 0 : _h.dob_year), Number((_j = this.representative) === null || _j === void 0 ? void 0 : _j.dob_month) - 1, Number((_k = this.representative) === null || _k === void 0 ? void 0 : _k.dob_day))) }), index.h(utils.DetailItem, { title: "Email", value: (_l = this.representative) === null || _l === void 0 ? void 0 : _l.email }), index.h(utils.DetailItem, { title: "Phone", value: (_m = this.representative) === null || _m === void 0 ? void 0 : _m.phone }), index.h(utils.DetailItem, { title: "Updated At", value: this.representative && utils$1.formatMediumDate((_o = this.representative) === null || _o === void 0 ? void 0 : _o.updated_at) }))))));
   }
 };
 JustifiRepresentativeDetails.style = representativeDetailsCss;

package/dist/cjs/form-control-datepart_2.cjs.entry.js

@@ -57,7 +57,7 @@ const DatePartInput = class {
   }
   updateInput(newValue) {
     if (this.imask) {
-      this.imask.value = newValue;
+      this.imask.value = String(newValue);
     }
   }
   disconnectedCallback() {

package/dist/cjs/justifi-business-details.cjs.entry.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-c5ace247.js');
 const Api = require('./Api-548eaa62.js');
 require('./Pagination-cae1dcbd.js');
-require('./Payout-68a99ee3.js');
+require('./Payout-f8240e9c.js');
 const utils = require('./utils-4622829d.js');
 const config = require('./config-a156df17.js');
 
@@ -26,15 +26,16 @@ const BusinessDetails = class {
     this.renderState = RENDER_STATES.LOADING;
     this.errorMessage = 'An error ocurred.';
     this.fetchBusiness = this.fetchBusiness.bind(this);
-    this.setError = this.setError.bind(this);
   }
   async componentWillLoad() {
     if (!this.authToken) {
-      this.setError('Missing auth-token. The form will not be functional without it.');
+      this.errorMessage = 'Missing auth-token. The form will not be functional without it.';
+      console.error(this.errorMessage);
       return;
     }
     if (!this.businessId) {
-      this.setError('Missing business-id. The form will not be functional without it.');
+      this.errorMessage = 'Missing business-id. The form will not be functional without it.';
+      console.error(this.errorMessage);
       return;
     }
     this.api = Api.Api(this.authToken, config.config.proxyApiOrigin);
@@ -45,27 +46,30 @@ const BusinessDetails = class {
     try {
       const response = await this.api.get(`entities/business/${businessId}`);
       if (response.error) {
-        this.setError(response.error.message);
+        this.errorMessage = `${this.errorMessage}: ${response.error}`;
+        console.error(this.errorMessage);
+        this.renderState = RENDER_STATES.ERROR;
         return;
       }
       this.business = response.data;
       this.renderState = RENDER_STATES.READY;
     }
     catch (error) {
-      this.setError(error);
+      this.errorMessage = `${this.errorMessage}: ${error}`;
+      console.error(this.errorMessage);
+      this.renderState = RENDER_STATES.ERROR;
+    }
+    finally {
+      this.renderState = RENDER_STATES.READY;
     }
-  }
-  setError(error) {
-    this.errorMessage = error || this.errorMessage;
-    this.renderState = RENDER_STATES.ERROR;
   }
   render() {
     var _a, _b, _c;
     if (this.renderState === RENDER_STATES.LOADING) {
-      return utils.LoadingState;
+      return index.h(index.Host, null, utils.LoadingState);
     }
     if (this.renderState === RENDER_STATES.ERROR) {
-      return utils.ErrorState(this.errorMessage);
+      return index.h(index.Host, null, utils.ErrorState(this.errorMessage));
     }
     return (index.h(index.Host, null, index.h("generic-info-details", { business: this.business }), index.h("legal-address-details", { legalAddress: (_a = this.business) === null || _a === void 0 ? void 0 : _a.legal_address }), index.h("representative-details", { representative: (_b = this.business) === null || _b === void 0 ? void 0 : _b.representative }), index.h("owner-details", { owners: (_c = this.business) === null || _c === void 0 ? void 0 : _c.owners }), index.h("additional-questions-details", { business: this.business })));
   }

package/dist/cjs/justifi-business-form-stepped.cjs.entry.js

@@ -7,7 +7,7 @@ const form = require('./form-1e732a9d.js');
 const businessFormSchema = require('./business-form-schema-fe831c30.js');
 const Api = require('./Api-548eaa62.js');
 require('./Pagination-cae1dcbd.js');
-require('./Payout-68a99ee3.js');
+require('./Payout-f8240e9c.js');
 const helpers = require('./helpers-c505d861.js');
 const config = require('./config-a156df17.js');
 require('./index.esm-91ec051e.js');

package/dist/cjs/justifi-business-form.cjs.entry.js

@@ -7,7 +7,7 @@ const form = require('./form-1e732a9d.js');
 const businessFormSchema = require('./business-form-schema-fe831c30.js');
 const Api = require('./Api-548eaa62.js');
 require('./Pagination-cae1dcbd.js');
-require('./Payout-68a99ee3.js');
+require('./Payout-f8240e9c.js');
 const helpers = require('./helpers-c505d861.js');
 const config = require('./config-a156df17.js');
 require('./index.esm-91ec051e.js');

package/dist/cjs/justifi-business-list.cjs.entry.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-c5ace247.js');
 const Api = require('./Api-548eaa62.js');
 const Pagination = require('./Pagination-cae1dcbd.js');
-require('./Payout-68a99ee3.js');
+require('./Payout-f8240e9c.js');
 const utils = require('./utils-13d069be.js');
 const config = require('./config-a156df17.js');
 

package/dist/cjs/justifi-gross-payment-chart.cjs.entry.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-c5ace247.js');
 const Api = require('./Api-548eaa62.js');
 require('./Pagination-cae1dcbd.js');
-require('./Payout-68a99ee3.js');
+require('./Payout-f8240e9c.js');
 const utils = require('./utils-13d069be.js');
 const utils$1 = require('./utils-4622829d.js');
 const config = require('./config-a156df17.js');
@@ -10994,15 +10994,27 @@ const GrossPaymentChart = class {
       return;
     }
     this.loading = true;
-    const api = Api.Api(this.authToken, config.config.proxyApiOrigin);
-    const endpoint = `account/${this.accountId}/reports/gross_volume`;
-    const response = await api.get(endpoint);
-    if (!response.error) {
-      this.total = response === null || response === void 0 ? void 0 : response.data.total;
-      this.dates = response === null || response === void 0 ? void 0 : response.data.dates.reverse();
-      this.endDate = this.dates[this.dates.length - 1].date;
-    }
-    this.loading = false;
+    try {
+      const api = Api.Api(this.authToken, config.config.proxyApiOrigin);
+      const endpoint = `account/${this.accountId}/reports/gross_volume`;
+      const response = await api.get(endpoint);
+      if (!response.error) {
+        this.total = response === null || response === void 0 ? void 0 : response.data.total;
+        this.dates = response === null || response === void 0 ? void 0 : response.data.dates.reverse();
+        this.endDate = this.dates[this.dates.length - 1].date;
+      }
+      else {
+        this.errorMessage = `Error trying to fetch data : ${response.error}`;
+        console.error(this.errorMessage);
+      }
+    }
+    catch (error) {
+      this.errorMessage = `Error trying to fetch data : ${error}`;
+      console.error(this.errorMessage);
+    }
+    finally {
+      this.loading = false;
+    }
   }
   renderChart() {
     if (this.chart) {

package/dist/cjs/justifi-payment-balance-transactions.cjs.entry.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-c5ace247.js');
 const Api = require('./Api-548eaa62.js');
 const Pagination = require('./Pagination-cae1dcbd.js');
-const Payout = require('./Payout-68a99ee3.js');
+const Payout = require('./Payout-f8240e9c.js');
 const utils = require('./utils-13d069be.js');
 const config = require('./config-a156df17.js');
 

package/dist/cjs/justifi-payment-details.cjs.entry.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-c5ace247.js');
 const Api = require('./Api-548eaa62.js');
 require('./Pagination-cae1dcbd.js');
-require('./Payout-68a99ee3.js');
+const Payout = require('./Payout-f8240e9c.js');
 const utils$1 = require('./utils-13d069be.js');
 const utils = require('./utils-4622829d.js');
 const config = require('./config-a156df17.js');
@@ -28,26 +28,35 @@ const PaymentDetails = class {
     this.fetchData();
   }
   async fetchData() {
-    this.errorMessage = '';
     if (!this.paymentId || !this.authToken) {
       this.errorMessage = "Can not fetch any data without a PaymentID and an AuthToken";
       this.loading = false;
       return;
     }
     this.loading = true;
-    const endpoint = `payments/${this.paymentId}`;
-    const response = await Api.Api(this.authToken, config.config.proxyApiOrigin).get(endpoint);
-    if (!response.error) {
-      this.payment = response.data;
+    try {
+      const endpoint = `payments/${this.paymentId}`;
+      const response = await Api.Api(this.authToken, config.config.proxyApiOrigin).get(endpoint);
+      if (!response.error) {
+        this.payment = new Payout.Payment(response.data);
+      }
+      else {
+        const responseError = typeof response.error === 'string' ? response.error : response.error.message;
+        this.errorMessage = `Error trying to fetch data : ${responseError}`;
+        console.error(this.errorMessage);
+      }
     }
-    else {
-      this.errorMessage = typeof response.error === 'string' ? response.error : response.error.message;
+    catch (error) {
+      this.errorMessage = `Error trying to fetch data : ${error}`;
+      console.error(this.errorMessage);
+    }
+    finally {
+      this.loading = false;
     }
-    this.loading = false;
   }
   render() {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1;
-    return (index.h(index.Host, null, this.loading && utils.LoadingState, !this.loading && this.errorMessage && utils.ErrorState(this.errorMessage), !this.loading && this.payment && (index.h("justifi-details", { "error-message": this.errorMessage }, index.h(utils.EntityHeadInfo, { slot: "head-info", badge: index.h("span", { slot: 'badge', innerHTML: utils$1.MapPaymentStatusToBadge((_a = this.payment) === null || _a === void 0 ? void 0 : _a.status) }), title: `${utils$1.formatCurrency(this.payment.amount)} ${this.payment.currency.toUpperCase()}` }, index.h(utils.EntityHeadInfoItem, { classes: "border-1 border-end", title: "Updated At", value: `${utils$1.formatDate((_b = this.payment) === null || _b === void 0 ? void 0 : _b.updated_at)} ${utils$1.formatTime((_c = this.payment) === null || _c === void 0 ? void 0 : _c.updated_at)}` }), index.h(utils.EntityHeadInfoItem, { classes: "border-1 border-end", title: "Created At", value: `${utils$1.formatDate((_d = this.payment) === null || _d === void 0 ? void 0 : _d.created_at)} ${utils$1.formatTime((_e = this.payment) === null || _e === void 0 ? void 0 : _e.created_at)}` }), index.h(utils.EntityHeadInfoItem, { title: "ID", value: (_f = this.payment) === null || _f === void 0 ? void 0 : _f.id })), index.h("div", { slot: 'detail-sections' }, index.h(utils.DetailSection, { sectionTitle: "Details" }, index.h(utils.DetailItem, { title: "Amount", value: utils$1.formatCurrency((_g = this.payment) === null || _g === void 0 ? void 0 : _g.amount) }), index.h(utils.DetailItem, { title: "Fees", value: utils$1.formatCurrency((_h = this.payment) === null || _h === void 0 ? void 0 : _h.fee_amount) }), index.h(utils.DetailItem, { title: "Refunded", value: utils$1.formatCurrency((_j = this.payment) === null || _j === void 0 ? void 0 : _j.amount_refunded) }), index.h(utils.DetailItem, { title: "Net", value: utils$1.formatCurrency((_k = this.payment) === null || _k === void 0 ? void 0 : _k.balance) }), index.h(utils.DetailItem, { title: "Status", value: utils$1.MapPaymentStatusToBadge((_l = this.payment) === null || _l === void 0 ? void 0 : _l.status) }), index.h(utils.DetailItem, { title: "Payment ID", value: (_m = this.payment) === null || _m === void 0 ? void 0 : _m.id }), index.h(utils.DetailItem, { title: "Processing Fees", value: utils$1.formatCurrency((_o = this.payment) === null || _o === void 0 ? void 0 : _o.fee_amount) }), index.h(utils.DetailItem, { title: "Statement Descriptor", value: (_p = this.payment) === null || _p === void 0 ? void 0 : _p.statement_descriptor }), index.h(utils.DetailItem, { title: "Description", value: (_q = this.payment) === null || _q === void 0 ? void 0 : _q.description })), ((_r = this.payment) === null || _r === void 0 ? void 0 : _r.payment_method.card) && (index.h(utils.DetailSection, { sectionTitle: "Payment Method" }, index.h(utils.DetailItem, { title: "ID", value: (_s = this.payment) === null || _s === void 0 ? void 0 : _s.payment_method.card.id }), index.h(utils.DetailItem, { title: "Payment Type", value: "Card" }), index.h(utils.DetailItem, { title: "Last 4 Numbers", value: (_t = this.payment) === null || _t === void 0 ? void 0 : _t.payment_method.card.acct_last_four }), index.h(utils.DetailItem, { title: "Brand", value: (_u = this.payment) === null || _u === void 0 ? void 0 : _u.payment_method.card.brand }), index.h(utils.DetailItem, { title: "Cardholder", value: (_v = this.payment) === null || _v === void 0 ? void 0 : _v.payment_method.card.name }))), ((_w = this.payment) === null || _w === void 0 ? void 0 : _w.payment_method.bank_account) && (index.h(utils.DetailSection, { sectionTitle: "Payment Method" }, index.h(utils.DetailItem, { title: "ID", value: (_x = this.payment) === null || _x === void 0 ? void 0 : _x.payment_method.bank_account.id }), index.h(utils.DetailItem, { title: "Last 4 Numbers", value: (_y = this.payment) === null || _y === void 0 ? void 0 : _y.payment_method.bank_account.acct_last_four }), index.h(utils.DetailItem, { title: "Bank Name", value: (_z = this.payment) === null || _z === void 0 ? void 0 : _z.payment_method.bank_account.bank_name }), index.h(utils.DetailItem, { title: "Account Owner", value: (_0 = this.payment) === null || _0 === void 0 ? void 0 : _0.payment_method.bank_account.account_owner_name }))), index.h(utils.DetailSection, { sectionTitle: 'Metadata' }, index.h(utils.CodeBlock, { metadata: (_1 = this.payment) === null || _1 === void 0 ? void 0 : _1.metadata })))))));
+    return (index.h(index.Host, null, this.loading && utils.LoadingState, !this.loading && this.errorMessage && utils.ErrorState(this.errorMessage), !this.loading && !this.errorMessage &&
+      this.payment && (index.h("justifi-details", { "error-message": this.errorMessage }, index.h(utils.EntityHeadInfo, { slot: "head-info", badge: index.h("span", { slot: 'badge', innerHTML: utils$1.MapPaymentStatusToBadge(this.payment.status) }), title: `${utils$1.formatCurrency(this.payment.amount)} ${this.payment.currency.toUpperCase()}` }, index.h(utils.EntityHeadInfoItem, { classes: "border-1 border-end", title: "Updated At", value: `${utils$1.formatDate(this.payment.updated_at)} ${utils$1.formatTime(this.payment.updated_at)}` }), index.h(utils.EntityHeadInfoItem, { classes: "border-1 border-end", title: "Created At", value: `${utils$1.formatDate(this.payment.created_at)} ${utils$1.formatTime(this.payment.created_at)}` }), index.h(utils.EntityHeadInfoItem, { title: "ID", value: this.payment.id })), index.h("div", { slot: 'detail-sections' }, index.h(utils.DetailSection, { sectionTitle: "Details" }, index.h(utils.DetailItem, { title: "Amount", value: utils$1.formatCurrency(this.payment.amount) }), index.h(utils.DetailItem, { title: "Fees", value: utils$1.formatCurrency(this.payment.fee_amount) }), index.h(utils.DetailItem, { title: "Refunded", value: utils$1.formatCurrency(this.payment.amount_refunded) }), index.h(utils.DetailItem, { title: "Net", value: utils$1.formatCurrency(this.payment.balance) }), index.h(utils.DetailItem, { title: "Status", value: utils$1.MapPaymentStatusToBadge(this.payment.status) }), index.h(utils.DetailItem, { title: "Payment ID", value: this.payment.id }), index.h(utils.DetailItem, { title: "Processing Fees", value: utils$1.formatCurrency(this.payment.fee_amount) }), index.h(utils.DetailItem, { title: "Statement Descriptor", value: this.payment.statement_descriptor }), index.h(utils.DetailItem, { title: "Description", value: this.payment.description })), this.payment.payment_method.card && (index.h(utils.DetailSection, { sectionTitle: "Payment Method" }, index.h(utils.DetailItem, { title: "ID", value: this.payment.payment_method.card.id }), index.h(utils.DetailItem, { title: "Payment Type", value: "Card" }), index.h(utils.DetailItem, { title: "Last 4 Numbers", value: this.payment.payment_method.lastFourDigits }), index.h(utils.DetailItem, { title: "Brand", value: utils$1.snakeCaseToHumanReadable(this.payment.payment_method.card.brand) }), index.h(utils.DetailItem, { title: "Cardholder", value: this.payment.payment_method.payersName }))), this.payment.payment_method.bank_account && (index.h(utils.DetailSection, { sectionTitle: "Payment Method" }, index.h(utils.DetailItem, { title: "ID", value: this.payment.payment_method.bank_account.id }), index.h(utils.DetailItem, { title: "Last 4 Numbers", value: this.payment.payment_method.lastFourDigits }), index.h(utils.DetailItem, { title: "Bank Name", value: this.payment.payment_method.bank_account.brand }), index.h(utils.DetailItem, { title: "Account Owner", value: this.payment.payment_method.payersName }))), index.h(utils.DetailSection, { sectionTitle: 'Metadata' }, index.h(utils.CodeBlock, { metadata: this.payment.metadata })))))));
   }
   static get watchers() { return {
     "paymentId": ["updateOnPropChange"],

package/dist/cjs/justifi-payment-form.cjs.entry.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-c5ace247.js');
 require('./Pagination-cae1dcbd.js');
-const Payout = require('./Payout-68a99ee3.js');
+const Payout = require('./Payout-f8240e9c.js');
 const utils = require('./utils-13d069be.js');
 
 const paymentFormCss = ":root,[data-bs-theme=light]{--bs-blue:#0d6efd;--bs-indigo:#6610f2;--bs-purple:#6f42c1;--bs-pink:#d63384;--bs-red:#dc3545;--bs-orange:#fd7e14;--bs-yellow:#ffc107;--bs-green:#198754;--bs-teal:#20c997;--bs-cyan:#0dcaf0;--bs-black:#000;--bs-white:#fff;--bs-gray:#6c757d;--bs-gray-dark:#343a40;--bs-gray-100:#f8f9fa;--bs-gray-200:#e9ecef;--bs-gray-300:#dee2e6;--bs-gray-400:#ced4da;--bs-gray-500:#adb5bd;--bs-gray-600:#6c757d;--bs-gray-700:#495057;--bs-gray-800:#343a40;--bs-gray-900:#212529;--bs-primary:#0d6efd;--bs-secondary:#6c757d;--bs-success:#198754;--bs-info:#0dcaf0;--bs-warning:#ffc107;--bs-danger:#dc3545;--bs-light:#f8f9fa;--bs-dark:#212529;--bs-primary-rgb:13, 110, 253;--bs-secondary-rgb:108, 117, 125;--bs-success-rgb:25, 135, 84;--bs-info-rgb:13, 202, 240;--bs-warning-rgb:255, 193, 7;--bs-danger-rgb:220, 53, 69;--bs-light-rgb:248, 249, 250;--bs-dark-rgb:33, 37, 41;--bs-primary-text-emphasis:#052c65;--bs-secondary-text-emphasis:#2b2f32;--bs-success-text-emphasis:#0a3622;--bs-info-text-emphasis:#055160;--bs-warning-text-emphasis:#664d03;--bs-danger-text-emphasis:#58151c;--bs-light-text-emphasis:#495057;--bs-dark-text-emphasis:#495057;--bs-primary-bg-subtle:#cfe2ff;--bs-secondary-bg-subtle:#e2e3e5;--bs-success-bg-subtle:#d1e7dd;--bs-info-bg-subtle:#cff4fc;--bs-warning-bg-subtle:#fff3cd;--bs-danger-bg-subtle:#f8d7da;--bs-light-bg-subtle:#fcfcfd;--bs-dark-bg-subtle:#ced4da;--bs-primary-border-subtle:#9ec5fe;--bs-secondary-border-subtle:#c4c8cb;--bs-success-border-subtle:#a3cfbb;--bs-info-border-subtle:#9eeaf9;--bs-warning-border-subtle:#ffe69c;--bs-danger-border-subtle:#f1aeb5;--bs-light-border-subtle:#e9ecef;--bs-dark-border-subtle:#adb5bd;--bs-white-rgb:255, 255, 255;--bs-black-rgb:0, 0, 0;--bs-font-sans-serif:system-ui, -apple-system, \"Segoe UI\", Roboto, \"Helvetica Neue\", \"Noto Sans\", \"Liberation Sans\", Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";--bs-font-monospace:SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;--bs-gradient:linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));--bs-body-font-family:var(--bs-font-sans-serif);--bs-body-font-size:1rem;--bs-body-font-weight:400;--bs-body-line-height:1.5;--bs-body-color:#212529;--bs-body-color-rgb:33, 37, 41;--bs-body-bg:#fff;--bs-body-bg-rgb:255, 255, 255;--bs-emphasis-color:#000;--bs-emphasis-color-rgb:0, 0, 0;--bs-secondary-color:rgba(33, 37, 41, 0.75);--bs-secondary-color-rgb:33, 37, 41;--bs-secondary-bg:#e9ecef;--bs-secondary-bg-rgb:233, 236, 239;--bs-tertiary-color:rgba(33, 37, 41, 0.5);--bs-tertiary-color-rgb:33, 37, 41;--bs-tertiary-bg:#f8f9fa;--bs-tertiary-bg-rgb:248, 249, 250;--bs-heading-color:inherit;--bs-link-color:#0d6efd;--bs-link-color-rgb:13, 110, 253;--bs-link-decoration:underline;--bs-link-hover-color:#0a58ca;--bs-link-hover-color-rgb:10, 88, 202;--bs-code-color:#d63384;--bs-highlight-bg:#fff3cd;--bs-border-width:1px;--bs-border-style:solid;--bs-border-color:#dee2e6;--bs-border-color-translucent:rgba(0, 0, 0, 0.175);--bs-border-radius:0.375rem;--bs-border-radius-sm:0.25rem;--bs-border-radius-lg:0.5rem;--bs-border-radius-xl:1rem;--bs-border-radius-xxl:2rem;--bs-border-radius-2xl:var(--bs-border-radius-xxl);--bs-border-radius-pill:50rem;--bs-box-shadow:0 0.5rem 1rem rgba(0, 0, 0, 0.15);--bs-box-shadow-sm:0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);--bs-box-shadow-lg:0 1rem 3rem rgba(0, 0, 0, 0.175);--bs-box-shadow-inset:inset 0 1px 2px rgba(0, 0, 0, 0.075);--bs-focus-ring-width:0.25rem;--bs-focus-ring-opacity:0.25;--bs-focus-ring-color:rgba(13, 110, 253, 0.25);--bs-form-valid-color:#198754;--bs-form-valid-border-color:#198754;--bs-form-invalid-color:#dc3545;--bs-form-invalid-border-color:#dc3545}[data-bs-theme=dark]{color-scheme:dark;--bs-body-color:#dee2e6;--bs-body-color-rgb:222, 226, 230;--bs-body-bg:#212529;--bs-body-bg-rgb:33, 37, 41;--bs-emphasis-color:#fff;--bs-emphasis-color-rgb:255, 255, 255;--bs-secondary-color:rgba(222, 226, 230, 0.75);--bs-secondary-color-rgb:222, 226, 230;--bs-secondary-bg:#343a40;--bs-secondary-bg-rgb:52, 58, 64;--bs-tertiary-color:rgba(222, 226, 230, 0.5);--bs-tertiary-color-rgb:222, 226, 230;--bs-tertiary-bg:#2b3035;--bs-tertiary-bg-rgb:43, 48, 53;--bs-primary-text-emphasis:#6ea8fe;--bs-secondary-text-emphasis:#a7acb1;--bs-success-text-emphasis:#75b798;--bs-info-text-emphasis:#6edff6;--bs-warning-text-emphasis:#ffda6a;--bs-danger-text-emphasis:#ea868f;--bs-light-text-emphasis:#f8f9fa;--bs-dark-text-emphasis:#dee2e6;--bs-primary-bg-subtle:#031633;--bs-secondary-bg-subtle:#161719;--bs-success-bg-subtle:#051b11;--bs-info-bg-subtle:#032830;--bs-warning-bg-subtle:#332701;--bs-danger-bg-subtle:#2c0b0e;--bs-light-bg-subtle:#343a40;--bs-dark-bg-subtle:#1a1d20;--bs-primary-border-subtle:#084298;--bs-secondary-border-subtle:#41464b;--bs-success-border-subtle:#0f5132;--bs-info-border-subtle:#087990;--bs-warning-border-subtle:#997404;--bs-danger-border-subtle:#842029;--bs-light-border-subtle:#495057;--bs-dark-border-subtle:#343a40;--bs-heading-color:inherit;--bs-link-color:#6ea8fe;--bs-link-hover-color:#8bb9fe;--bs-link-color-rgb:110, 168, 254;--bs-link-hover-color-rgb:139, 185, 254;--bs-code-color:#e685b5;--bs-border-color:#495057;--bs-border-color-translucent:rgba(255, 255, 255, 0.15);--bs-form-valid-color:#75b798;--bs-form-valid-border-color:#75b798;--bs-form-invalid-color:#ea868f;--bs-form-invalid-border-color:#ea868f}.spinner-grow,.spinner-border{display:inline-block;width:var(--bs-spinner-width);height:var(--bs-spinner-height);vertical-align:var(--bs-spinner-vertical-align);border-radius:50%;animation:var(--bs-spinner-animation-speed) linear infinite var(--bs-spinner-animation-name)}@keyframes spinner-border{to{transform:rotate(360deg) }}.spinner-border{--bs-spinner-width:2rem;--bs-spinner-height:2rem;--bs-spinner-vertical-align:-0.125em;--bs-spinner-border-width:0.25em;--bs-spinner-animation-speed:0.75s;--bs-spinner-animation-name:spinner-border;border:var(--bs-spinner-border-width) solid currentcolor;border-right-color:transparent}.spinner-border-sm{--bs-spinner-width:1rem;--bs-spinner-height:1rem;--bs-spinner-border-width:0.2em}@keyframes spinner-grow{0%{transform:scale(0)}50%{opacity:1;transform:none}}.spinner-grow{--bs-spinner-width:2rem;--bs-spinner-height:2rem;--bs-spinner-vertical-align:-0.125em;--bs-spinner-animation-speed:0.75s;--bs-spinner-animation-name:spinner-grow;background-color:currentcolor;opacity:0}.spinner-grow-sm{--bs-spinner-width:1rem;--bs-spinner-height:1rem}@media (prefers-reduced-motion: reduce){.spinner-border,.spinner-grow{--bs-spinner-animation-speed:1.5s}}.clearfix::after{display:block;clear:both;content:\"\"}.text-bg-primary{color:#fff !important;background-color:RGBA(var(--bs-primary-rgb), var(--bs-bg-opacity, 1)) !important}.text-bg-secondary{color:#fff !important;background-color:RGBA(var(--bs-secondary-rgb), var(--bs-bg-opacity, 1)) !important}.text-bg-success{color:#fff !important;background-color:RGBA(var(--bs-success-rgb), var(--bs-bg-opacity, 1)) !important}.text-bg-info{color:#000 !important;background-color:RGBA(var(--bs-info-rgb), var(--bs-bg-opacity, 1)) !important}.text-bg-warning{color:#000 !important;background-color:RGBA(var(--bs-warning-rgb), var(--bs-bg-opacity, 1)) !important}.text-bg-danger{color:#fff !important;background-color:RGBA(var(--bs-danger-rgb), var(--bs-bg-opacity, 1)) !important}.text-bg-light{color:#000 !important;background-color:RGBA(var(--bs-light-rgb), var(--bs-bg-opacity, 1)) !important}.text-bg-dark{color:#fff !important;background-color:RGBA(var(--bs-dark-rgb), var(--bs-bg-opacity, 1)) !important}.link-primary{color:RGBA(var(--bs-primary-rgb), var(--bs-link-opacity, 1)) !important;text-decoration-color:RGBA(var(--bs-primary-rgb), var(--bs-link-underline-opacity, 1)) !important}.link-primary:hover,.link-primary:focus{color:RGBA(10, 88, 202, var(--bs-link-opacity, 1)) !important;text-decoration-color:RGBA(10, 88, 202, var(--bs-link-underline-opacity, 1)) !important}.link-secondary{color:RGBA(var(--bs-secondary-rgb), var(--bs-link-opacity, 1)) !important;text-decoration-color:RGBA(var(--bs-secondary-rgb), var(--bs-link-underline-opacity, 1)) !important}.link-secondary:hover,.link-secondary:focus{color:RGBA(86, 94, 100, var(--bs-link-opacity, 1)) !important;text-decoration-color:RGBA(86, 94, 100, var(--bs-link-underline-opacity, 1)) !important}.link-success{color:RGBA(var(--bs-success-rgb), var(--bs-link-opacity, 1)) !important;text-decoration-color:RGBA(var(--bs-success-rgb), var(--bs-link-underline-opacity, 1)) !important}.link-success:hover,.link-success:focus{color:RGBA(20, 108, 67, var(--bs-link-opacity, 1)) !important;text-decoration-color:RGBA(20, 108, 67, var(--bs-link-underline-opacity, 1)) !important}.link-info{color:RGBA(var(--bs-info-rgb), var(--bs-link-opacity, 1)) !important;text-decoration-color:RGBA(var(--bs-info-rgb), var(--bs-link-underline-opacity, 1)) !important}.link-info:hover,.link-info:focus{color:RGBA(61, 213, 243, var(--bs-link-opacity, 1)) !important;text-decoration-color:RGBA(61, 213, 243, var(--bs-link-underline-opacity, 1)) !important}.link-warning{color:RGBA(var(--bs-warning-rgb), var(--bs-link-opacity, 1)) !important;text-decoration-color:RGBA(var(--bs-warning-rgb), var(--bs-link-underline-opacity, 1)) !important}.link-warning:hover,.link-warning:focus{color:RGBA(255, 205, 57, var(--bs-link-opacity, 1)) !important;text-decoration-color:RGBA(255, 205, 57, var(--bs-link-underline-opacity, 1)) !important}.link-danger{color:RGBA(var(--bs-danger-rgb), var(--bs-link-opacity, 1)) !important;text-decoration-color:RGBA(var(--bs-danger-rgb), var(--bs-link-underline-opacity, 1)) !important}.link-danger:hover,.link-danger:focus{color:RGBA(176, 42, 55, var(--bs-link-opacity, 1)) !important;text-decoration-color:RGBA(176, 42, 55, var(--bs-link-underline-opacity, 1)) !important}.link-light{color:RGBA(var(--bs-light-rgb), var(--bs-link-opacity, 1)) !important;text-decoration-color:RGBA(var(--bs-light-rgb), var(--bs-link-underline-opacity, 1)) !important}.link-light:hover,.link-light:focus{color:RGBA(249, 250, 251, var(--bs-link-opacity, 1)) !important;text-decoration-color:RGBA(249, 250, 251, var(--bs-link-underline-opacity, 1)) !important}.link-dark{color:RGBA(var(--bs-dark-rgb), var(--bs-link-opacity, 1)) !important;text-decoration-color:RGBA(var(--bs-dark-rgb), var(--bs-link-underline-opacity, 1)) !important}.link-dark:hover,.link-dark:focus{color:RGBA(26, 30, 33, var(--bs-link-opacity, 1)) !important;text-decoration-color:RGBA(26, 30, 33, var(--bs-link-underline-opacity, 1)) !important}.link-body-emphasis{color:RGBA(var(--bs-emphasis-color-rgb), var(--bs-link-opacity, 1)) !important;text-decoration-color:RGBA(var(--bs-emphasis-color-rgb), var(--bs-link-underline-opacity, 1)) !important}.link-body-emphasis:hover,.link-body-emphasis:focus{color:RGBA(var(--bs-emphasis-color-rgb), var(--bs-link-opacity, 0.75)) !important;text-decoration-color:RGBA(var(--bs-emphasis-color-rgb), var(--bs-link-underline-opacity, 0.75)) !important}.focus-ring:focus{outline:0;box-shadow:var(--bs-focus-ring-x, 0) var(--bs-focus-ring-y, 0) var(--bs-focus-ring-blur, 0) var(--bs-focus-ring-width) var(--bs-focus-ring-color)}.icon-link{display:inline-flex;gap:0.375rem;align-items:center;text-decoration-color:rgba(var(--bs-link-color-rgb), var(--bs-link-opacity, 0.5));text-underline-offset:0.25em;backface-visibility:hidden}.icon-link>.bi{flex-shrink:0;width:1em;height:1em;fill:currentcolor;transition:0.2s ease-in-out transform}@media (prefers-reduced-motion: reduce){.icon-link>.bi{transition:none}}.icon-link-hover:hover>.bi,.icon-link-hover:focus-visible>.bi{transform:var(--bs-icon-link-transform, translate3d(0.25em, 0, 0))}.ratio{position:relative;width:100%}.ratio::before{display:block;padding-top:var(--bs-aspect-ratio);content:\"\"}.ratio>*{position:absolute;top:0;left:0;width:100%;height:100%}.ratio-1x1{--bs-aspect-ratio:100%}.ratio-4x3{--bs-aspect-ratio:75%}.ratio-16x9{--bs-aspect-ratio:56.25%}.ratio-21x9{--bs-aspect-ratio:42.8571428571%}.fixed-top{position:fixed;top:0;right:0;left:0;z-index:1030}.fixed-bottom{position:fixed;right:0;bottom:0;left:0;z-index:1030}.sticky-top{position:sticky;top:0;z-index:1020}.sticky-bottom{position:sticky;bottom:0;z-index:1020}@media (min-width: 576px){.sticky-sm-top{position:sticky;top:0;z-index:1020}.sticky-sm-bottom{position:sticky;bottom:0;z-index:1020}}@media (min-width: 768px){.sticky-md-top{position:sticky;top:0;z-index:1020}.sticky-md-bottom{position:sticky;bottom:0;z-index:1020}}@media (min-width: 992px){.sticky-lg-top{position:sticky;top:0;z-index:1020}.sticky-lg-bottom{position:sticky;bottom:0;z-index:1020}}@media (min-width: 1200px){.sticky-xl-top{position:sticky;top:0;z-index:1020}.sticky-xl-bottom{position:sticky;bottom:0;z-index:1020}}@media (min-width: 1400px){.sticky-xxl-top{position:sticky;top:0;z-index:1020}.sticky-xxl-bottom{position:sticky;bottom:0;z-index:1020}}.hstack{display:flex;flex-direction:row;align-items:center;align-self:stretch}.vstack{display:flex;flex:1 1 auto;flex-direction:column;align-self:stretch}.visually-hidden,.visually-hidden-focusable:not(:focus):not(:focus-within){width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border:0 !important}.visually-hidden:not(caption),.visually-hidden-focusable:not(:focus):not(:focus-within):not(caption){position:absolute !important}.stretched-link::after{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;content:\"\"}.text-truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vr{display:inline-block;align-self:stretch;width:var(--bs-border-width);min-height:1em;background-color:currentcolor;opacity:0.25}*,*::before,*::after{box-sizing:border-box}@media (prefers-reduced-motion: no-preference){:root{scroll-behavior:smooth}}body{margin:0;font-family:var(--bs-body-font-family);font-size:var(--bs-body-font-size);font-weight:var(--bs-body-font-weight);line-height:var(--bs-body-line-height);color:var(--bs-body-color);text-align:var(--bs-body-text-align);background-color:var(--bs-body-bg);-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:rgba(0, 0, 0, 0)}hr{margin:1rem 0;color:inherit;border:0;border-top:var(--bs-border-width) solid;opacity:0.25}h6,h5,h4,h3,h2,h1{margin-top:0;margin-bottom:0.5rem;font-weight:500;line-height:1.2;color:var(--bs-heading-color)}h1{font-size:calc(1.375rem + 1.5vw)}@media (min-width: 1200px){h1{font-size:2.5rem}}h2{font-size:calc(1.325rem + 0.9vw)}@media (min-width: 1200px){h2{font-size:2rem}}h3{font-size:calc(1.3rem + 0.6vw)}@media (min-width: 1200px){h3{font-size:1.75rem}}h4{font-size:calc(1.275rem + 0.3vw)}@media (min-width: 1200px){h4{font-size:1.5rem}}h5{font-size:1.25rem}h6{font-size:1rem}p{margin-top:0;margin-bottom:1rem}abbr[title]{text-decoration:underline dotted;cursor:help;text-decoration-skip-ink:none}address{margin-bottom:1rem;font-style:normal;line-height:inherit}ol,ul{padding-left:2rem}ol,ul,dl{margin-top:0;margin-bottom:1rem}ol ol,ul ul,ol ul,ul ol{margin-bottom:0}dt{font-weight:700}dd{margin-bottom:0.5rem;margin-left:0}blockquote{margin:0 0 1rem}b,strong{font-weight:bolder}small{font-size:0.875em}mark{padding:0.1875em;background-color:var(--bs-highlight-bg)}sub,sup{position:relative;font-size:0.75em;line-height:0;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}a{color:rgba(var(--bs-link-color-rgb), var(--bs-link-opacity, 1));text-decoration:underline}a:hover{--bs-link-color-rgb:var(--bs-link-hover-color-rgb)}a:not([href]):not([class]),a:not([href]):not([class]):hover{color:inherit;text-decoration:none}pre,code,kbd,samp{font-family:var(--bs-font-monospace);font-size:1em}pre{display:block;margin-top:0;margin-bottom:1rem;overflow:auto;font-size:0.875em}pre code{font-size:inherit;color:inherit;word-break:normal}code{font-size:0.875em;color:var(--bs-code-color);word-wrap:break-word}a>code{color:inherit}kbd{padding:0.1875rem 0.375rem;font-size:0.875em;color:var(--bs-body-bg);background-color:var(--bs-body-color);border-radius:0.25rem}kbd kbd{padding:0;font-size:1em}figure{margin:0 0 1rem}img,svg{vertical-align:middle}table{caption-side:bottom;border-collapse:collapse}caption{padding-top:0.5rem;padding-bottom:0.5rem;color:var(--bs-secondary-color);text-align:left}th{text-align:inherit;text-align:-webkit-match-parent}thead,tbody,tfoot,tr,td,th{border-color:inherit;border-style:solid;border-width:0}label{display:inline-block}button{border-radius:0}button:focus:not(:focus-visible){outline:0}input,button,select,optgroup,textarea{margin:0;font-family:inherit;font-size:inherit;line-height:inherit}button,select{text-transform:none}[role=button]{cursor:pointer}select{word-wrap:normal}select:disabled{opacity:1}[list]:not([type=date]):not([type=datetime-local]):not([type=month]):not([type=week]):not([type=time])::-webkit-calendar-picker-indicator{display:none !important}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button:not(:disabled),[type=button]:not(:disabled),[type=reset]:not(:disabled),[type=submit]:not(:disabled){cursor:pointer}::-moz-focus-inner{padding:0;border-style:none}textarea{resize:vertical}fieldset{min-width:0;padding:0;margin:0;border:0}legend{float:left;width:100%;padding:0;margin-bottom:0.5rem;font-size:calc(1.275rem + 0.3vw);line-height:inherit}@media (min-width: 1200px){legend{font-size:1.5rem}}legend+*{clear:left}::-webkit-datetime-edit-fields-wrapper,::-webkit-datetime-edit-text,::-webkit-datetime-edit-minute,::-webkit-datetime-edit-hour-field,::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-year-field{padding:0}::-webkit-inner-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-color-swatch-wrapper{padding:0}::file-selector-button{font:inherit;-webkit-appearance:button}output{display:inline-block}iframe{border:0}summary{display:list-item;cursor:pointer}progress{vertical-align:baseline}[hidden]{display:none !important}:root{--bs-breakpoint-xs:0;--bs-breakpoint-sm:576px;--bs-breakpoint-md:768px;--bs-breakpoint-lg:992px;--bs-breakpoint-xl:1200px;--bs-breakpoint-xxl:1400px}.row{--bs-gutter-x:1.5rem;--bs-gutter-y:0;display:flex;flex-wrap:wrap;margin-top:calc(-1 * var(--bs-gutter-y));margin-right:calc(-0.5 * var(--bs-gutter-x));margin-left:calc(-0.5 * var(--bs-gutter-x))}.row>*{flex-shrink:0;width:100%;max-width:100%;padding-right:calc(var(--bs-gutter-x) * 0.5);padding-left:calc(var(--bs-gutter-x) * 0.5);margin-top:var(--bs-gutter-y)}.col{flex:1 0 0%}.row-cols-auto>*{flex:0 0 auto;width:auto}.row-cols-1>*{flex:0 0 auto;width:100%}.row-cols-2>*{flex:0 0 auto;width:50%}.row-cols-3>*{flex:0 0 auto;width:33.3333333333%}.row-cols-4>*{flex:0 0 auto;width:25%}.row-cols-5>*{flex:0 0 auto;width:20%}.row-cols-6>*{flex:0 0 auto;width:16.6666666667%}.col-auto{flex:0 0 auto;width:auto}.col-1{flex:0 0 auto;width:8.33333333%}.col-2{flex:0 0 auto;width:16.66666667%}.col-3{flex:0 0 auto;width:25%}.col-4{flex:0 0 auto;width:33.33333333%}.col-5{flex:0 0 auto;width:41.66666667%}.col-6{flex:0 0 auto;width:50%}.col-7{flex:0 0 auto;width:58.33333333%}.col-8{flex:0 0 auto;width:66.66666667%}.col-9{flex:0 0 auto;width:75%}.col-10{flex:0 0 auto;width:83.33333333%}.col-11{flex:0 0 auto;width:91.66666667%}.col-12{flex:0 0 auto;width:100%}.offset-1{margin-left:8.33333333%}.offset-2{margin-left:16.66666667%}.offset-3{margin-left:25%}.offset-4{margin-left:33.33333333%}.offset-5{margin-left:41.66666667%}.offset-6{margin-left:50%}.offset-7{margin-left:58.33333333%}.offset-8{margin-left:66.66666667%}.offset-9{margin-left:75%}.offset-10{margin-left:83.33333333%}.offset-11{margin-left:91.66666667%}.g-0,.gx-0{--bs-gutter-x:0}.g-0,.gy-0{--bs-gutter-y:0}.g-1,.gx-1{--bs-gutter-x:0.25rem}.g-1,.gy-1{--bs-gutter-y:0.25rem}.g-2,.gx-2{--bs-gutter-x:0.5rem}.g-2,.gy-2{--bs-gutter-y:0.5rem}.g-3,.gx-3{--bs-gutter-x:1rem}.g-3,.gy-3{--bs-gutter-y:1rem}.g-4,.gx-4{--bs-gutter-x:1.5rem}.g-4,.gy-4{--bs-gutter-y:1.5rem}.g-5,.gx-5{--bs-gutter-x:3rem}.g-5,.gy-5{--bs-gutter-y:3rem}@media (min-width: 576px){.col-sm{flex:1 0 0%}.row-cols-sm-auto>*{flex:0 0 auto;width:auto}.row-cols-sm-1>*{flex:0 0 auto;width:100%}.row-cols-sm-2>*{flex:0 0 auto;width:50%}.row-cols-sm-3>*{flex:0 0 auto;width:33.3333333333%}.row-cols-sm-4>*{flex:0 0 auto;width:25%}.row-cols-sm-5>*{flex:0 0 auto;width:20%}.row-cols-sm-6>*{flex:0 0 auto;width:16.6666666667%}.col-sm-auto{flex:0 0 auto;width:auto}.col-sm-1{flex:0 0 auto;width:8.33333333%}.col-sm-2{flex:0 0 auto;width:16.66666667%}.col-sm-3{flex:0 0 auto;width:25%}.col-sm-4{flex:0 0 auto;width:33.33333333%}.col-sm-5{flex:0 0 auto;width:41.66666667%}.col-sm-6{flex:0 0 auto;width:50%}.col-sm-7{flex:0 0 auto;width:58.33333333%}.col-sm-8{flex:0 0 auto;width:66.66666667%}.col-sm-9{flex:0 0 auto;width:75%}.col-sm-10{flex:0 0 auto;width:83.33333333%}.col-sm-11{flex:0 0 auto;width:91.66666667%}.col-sm-12{flex:0 0 auto;width:100%}.offset-sm-0{margin-left:0}.offset-sm-1{margin-left:8.33333333%}.offset-sm-2{margin-left:16.66666667%}.offset-sm-3{margin-left:25%}.offset-sm-4{margin-left:33.33333333%}.offset-sm-5{margin-left:41.66666667%}.offset-sm-6{margin-left:50%}.offset-sm-7{margin-left:58.33333333%}.offset-sm-8{margin-left:66.66666667%}.offset-sm-9{margin-left:75%}.offset-sm-10{margin-left:83.33333333%}.offset-sm-11{margin-left:91.66666667%}.g-sm-0,.gx-sm-0{--bs-gutter-x:0}.g-sm-0,.gy-sm-0{--bs-gutter-y:0}.g-sm-1,.gx-sm-1{--bs-gutter-x:0.25rem}.g-sm-1,.gy-sm-1{--bs-gutter-y:0.25rem}.g-sm-2,.gx-sm-2{--bs-gutter-x:0.5rem}.g-sm-2,.gy-sm-2{--bs-gutter-y:0.5rem}.g-sm-3,.gx-sm-3{--bs-gutter-x:1rem}.g-sm-3,.gy-sm-3{--bs-gutter-y:1rem}.g-sm-4,.gx-sm-4{--bs-gutter-x:1.5rem}.g-sm-4,.gy-sm-4{--bs-gutter-y:1.5rem}.g-sm-5,.gx-sm-5{--bs-gutter-x:3rem}.g-sm-5,.gy-sm-5{--bs-gutter-y:3rem}}@media (min-width: 768px){.col-md{flex:1 0 0%}.row-cols-md-auto>*{flex:0 0 auto;width:auto}.row-cols-md-1>*{flex:0 0 auto;width:100%}.row-cols-md-2>*{flex:0 0 auto;width:50%}.row-cols-md-3>*{flex:0 0 auto;width:33.3333333333%}.row-cols-md-4>*{flex:0 0 auto;width:25%}.row-cols-md-5>*{flex:0 0 auto;width:20%}.row-cols-md-6>*{flex:0 0 auto;width:16.6666666667%}.col-md-auto{flex:0 0 auto;width:auto}.col-md-1{flex:0 0 auto;width:8.33333333%}.col-md-2{flex:0 0 auto;width:16.66666667%}.col-md-3{flex:0 0 auto;width:25%}.col-md-4{flex:0 0 auto;width:33.33333333%}.col-md-5{flex:0 0 auto;width:41.66666667%}.col-md-6{flex:0 0 auto;width:50%}.col-md-7{flex:0 0 auto;width:58.33333333%}.col-md-8{flex:0 0 auto;width:66.66666667%}.col-md-9{flex:0 0 auto;width:75%}.col-md-10{flex:0 0 auto;width:83.33333333%}.col-md-11{flex:0 0 auto;width:91.66666667%}.col-md-12{flex:0 0 auto;width:100%}.offset-md-0{margin-left:0}.offset-md-1{margin-left:8.33333333%}.offset-md-2{margin-left:16.66666667%}.offset-md-3{margin-left:25%}.offset-md-4{margin-left:33.33333333%}.offset-md-5{margin-left:41.66666667%}.offset-md-6{margin-left:50%}.offset-md-7{margin-left:58.33333333%}.offset-md-8{margin-left:66.66666667%}.offset-md-9{margin-left:75%}.offset-md-10{margin-left:83.33333333%}.offset-md-11{margin-left:91.66666667%}.g-md-0,.gx-md-0{--bs-gutter-x:0}.g-md-0,.gy-md-0{--bs-gutter-y:0}.g-md-1,.gx-md-1{--bs-gutter-x:0.25rem}.g-md-1,.gy-md-1{--bs-gutter-y:0.25rem}.g-md-2,.gx-md-2{--bs-gutter-x:0.5rem}.g-md-2,.gy-md-2{--bs-gutter-y:0.5rem}.g-md-3,.gx-md-3{--bs-gutter-x:1rem}.g-md-3,.gy-md-3{--bs-gutter-y:1rem}.g-md-4,.gx-md-4{--bs-gutter-x:1.5rem}.g-md-4,.gy-md-4{--bs-gutter-y:1.5rem}.g-md-5,.gx-md-5{--bs-gutter-x:3rem}.g-md-5,.gy-md-5{--bs-gutter-y:3rem}}@media (min-width: 992px){.col-lg{flex:1 0 0%}.row-cols-lg-auto>*{flex:0 0 auto;width:auto}.row-cols-lg-1>*{flex:0 0 auto;width:100%}.row-cols-lg-2>*{flex:0 0 auto;width:50%}.row-cols-lg-3>*{flex:0 0 auto;width:33.3333333333%}.row-cols-lg-4>*{flex:0 0 auto;width:25%}.row-cols-lg-5>*{flex:0 0 auto;width:20%}.row-cols-lg-6>*{flex:0 0 auto;width:16.6666666667%}.col-lg-auto{flex:0 0 auto;width:auto}.col-lg-1{flex:0 0 auto;width:8.33333333%}.col-lg-2{flex:0 0 auto;width:16.66666667%}.col-lg-3{flex:0 0 auto;width:25%}.col-lg-4{flex:0 0 auto;width:33.33333333%}.col-lg-5{flex:0 0 auto;width:41.66666667%}.col-lg-6{flex:0 0 auto;width:50%}.col-lg-7{flex:0 0 auto;width:58.33333333%}.col-lg-8{flex:0 0 auto;width:66.66666667%}.col-lg-9{flex:0 0 auto;width:75%}.col-lg-10{flex:0 0 auto;width:83.33333333%}.col-lg-11{flex:0 0 auto;width:91.66666667%}.col-lg-12{flex:0 0 auto;width:100%}.offset-lg-0{margin-left:0}.offset-lg-1{margin-left:8.33333333%}.offset-lg-2{margin-left:16.66666667%}.offset-lg-3{margin-left:25%}.offset-lg-4{margin-left:33.33333333%}.offset-lg-5{margin-left:41.66666667%}.offset-lg-6{margin-left:50%}.offset-lg-7{margin-left:58.33333333%}.offset-lg-8{margin-left:66.66666667%}.offset-lg-9{margin-left:75%}.offset-lg-10{margin-left:83.33333333%}.offset-lg-11{margin-left:91.66666667%}.g-lg-0,.gx-lg-0{--bs-gutter-x:0}.g-lg-0,.gy-lg-0{--bs-gutter-y:0}.g-lg-1,.gx-lg-1{--bs-gutter-x:0.25rem}.g-lg-1,.gy-lg-1{--bs-gutter-y:0.25rem}.g-lg-2,.gx-lg-2{--bs-gutter-x:0.5rem}.g-lg-2,.gy-lg-2{--bs-gutter-y:0.5rem}.g-lg-3,.gx-lg-3{--bs-gutter-x:1rem}.g-lg-3,.gy-lg-3{--bs-gutter-y:1rem}.g-lg-4,.gx-lg-4{--bs-gutter-x:1.5rem}.g-lg-4,.gy-lg-4{--bs-gutter-y:1.5rem}.g-lg-5,.gx-lg-5{--bs-gutter-x:3rem}.g-lg-5,.gy-lg-5{--bs-gutter-y:3rem}}@media (min-width: 1200px){.col-xl{flex:1 0 0%}.row-cols-xl-auto>*{flex:0 0 auto;width:auto}.row-cols-xl-1>*{flex:0 0 auto;width:100%}.row-cols-xl-2>*{flex:0 0 auto;width:50%}.row-cols-xl-3>*{flex:0 0 auto;width:33.3333333333%}.row-cols-xl-4>*{flex:0 0 auto;width:25%}.row-cols-xl-5>*{flex:0 0 auto;width:20%}.row-cols-xl-6>*{flex:0 0 auto;width:16.6666666667%}.col-xl-auto{flex:0 0 auto;width:auto}.col-xl-1{flex:0 0 auto;width:8.33333333%}.col-xl-2{flex:0 0 auto;width:16.66666667%}.col-xl-3{flex:0 0 auto;width:25%}.col-xl-4{flex:0 0 auto;width:33.33333333%}.col-xl-5{flex:0 0 auto;width:41.66666667%}.col-xl-6{flex:0 0 auto;width:50%}.col-xl-7{flex:0 0 auto;width:58.33333333%}.col-xl-8{flex:0 0 auto;width:66.66666667%}.col-xl-9{flex:0 0 auto;width:75%}.col-xl-10{flex:0 0 auto;width:83.33333333%}.col-xl-11{flex:0 0 auto;width:91.66666667%}.col-xl-12{flex:0 0 auto;width:100%}.offset-xl-0{margin-left:0}.offset-xl-1{margin-left:8.33333333%}.offset-xl-2{margin-left:16.66666667%}.offset-xl-3{margin-left:25%}.offset-xl-4{margin-left:33.33333333%}.offset-xl-5{margin-left:41.66666667%}.offset-xl-6{margin-left:50%}.offset-xl-7{margin-left:58.33333333%}.offset-xl-8{margin-left:66.66666667%}.offset-xl-9{margin-left:75%}.offset-xl-10{margin-left:83.33333333%}.offset-xl-11{margin-left:91.66666667%}.g-xl-0,.gx-xl-0{--bs-gutter-x:0}.g-xl-0,.gy-xl-0{--bs-gutter-y:0}.g-xl-1,.gx-xl-1{--bs-gutter-x:0.25rem}.g-xl-1,.gy-xl-1{--bs-gutter-y:0.25rem}.g-xl-2,.gx-xl-2{--bs-gutter-x:0.5rem}.g-xl-2,.gy-xl-2{--bs-gutter-y:0.5rem}.g-xl-3,.gx-xl-3{--bs-gutter-x:1rem}.g-xl-3,.gy-xl-3{--bs-gutter-y:1rem}.g-xl-4,.gx-xl-4{--bs-gutter-x:1.5rem}.g-xl-4,.gy-xl-4{--bs-gutter-y:1.5rem}.g-xl-5,.gx-xl-5{--bs-gutter-x:3rem}.g-xl-5,.gy-xl-5{--bs-gutter-y:3rem}}@media (min-width: 1400px){.col-xxl{flex:1 0 0%}.row-cols-xxl-auto>*{flex:0 0 auto;width:auto}.row-cols-xxl-1>*{flex:0 0 auto;width:100%}.row-cols-xxl-2>*{flex:0 0 auto;width:50%}.row-cols-xxl-3>*{flex:0 0 auto;width:33.3333333333%}.row-cols-xxl-4>*{flex:0 0 auto;width:25%}.row-cols-xxl-5>*{flex:0 0 auto;width:20%}.row-cols-xxl-6>*{flex:0 0 auto;width:16.6666666667%}.col-xxl-auto{flex:0 0 auto;width:auto}.col-xxl-1{flex:0 0 auto;width:8.33333333%}.col-xxl-2{flex:0 0 auto;width:16.66666667%}.col-xxl-3{flex:0 0 auto;width:25%}.col-xxl-4{flex:0 0 auto;width:33.33333333%}.col-xxl-5{flex:0 0 auto;width:41.66666667%}.col-xxl-6{flex:0 0 auto;width:50%}.col-xxl-7{flex:0 0 auto;width:58.33333333%}.col-xxl-8{flex:0 0 auto;width:66.66666667%}.col-xxl-9{flex:0 0 auto;width:75%}.col-xxl-10{flex:0 0 auto;width:83.33333333%}.col-xxl-11{flex:0 0 auto;width:91.66666667%}.col-xxl-12{flex:0 0 auto;width:100%}.offset-xxl-0{margin-left:0}.offset-xxl-1{margin-left:8.33333333%}.offset-xxl-2{margin-left:16.66666667%}.offset-xxl-3{margin-left:25%}.offset-xxl-4{margin-left:33.33333333%}.offset-xxl-5{margin-left:41.66666667%}.offset-xxl-6{margin-left:50%}.offset-xxl-7{margin-left:58.33333333%}.offset-xxl-8{margin-left:66.66666667%}.offset-xxl-9{margin-left:75%}.offset-xxl-10{margin-left:83.33333333%}.offset-xxl-11{margin-left:91.66666667%}.g-xxl-0,.gx-xxl-0{--bs-gutter-x:0}.g-xxl-0,.gy-xxl-0{--bs-gutter-y:0}.g-xxl-1,.gx-xxl-1{--bs-gutter-x:0.25rem}.g-xxl-1,.gy-xxl-1{--bs-gutter-y:0.25rem}.g-xxl-2,.gx-xxl-2{--bs-gutter-x:0.5rem}.g-xxl-2,.gy-xxl-2{--bs-gutter-y:0.5rem}.g-xxl-3,.gx-xxl-3{--bs-gutter-x:1rem}.g-xxl-3,.gy-xxl-3{--bs-gutter-y:1rem}.g-xxl-4,.gx-xxl-4{--bs-gutter-x:1.5rem}.g-xxl-4,.gy-xxl-4{--bs-gutter-y:1.5rem}.g-xxl-5,.gx-xxl-5{--bs-gutter-x:3rem}.g-xxl-5,.gy-xxl-5{--bs-gutter-y:3rem}}.btn{--bs-btn-padding-x:0.75rem;--bs-btn-padding-y:0.375rem;--bs-btn-font-size:1rem;--bs-btn-font-weight:400;--bs-btn-line-height:1.5;--bs-btn-color:var(--bs-body-color);--bs-btn-bg:transparent;--bs-btn-border-width:var(--bs-border-width);--bs-btn-border-color:transparent;--bs-btn-border-radius:var(--bs-border-radius);--bs-btn-hover-border-color:transparent;--bs-btn-box-shadow:inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075);--bs-btn-disabled-opacity:0.65;--bs-btn-focus-box-shadow:0 0 0 0.25rem rgba(var(--bs-btn-focus-shadow-rgb), .5);display:inline-block;padding:var(--bs-btn-padding-y) var(--bs-btn-padding-x);font-family:var(--bs-btn-font-family);font-size:var(--bs-btn-font-size);font-weight:var(--bs-btn-font-weight);line-height:var(--bs-btn-line-height);color:var(--bs-btn-color);text-align:center;text-decoration:none;vertical-align:middle;cursor:pointer;user-select:none;border:var(--bs-btn-border-width) solid var(--bs-btn-border-color);border-radius:var(--bs-btn-border-radius);background-color:var(--bs-btn-bg);transition:color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out}@media (prefers-reduced-motion: reduce){.btn{transition:none}}.btn:hover{color:var(--bs-btn-hover-color);background-color:var(--bs-btn-hover-bg);border-color:var(--bs-btn-hover-border-color)}.btn-check+.btn:hover{color:var(--bs-btn-color);background-color:var(--bs-btn-bg);border-color:var(--bs-btn-border-color)}.btn:focus-visible{color:var(--bs-btn-hover-color);background-color:var(--bs-btn-hover-bg);border-color:var(--bs-btn-hover-border-color);outline:0;box-shadow:var(--bs-btn-focus-box-shadow)}.btn-check:focus-visible+.btn{border-color:var(--bs-btn-hover-border-color);outline:0;box-shadow:var(--bs-btn-focus-box-shadow)}.btn-check:checked+.btn,:not(.btn-check)+.btn:active,.btn:first-child:active,.btn.active,.btn.show{color:var(--bs-btn-active-color);background-color:var(--bs-btn-active-bg);border-color:var(--bs-btn-active-border-color)}.btn-check:checked+.btn:focus-visible,:not(.btn-check)+.btn:active:focus-visible,.btn:first-child:active:focus-visible,.btn.active:focus-visible,.btn.show:focus-visible{box-shadow:var(--bs-btn-focus-box-shadow)}.btn:disabled,.btn.disabled,fieldset:disabled .btn{color:var(--bs-btn-disabled-color);pointer-events:none;background-color:var(--bs-btn-disabled-bg);border-color:var(--bs-btn-disabled-border-color);opacity:var(--bs-btn-disabled-opacity)}.btn-primary{--bs-btn-color:#fff;--bs-btn-bg:#0d6efd;--bs-btn-border-color:#0d6efd;--bs-btn-hover-color:#fff;--bs-btn-hover-bg:#0b5ed7;--bs-btn-hover-border-color:#0a58ca;--bs-btn-focus-shadow-rgb:49, 132, 253;--bs-btn-active-color:#fff;--bs-btn-active-bg:#0a58ca;--bs-btn-active-border-color:#0a53be;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#fff;--bs-btn-disabled-bg:#0d6efd;--bs-btn-disabled-border-color:#0d6efd}.btn-secondary{--bs-btn-color:#fff;--bs-btn-bg:#6c757d;--bs-btn-border-color:#6c757d;--bs-btn-hover-color:#fff;--bs-btn-hover-bg:#5c636a;--bs-btn-hover-border-color:#565e64;--bs-btn-focus-shadow-rgb:130, 138, 145;--bs-btn-active-color:#fff;--bs-btn-active-bg:#565e64;--bs-btn-active-border-color:#51585e;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#fff;--bs-btn-disabled-bg:#6c757d;--bs-btn-disabled-border-color:#6c757d}.btn-success{--bs-btn-color:#fff;--bs-btn-bg:#198754;--bs-btn-border-color:#198754;--bs-btn-hover-color:#fff;--bs-btn-hover-bg:#157347;--bs-btn-hover-border-color:#146c43;--bs-btn-focus-shadow-rgb:60, 153, 110;--bs-btn-active-color:#fff;--bs-btn-active-bg:#146c43;--bs-btn-active-border-color:#13653f;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#fff;--bs-btn-disabled-bg:#198754;--bs-btn-disabled-border-color:#198754}.btn-info{--bs-btn-color:#000;--bs-btn-bg:#0dcaf0;--bs-btn-border-color:#0dcaf0;--bs-btn-hover-color:#000;--bs-btn-hover-bg:#31d2f2;--bs-btn-hover-border-color:#25cff2;--bs-btn-focus-shadow-rgb:11, 172, 204;--bs-btn-active-color:#000;--bs-btn-active-bg:#3dd5f3;--bs-btn-active-border-color:#25cff2;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#000;--bs-btn-disabled-bg:#0dcaf0;--bs-btn-disabled-border-color:#0dcaf0}.btn-warning{--bs-btn-color:#000;--bs-btn-bg:#ffc107;--bs-btn-border-color:#ffc107;--bs-btn-hover-color:#000;--bs-btn-hover-bg:#ffca2c;--bs-btn-hover-border-color:#ffc720;--bs-btn-focus-shadow-rgb:217, 164, 6;--bs-btn-active-color:#000;--bs-btn-active-bg:#ffcd39;--bs-btn-active-border-color:#ffc720;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#000;--bs-btn-disabled-bg:#ffc107;--bs-btn-disabled-border-color:#ffc107}.btn-danger{--bs-btn-color:#fff;--bs-btn-bg:#dc3545;--bs-btn-border-color:#dc3545;--bs-btn-hover-color:#fff;--bs-btn-hover-bg:#bb2d3b;--bs-btn-hover-border-color:#b02a37;--bs-btn-focus-shadow-rgb:225, 83, 97;--bs-btn-active-color:#fff;--bs-btn-active-bg:#b02a37;--bs-btn-active-border-color:#a52834;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#fff;--bs-btn-disabled-bg:#dc3545;--bs-btn-disabled-border-color:#dc3545}.btn-light{--bs-btn-color:#000;--bs-btn-bg:#f8f9fa;--bs-btn-border-color:#f8f9fa;--bs-btn-hover-color:#000;--bs-btn-hover-bg:#d3d4d5;--bs-btn-hover-border-color:#c6c7c8;--bs-btn-focus-shadow-rgb:211, 212, 213;--bs-btn-active-color:#000;--bs-btn-active-bg:#c6c7c8;--bs-btn-active-border-color:#babbbc;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#000;--bs-btn-disabled-bg:#f8f9fa;--bs-btn-disabled-border-color:#f8f9fa}.btn-dark{--bs-btn-color:#fff;--bs-btn-bg:#212529;--bs-btn-border-color:#212529;--bs-btn-hover-color:#fff;--bs-btn-hover-bg:#424649;--bs-btn-hover-border-color:#373b3e;--bs-btn-focus-shadow-rgb:66, 70, 73;--bs-btn-active-color:#fff;--bs-btn-active-bg:#4d5154;--bs-btn-active-border-color:#373b3e;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#fff;--bs-btn-disabled-bg:#212529;--bs-btn-disabled-border-color:#212529}.btn-outline-primary{--bs-btn-color:#0d6efd;--bs-btn-border-color:#0d6efd;--bs-btn-hover-color:#fff;--bs-btn-hover-bg:#0d6efd;--bs-btn-hover-border-color:#0d6efd;--bs-btn-focus-shadow-rgb:13, 110, 253;--bs-btn-active-color:#fff;--bs-btn-active-bg:#0d6efd;--bs-btn-active-border-color:#0d6efd;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#0d6efd;--bs-btn-disabled-bg:transparent;--bs-btn-disabled-border-color:#0d6efd;--bs-gradient:none}.btn-outline-secondary{--bs-btn-color:#6c757d;--bs-btn-border-color:#6c757d;--bs-btn-hover-color:#fff;--bs-btn-hover-bg:#6c757d;--bs-btn-hover-border-color:#6c757d;--bs-btn-focus-shadow-rgb:108, 117, 125;--bs-btn-active-color:#fff;--bs-btn-active-bg:#6c757d;--bs-btn-active-border-color:#6c757d;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#6c757d;--bs-btn-disabled-bg:transparent;--bs-btn-disabled-border-color:#6c757d;--bs-gradient:none}.btn-outline-success{--bs-btn-color:#198754;--bs-btn-border-color:#198754;--bs-btn-hover-color:#fff;--bs-btn-hover-bg:#198754;--bs-btn-hover-border-color:#198754;--bs-btn-focus-shadow-rgb:25, 135, 84;--bs-btn-active-color:#fff;--bs-btn-active-bg:#198754;--bs-btn-active-border-color:#198754;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#198754;--bs-btn-disabled-bg:transparent;--bs-btn-disabled-border-color:#198754;--bs-gradient:none}.btn-outline-info{--bs-btn-color:#0dcaf0;--bs-btn-border-color:#0dcaf0;--bs-btn-hover-color:#000;--bs-btn-hover-bg:#0dcaf0;--bs-btn-hover-border-color:#0dcaf0;--bs-btn-focus-shadow-rgb:13, 202, 240;--bs-btn-active-color:#000;--bs-btn-active-bg:#0dcaf0;--bs-btn-active-border-color:#0dcaf0;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#0dcaf0;--bs-btn-disabled-bg:transparent;--bs-btn-disabled-border-color:#0dcaf0;--bs-gradient:none}.btn-outline-warning{--bs-btn-color:#ffc107;--bs-btn-border-color:#ffc107;--bs-btn-hover-color:#000;--bs-btn-hover-bg:#ffc107;--bs-btn-hover-border-color:#ffc107;--bs-btn-focus-shadow-rgb:255, 193, 7;--bs-btn-active-color:#000;--bs-btn-active-bg:#ffc107;--bs-btn-active-border-color:#ffc107;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#ffc107;--bs-btn-disabled-bg:transparent;--bs-btn-disabled-border-color:#ffc107;--bs-gradient:none}.btn-outline-danger{--bs-btn-color:#dc3545;--bs-btn-border-color:#dc3545;--bs-btn-hover-color:#fff;--bs-btn-hover-bg:#dc3545;--bs-btn-hover-border-color:#dc3545;--bs-btn-focus-shadow-rgb:220, 53, 69;--bs-btn-active-color:#fff;--bs-btn-active-bg:#dc3545;--bs-btn-active-border-color:#dc3545;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#dc3545;--bs-btn-disabled-bg:transparent;--bs-btn-disabled-border-color:#dc3545;--bs-gradient:none}.btn-outline-light{--bs-btn-color:#f8f9fa;--bs-btn-border-color:#f8f9fa;--bs-btn-hover-color:#000;--bs-btn-hover-bg:#f8f9fa;--bs-btn-hover-border-color:#f8f9fa;--bs-btn-focus-shadow-rgb:248, 249, 250;--bs-btn-active-color:#000;--bs-btn-active-bg:#f8f9fa;--bs-btn-active-border-color:#f8f9fa;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#f8f9fa;--bs-btn-disabled-bg:transparent;--bs-btn-disabled-border-color:#f8f9fa;--bs-gradient:none}.btn-outline-dark{--bs-btn-color:#212529;--bs-btn-border-color:#212529;--bs-btn-hover-color:#fff;--bs-btn-hover-bg:#212529;--bs-btn-hover-border-color:#212529;--bs-btn-focus-shadow-rgb:33, 37, 41;--bs-btn-active-color:#fff;--bs-btn-active-bg:#212529;--bs-btn-active-border-color:#212529;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#212529;--bs-btn-disabled-bg:transparent;--bs-btn-disabled-border-color:#212529;--bs-gradient:none}.btn-link{--bs-btn-font-weight:400;--bs-btn-color:var(--bs-link-color);--bs-btn-bg:transparent;--bs-btn-border-color:transparent;--bs-btn-hover-color:var(--bs-link-hover-color);--bs-btn-hover-border-color:transparent;--bs-btn-active-color:var(--bs-link-hover-color);--bs-btn-active-border-color:transparent;--bs-btn-disabled-color:#6c757d;--bs-btn-disabled-border-color:transparent;--bs-btn-box-shadow:0 0 0 #000;--bs-btn-focus-shadow-rgb:49, 132, 253;text-decoration:underline}.btn-link:focus-visible{color:var(--bs-btn-color)}.btn-link:hover{color:var(--bs-btn-hover-color)}.btn-lg{--bs-btn-padding-y:0.5rem;--bs-btn-padding-x:1rem;--bs-btn-font-size:1.25rem;--bs-btn-border-radius:var(--bs-border-radius-lg)}.btn-sm{--bs-btn-padding-y:0.25rem;--bs-btn-padding-x:0.5rem;--bs-btn-font-size:0.875rem;--bs-btn-border-radius:var(--bs-border-radius-sm)}.spinner-grow,.spinner-border{display:inline-block;width:var(--bs-spinner-width);height:var(--bs-spinner-height);vertical-align:var(--bs-spinner-vertical-align);border-radius:50%;animation:var(--bs-spinner-animation-speed) linear infinite var(--bs-spinner-animation-name)}@keyframes spinner-border{to{transform:rotate(360deg) }}.spinner-border{--bs-spinner-width:2rem;--bs-spinner-height:2rem;--bs-spinner-vertical-align:-0.125em;--bs-spinner-border-width:0.25em;--bs-spinner-animation-speed:0.75s;--bs-spinner-animation-name:spinner-border;border:var(--bs-spinner-border-width) solid currentcolor;border-right-color:transparent}.spinner-border-sm{--bs-spinner-width:1rem;--bs-spinner-height:1rem;--bs-spinner-border-width:0.2em}@keyframes spinner-grow{0%{transform:scale(0)}50%{opacity:1;transform:none}}.spinner-grow{--bs-spinner-width:2rem;--bs-spinner-height:2rem;--bs-spinner-vertical-align:-0.125em;--bs-spinner-animation-speed:0.75s;--bs-spinner-animation-name:spinner-grow;background-color:currentcolor;opacity:0}.spinner-grow-sm{--bs-spinner-width:1rem;--bs-spinner-height:1rem}@media (prefers-reduced-motion: reduce){.spinner-border,.spinner-grow{--bs-spinner-animation-speed:1.5s}}:host{font-family:system-ui, -apple-system, \"Segoe UI\", Roboto, \"Helvetica Neue\", \"Noto Sans\", \"Liberation Sans\", Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";font-size:1rem;font-weight:400;line-height:1.5;color:#212529;display:block}justifi-payment-method-form{display:block;margin-left:calc(var(--jfi-layout-padding) * -1);margin-right:calc(var(--jfi-layout-padding) * -1)}*::part(label){color:var(--jfi-form-label-color);font-family:var(--jfi-form-label-font-family);font-weight:var(--jfi-form-label-font-weight);font-size:var(--jfi-form-label-font-size);margin:var(--jfi-form-label-margin)}*::part(input){font-family:var(--jfi-layout-font-family);background-color:var(--jfi-form-control-background-color);border-color:var(--jfi-form-control-border-color);border-width:var(--jfi-form-control-border-width);border-bottom-width:var(--jfi-form-control-border-bottom-width);border-left-width:var(--jfi-form-control-border-left-width);border-right-width:var(--jfi-form-control-border-right-width);border-top-width:var(--jfi-form-control-border-top-width);border-radius:var(--jfi-form-control-border-radius);border-style:var(--jfi-form-control-border-style);box-shadow:var(--jfi-form-control-box-shadow);color:var(--jfi-form-control-color);font-size:var(--jfi-form-control-font-size);font-weight:var(--jfi-form-control-font-weight);line-height:var(--jfi-form-control-line-height);margin:var(--jfi-form-control-margin);padding:var(--jfi-form-control-padding)}*::part(input):focus{color:var(--jfi-form-control-color-focus);border-color:var(--jfi-form-control-border-color-focus);box-shadow:var(--jfi-form-control-box-shadow-focus)}*::part(input-invalid){border-color:var(--jfi-form-control-border-color-error);box-shadow:var(--jfi-form-control-box-shadow-error)}*::part(input-invalid):focus{border-color:var(--jfi-form-control-border-color-error);box-shadow:var(--jfi-form-control-box-shadow-error-focus)}.jfi-submit-button{font-family:var(--jfi-layout-font-family);color:var(--jfi-submit-button-color);background-color:var(--jfi-submit-button-background-color);border-color:var(--jfi-submit-button-border-color);padding:var(--jfi-submit-button-padding);font-size:var(--jfi-submit-button-font-size);border-radius:var(--jfi-submit-button-border-radius);width:var(--jfi-submit-button-width);box-shadow:var(--jfi-submit-button-box-shadow)}.jfi-submit-button:hover{color:var(--jfi-submit-button-color-hover);background-color:var(--jfi-submit-button-background-color-hover);border-color:var(--jfi-submit-button-border-color-hover)}.jfi-submit-button:focus{color:var(--jfi-submit-button-color-focus);background-color:var(--jfi-submit-button-background-color-focus);border-color:var(--jfi-submit-button-border-color-focus)}.btn.jfi-submit-button:active{color:var(--jfi-submit-button-color-active);background-color:var(--jfi-submit-button-background-color-active);border-color:var(--jfi-submit-button-border-color-active)}.btn.jfi-submit-button-loading{min-width:75px;color:var(--jfi-submit-button-color-loading);background-color:var(--jfi-submit-button-background-color-loading);border-color:var(--jfi-submit-button-border-color-loading)}.btn.jfi-submit-button-loading .spinner-border{border-top-color:var(--jfi-submit-button-color-loading);border-bottom-color:var(--jfi-submit-button-color-loading);border-left-color:var(--jfi-submit-button-color-loading)}";
@@ -73,11 +73,21 @@ const PaymentForm = class {
     if (!billingFormValidation.isValid || !paymentMethodFormValidation.isValid)
       return;
     this.isLoading = true;
-    const billingFormFieldValues = await this.billingFormRef.getValues();
-    const paymentMethodData = Object.assign({ email: this.email }, billingFormFieldValues);
-    const tokenizeResponse = await this.paymentMethodFormRef.tokenize(this.clientId, paymentMethodData, this.accountId);
-    this.submitted.emit(tokenizeResponse);
-    this.isLoading = false;
+    try {
+      const billingFormFieldValues = await this.billingFormRef.getValues();
+      const paymentMethodData = Object.assign({ email: this.email }, billingFormFieldValues);
+      const tokenizeResponse = await this.paymentMethodFormRef.tokenize(this.clientId, paymentMethodData, this.accountId);
+      if (tokenizeResponse.error) {
+        console.error(`An error occured submitting the form: ${tokenizeResponse.error.message}`);
+      }
+      this.submitted.emit(tokenizeResponse);
+    }
+    catch (error) {
+      console.error(`An error occured submitting the form: ${error}`);
+    }
+    finally {
+      this.isLoading = false;
+    }
   }
   render() {
     return (index.h(index.Host, null, index.h("form", { class: "row gy-3" }, this.allowedPaymentMethodTypes.length > 1 && (index.h("div", { class: "col-12" }, index.h("justifi-payment-method-selector", { paymentMethodTypes: this.allowedPaymentMethodTypes, selectedPaymentMethodType: this.selectedPaymentMethodType }))), index.h("div", { class: "col-12" }, index.h("justifi-payment-method-form", { "payment-method-form-type": this.selectedPaymentMethodType, "iframe-origin": this.iframeOrigin, ref: el => {

package/dist/cjs/justifi-payment-method-form.cjs.entry.js

@@ -1494,7 +1494,7 @@ const MessageEventType = {
 };
 
 const name = "@justifi/webcomponents";
-const version = "4.7.1";
+const version = "4.7.2-rc.0";
 const description = "JustiFi Web Components";
 const main = "dist/index.cjs.js";
 const module$1 = "dist/components/index.js";
@@ -1506,6 +1506,7 @@ const repository = {
 	type: "git",
 	url: "git+https://github.com/justifi-tech/web-component-library.git"
 };
+const homepage = "https://storybook.justifi.ai/?path=/docs/introduction--docs";
 const publishConfig = {
 	registry: "https://registry.npmjs.org"
 };
@@ -1583,6 +1584,7 @@ const packageJson = {
 	collection: collection,
 	"collection:main": "dist/collection/index.js",
 	repository: repository,
+	homepage: homepage,
 	publishConfig: publishConfig,
 	files: files,
 	scripts: scripts,

package/dist/cjs/justifi-payments-list.cjs.entry.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-c5ace247.js');
 const Api = require('./Api-548eaa62.js');
 const Pagination = require('./Pagination-cae1dcbd.js');
-const Payout = require('./Payout-68a99ee3.js');
+const Payout = require('./Payout-f8240e9c.js');
 const utils = require('./utils-13d069be.js');
 const config = require('./config-a156df17.js');
 
@@ -47,28 +47,27 @@ const PaymentsList = class {
       return;
     }
     this.loading = true;
-    const api = Api.Api(this.authToken, config.config.proxyApiOrigin);
-    const endpoint = `account/${this.accountId}/payments`;
-    const response = await api.get(endpoint, this.params);
-    if (!response.error) {
-      this.paging = Object.assign(Object.assign({}, this.paging), response.page_info);
-      const data = (_a = response === null || response === void 0 ? void 0 : response.data) === null || _a === void 0 ? void 0 : _a.map(dataItem => new Payout.Payment(dataItem));
-      this.payments = data;
+    try {
+      const api = Api.Api(this.authToken, config.config.proxyApiOrigin);
+      const endpoint = `account/${this.accountId}/payments`;
+      const response = await api.get(endpoint, this.params);
+      if (!response.error) {
+        this.paging = Object.assign(Object.assign({}, this.paging), response.page_info);
+        const data = (_a = response === null || response === void 0 ? void 0 : response.data) === null || _a === void 0 ? void 0 : _a.map(dataItem => new Payout.Payment(dataItem));
+        this.payments = data;
+      }
+      else {
+        const responseError = typeof response.error === 'string' ? response.error : response.error.message;
+        console.error(`Error fetching payments: ${responseError}`);
+        this.errorMessage = 'No results';
+      }
     }
-    else {
-      this.errorMessage = typeof response.error === 'string' ? response.error : response.error.message;
+    catch (error) {
+      console.error(`Error fetching payments: ${error.message}`);
+      this.errorMessage = 'No results';
     }
-    this.loading = false;
-  }
-  getPaymentMethod(paymentMethod) {
-    return paymentMethod.card || paymentMethod.bank_account;
-  }
-  getPaymentMethodName(paymentMethod) {
-    if (paymentMethod.card) {
-      return paymentMethod.card.name;
-    }
-    else {
-      return paymentMethod.bank_account.account_owner_name;
+    finally {
+      this.loading = false;
     }
   }
   render() {
@@ -96,8 +95,8 @@ const PaymentsList = class {
         },
         utils.formatCurrency(payment.amount),
         payment.description,
-        this.getPaymentMethodName(payment.payment_method),
-        this.getPaymentMethod(payment.payment_method).acct_last_four,
+        payment.payment_method.payersName,
+        payment.payment_method.lastFourDigits,
         {
           type: 'inner',
           value: utils.MapPaymentStatusToBadge(payment.status)

package/dist/cjs/justifi-payout-details.cjs.entry.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-c5ace247.js');
 const Api = require('./Api-548eaa62.js');
 require('./Pagination-cae1dcbd.js');
-require('./Payout-68a99ee3.js');
+const Payout = require('./Payout-f8240e9c.js');
 const utils$1 = require('./utils-13d069be.js');
 const utils = require('./utils-4622829d.js');
 const config = require('./config-a156df17.js');
@@ -35,21 +35,29 @@ const PaymentDetails = class {
       return;
     }
     this.loading = true;
-    const endpoint = `payouts/${this.payoutId}`;
-    const response = await Api.Api(this.authToken, config.config.proxyApiOrigin).get(endpoint);
-    if (!response.error) {
-      this.payout = response.data;
+    try {
+      const endpoint = `payouts/${this.payoutId}`;
+      const response = await Api.Api(this.authToken, config.config.proxyApiOrigin).get(endpoint);
+      if (!response.error) {
+        this.payout = new Payout.Payout(response.data);
+      }
+      else {
+        const responseError = typeof response.error === 'string' ? response.error : response.error.message;
+        this.errorMessage = `Error fetching payout details: ${responseError}`;
+        console.error(this.errorMessage);
+      }
     }
-    else {
-      this.errorMessage = typeof response.error === 'string' ? response.error : response.error.message;
+    catch (error) {
+      this.errorMessage = `Error fetching payout details: ${error}`;
+      console.error(this.errorMessage);
+    }
+    finally {
+      this.loading = false;
     }
-    this.loading = false;
   }
   render() {
     var _a;
-    return (index.h(index.Host, null, this.loading ? utils.LoadingState :
-      !this.payout ? utils.ErrorState(this.errorMessage) :
-        index.h("justifi-details", { "error-message": this.errorMessage }, index.h(utils.EntityHeadInfo, { slot: "head-info", badge: index.h("span", { slot: 'badge', innerHTML: utils$1.MapPayoutStatusToBadge((_a = this.payout) === null || _a === void 0 ? void 0 : _a.status) }), title: `${utils$1.formatCurrency(this.payout.amount)} ${this.payout.currency.toUpperCase()}` }, index.h(utils.EntityHeadInfoItem, { classes: "border-1 border-end", title: "Updated At", value: `${utils$1.formatDate(this.payout.updated_at)} ${utils$1.formatTime(this.payout.updated_at)}` }), index.h(utils.EntityHeadInfoItem, { classes: "border-1 border-end", title: "Created At", value: `${utils$1.formatDate(this.payout.created_at)} ${utils$1.formatTime(this.payout.created_at)}` }), index.h(utils.EntityHeadInfoItem, { title: "ID", value: this.payout.id })), index.h("div", { slot: 'detail-sections' }, index.h(utils.DetailSection, { sectionTitle: "Details" }, index.h(utils.DetailItem, { title: "Date paid", value: utils$1.formatDate(this.payout.deposits_at) }), index.h(utils.DetailItem, { title: "Statement Description", value: this.payout.description }), index.h(utils.DetailItem, { title: "Payout Method", value: this.payout.delivery_method }), index.h(utils.DetailItem, { title: "Amount", value: utils$1.formatCurrency(this.payout.amount) }), index.h(utils.DetailItem, { title: "Fee", value: utils$1.formatCurrency(this.payout.fees_total) })), index.h(utils.DetailSection, { sectionTitle: "Account" }, index.h(utils.DetailItem, { title: "ID", value: this.payout.account_id }), index.h(utils.DetailItem, { title: "Account Type", value: this.payout.bank_account.account_type }), index.h(utils.DetailItem, { title: "Institution", value: this.payout.bank_account.account_type }), index.h(utils.DetailItem, { title: "Routing Number", value: this.payout.bank_account.routing_number }), index.h(utils.DetailItem, { title: "Account Number", value: this.payout.bank_account.account_number_last4 })), index.h(utils.DetailSection, { sectionTitle: 'Metadata' }, index.h(utils.CodeBlock, { metadata: this.payout.metadata }))))));
+    return (index.h(index.Host, null, this.loading && utils.LoadingState, !this.loading && this.errorMessage && utils.ErrorState(this.errorMessage), !this.loading && this.payout && (index.h("justifi-details", { "error-message": this.errorMessage }, index.h(utils.EntityHeadInfo, { slot: "head-info", badge: index.h("span", { slot: 'badge', innerHTML: utils$1.MapPayoutStatusToBadge((_a = this.payout) === null || _a === void 0 ? void 0 : _a.status) }), title: `${utils$1.formatCurrency(this.payout.amount)} ${this.payout.currency.toUpperCase()}` }, index.h(utils.EntityHeadInfoItem, { classes: "border-1 border-end", title: "Updated At", value: `${utils$1.formatDate(this.payout.updated_at)} ${utils$1.formatTime(this.payout.updated_at)}` }), index.h(utils.EntityHeadInfoItem, { classes: "border-1 border-end", title: "Created At", value: `${utils$1.formatDate(this.payout.created_at)} ${utils$1.formatTime(this.payout.created_at)}` }), index.h(utils.EntityHeadInfoItem, { title: "ID", value: this.payout.id })), index.h("div", { slot: 'detail-sections' }, index.h(utils.DetailSection, { sectionTitle: "Details" }, index.h(utils.DetailItem, { title: "Date paid", value: utils$1.formatDate(this.payout.deposits_at) }), index.h(utils.DetailItem, { title: "Statement Description", value: this.payout.description }), index.h(utils.DetailItem, { title: "Payout Method", value: this.payout.delivery_method }), index.h(utils.DetailItem, { title: "Amount", value: utils$1.formatCurrency(this.payout.amount) }), index.h(utils.DetailItem, { title: "Fee", value: utils$1.formatCurrency(this.payout.fees_total) })), index.h(utils.DetailSection, { sectionTitle: "Account" }, index.h(utils.DetailItem, { title: "ID", value: this.payout.account_id }), index.h(utils.DetailItem, { title: "Account Type", value: this.payout.bank_account.account_type }), index.h(utils.DetailItem, { title: "Institution", value: this.payout.bank_account.account_type }), index.h(utils.DetailItem, { title: "Routing Number", value: this.payout.bank_account.routing_number }), index.h(utils.DetailItem, { title: "Account Number", value: this.payout.bank_account.account_number_last4 })), index.h(utils.DetailSection, { sectionTitle: 'Metadata' }, index.h(utils.CodeBlock, { metadata: this.payout.metadata })))))));
   }
   static get watchers() { return {
     "payoutId": ["updateOnPropChange"],